Clever Geek Handbook

W3C validation of itempf method for microdata in combination with <meta>

Consider this HTML:

<header>
    <div id="logo" itemscope itemtype="http://schema.org/Organization">
        <a itemprop="url" href="//www.seashellswebsite.co.uk/">
            <img itemprop="logo" src="logo.gif" alt="Seaside Shells" title="Seaside Shells">
        </a>
        <meta itemprop="name" content="Seaside Shells">
        <meta itemprop="legalName" content="Seaside Shells Ltd">
        <meta itemscope itemprop="address" itemtype="http://schema.org/PostalAddress" itemref="schemaOrganizationAddress">
        <meta itemprop="description" content="We sell sea shells on the sea shore. The sea shells we sell are unfortunately rather overpriced.">
    </div>
</header>

<h1>Super Interesting Page</h1>
<p>Foo bar.</p>

<footer>
    <span id="schemaOrganizationAddress">
        <span itemprop="streetAddress">1 Seafront Road</span>,
        <span itemprop="addressLocality">Fishing Town</span>,
        <span itemprop="addressRegion">Coastal County</span>,
        <span itemprop="postalCode">12345</span>
    </span>
</footer>

The W3C validator complains like this:

The element is meta

missing a required attribute content

.

... and refers to this line:

<meta itemscope itemprop="address" itemtype="http://schema.org/PostalAddress" itemref="schemaOrganizationAddress">

But what should the attribute be content

if the attribute itemref

indicates that the content is in another element outside the current scope? Surely the attribute content

is overkill in relation to the requirement in this case?

+3


source to share


1 answer


You can fix this by getting rid of this meta and placing it itemprop="address"

in the footer.

Then you can reference the container in the footer from the row with itemtype="http://schema.org/Organization"

.



The microdata in your code is valid. It passes Google Analytics for authentication .

<header>
    <div id="logo" itemscope itemtype="http://schema.org/Organization" itemref="schemaOrganizationAddress">
        <a itemprop="url" href="//www.example.com/">
            <img itemprop="logo" src="logo.gif" alt="Seaside Shells" title="Seaside Shells">
        </a>
        <meta itemprop="name" content="Seaside Shells">
        <meta itemprop="legalName" content="Seaside Shells Ltd">
        <meta itemprop="description" content="We sell sea shells on the sea shore. The sea shells we sell are unfortunately rather overpriced.">
    </div>
</header>

<h1>Super Interesting Page</h1>
<p>Foo bar.</p>

<footer>
    <span id="schemaOrganizationAddress" itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
        <span itemprop="streetAddress">1 Seafront Road</span>,
        <span itemprop="addressLocality">Fishing Town</span>,
        <span itemprop="addressRegion">Coastal County</span>,
        <span itemprop="postalCode">12345</span>
    </span>
</footer>
+2


source






More articles:


All Articles