In SEO terms...
Is it best to put the scheme on the parent containing all the links?
OP's original question contained a good example of code. none of the answers do though ...
It seems everyone threw in a somewhat random answer ... You can test your schema microdata code using the following official google tool search.google.com/structured-data/testing-tool.
If you run the proposed answers in this tool you will notice that none give you the expected result: a list of SiteNavigationElement
with a name & url
Some might argue that a whole menu might be considered a "navigation element" but I think it makes more sense for this denomination to designate a single navigation link. Plus if we use the SiteNavigationElement
as a marker for the whole menu we have no way of associating names with URLs in the html.
To achieve this, you need to have each link be encapsulated by an itemscope
property and they all need to have their own name
and url
itemprop
(these are singleton as mentioned by @David Harkness, so they have to appear only once per itemprop
)
<nav>
<ul>
<li itemscope itemtype="http://schema.org/SiteNavigationElement">
<a itemprop="url" href="http://example.com/link-1">
<span itemprop="name">Link 1</span>
</a>
</li>
<li itemscope itemtype="http://schema.org/SiteNavigationElement">
<a itemprop="url" href="http://example.com/link-2">
<span itemprop="name">Link 2</span>
</a>
</li>
</ul>
</nav>
The code above will yeld two different navigation elements, each with a name and an URL.
Note: the itemprop="url"
attribute uses the anchor's href
attribute as value
If SiteNavigationElement
is meant for the whole navigation (i.e., a navigation link list), your first example is correct.
If SiteNavigationElement
is meant for a single navigation entry (i.e., a link in the navigation link list), your second example is correct.
I think Schema.org doesn’t unambiguously define which variant is meant, as they only say:
A navigation element of the page.
However, the parent type WebPageElement is defined as:
A web page element, like a table or an image
Also, all the other child types (like Table or WPFooter) seem to be used for the whole thing, and not specific parts of the thing.
So this seems to suggest that the whole navigation should be marked up, and not each single link:
<nav itemscope itemtype="http://schema.org/SiteNavigationElement">
<ul>
<li><a href="/link-1">Link 1</a></li> <!-- don’t use the 'url' or 'name' property here! -->
<li><a href="/link-2">Link 2</a></li>
</ul>
</nav>
In this case, all the properties belong to the whole navigation, so that means the url
property would specify a URL for this navigation (and not the URLs of the links in this navigation!).
First answer is correct but I'd mix both for (HTML5-)semantic:
<nav itemscope itemtype="http://schema.org/SiteNavigationElement">
<ul>
<li>
<a itemprop="url" href="http://example.com/">
<span itemprop="name">Link 1</span>
</a>
</li>
</ul>
</nav>
Here's a quote from a post at Google support site, saying:
We are contemplating to implement Site Navigation Schema https://schema.org/SiteNavigationElement
Will google respect it and display sitelinks if the schema is there or it will do it own thing anyway? I sthere a point at all?
This type of top-level does not currently support Google. In fact, this type does not even have a scope definition. It is unclear whether this type affects a group, for example, a navigation menu, or only one link.
This confirms my experience with their rich results test: only breadcrumbs are recognized. Yandex validates my microdata just fine. So SiteNavigationElement
on your page seems to be as useless as it is valid.
Consider the following code snippet adapted from the page source of habd.as:
<nav itemscope itemtype="https://schema.org/SiteNavigationElement">
<meta itemprop="name" content="Main Menu">
<a itemprop="url" class="active" href="/">habd.as</a>
<a itemprop="url" href="/code/">Code</a>
<a itemprop="url" href="/post/">Posts</a>
<a itemprop="url" href="/site/">Sites</a>
<a itemprop="url" href="/talk/">Talks</a>
</nav>
<nav itemscope itemtype="https://schema.org/SiteNavigationElement">
<meta itemprop="name" content="Utility Menu">
<a itemprop="url" href="/about/">About</a>
<a itemprop="url" href="/contact/">Contact</a>
</nav>
When there are multiple navigations as shown above, use of SiteNavigationElement
to group navigation items affords the use of name
such that the grouping itself may be labeled. Labels for individual items within the groups can be obtained using the content of the links themselves.
Therefore, your first example is more correct despite assertions to the contrary.
I think the most elegent solution would be to use the hasPart property.
<nav itemscope="itemscope" itemtype="http://www.schema.org/SiteNavigationElement">
<a itemprop="hasPart" href="/link1.html">Link 1</a>
<a itemprop="hasPart" href="/link2.html">Link 2</a>
<a itemprop="hasPart" href="/link3.html">Link 3</a>
</nav>
Using Google's Structure Data Testing Tool informs that these links are part of the SiteNavigationElement and that Google should follow the links to those items: