与 <meta> 结合使用时对 Microdata itemref 技术的 W3C 验证答案

【问题标题】：W3C validation of Microdata itemref technique when combined with <meta>与 <meta> 结合使用时对 Microdata itemref 技术的 W3C 验证
【发布时间】：2014-10-15 08:40:31
【问题描述】：

考虑一下这个 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>

W3C 验证器这样抱怨：

元素 meta 缺少必需的属性 content。

… 并且指的是这一行：

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

但是content 属性应该在这里，因为itemref 属性表明内容驻留在当前范围之外的另一个元素中？在这种情况下，content 属性肯定超出了要求吗？

【问题讨论】：

注意：微数据定义when it is allowed to have meta in body：content 属性必须存在。

标签： html w3c-validation microdata

【解决方案1】：

您可以通过删除该元并将itemprop="address" 放在页脚中来修复它。

然后您可以从itemtype="http://schema.org/Organization" 行中引用页脚中的容器。

您代码中的微数据是有效的。它通过了Google's richsnippet validator。

<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>

【讨论】：