Каково правильное использование schema.org SiteNavigationElement?

В терминах SEO...

Лучше ли поставить схему на родительский элемент, содержащий все ссылки?

<nav itemscope="itemscope" itemtype="http://www.schema.org/SiteNavigationElement">
    <a href="#">Link 1</a>
    <a href="#">Link 2</a>
    <a href="#">Link 3</a>
</nav>

... или должна ли каждая ссылка рассматриваться как ее собственный элемент?

<nav>
    <span itemscope="itemscope" itemtype="http://www.schema.org/SiteNavigationElement">
        <a itemprop="url" href="#">
            <span itemprop="name">Link 1</span>
        </a>
    </span>
    <span itemscope="itemscope" itemtype="http://www.schema.org/SiteNavigationElement">
        <a itemprop="url" href="#">
            <span itemprop="name">Link 2</span>
        </a>
    </span>
    <span itemscope="itemscope" itemtype="http://www.schema.org/SiteNavigationElement">
        <a itemprop="url" href="#">
            <span itemprop="name">Link 3</span>
        </a>
    </span>
</nav>

Ответы

Ответ 1

Если SiteNavigationElement предназначено для всей навигации (т.е. списка ссылок навигации), ваш первый пример правильный.

Если SiteNavigationElement предназначено для одной записи навигации (т.е. ссылки в списке ссылок навигации), ваш второй пример правильный.

Я думаю, что Schema.org не однозначно определяет, какой вариант подразумевается, поскольку они только говорят:

Элемент навигации на странице.

Однако родительский тип WebPageElement определяется как:

Элемент веб-страницы, такой как таблица или изображение

Кроме того, все остальные дочерние типы (например, Table или WPFooter) кажутся быть использованным для всего, а не конкретных частей вещи.

Таким образом, это означает, что вся навигация должна быть отмечена, а не каждая отдельная ссылка:

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

В этом случае все свойства принадлежат всей навигации, поэтому это означает, что свойство url будет указывать URL для этой навигации (а не URL-адреса ссылок в этой навигации!).

Ответ 2

Согласно Земле поисковой системы, он должен выглядеть следующим образом:

<ul itemscope itemtype="http://www.schema.org/SiteNavigationElement">
    <li itemprop="name">
        <a itemprop="url" href="#">Link 1</a>
    </li>
    <li itemprop="name">
        <a itemprop="url" href="#">Link 2</a>
    </li>
    <li itemprop="name">
        <a itemprop="url" href="#">Travel Resources</a>
    </li>
</ul>

Ответ 3

Первый ответ правильный, но я бы смешал и для семантики (HTML5-):

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

Ответ 4

<nav role="navigation">

    <ul role="menubar" aria-activedescendant="">

        <li role="presentation" itemscope itemtype="https://schema.org/SiteNavigationElement">
            <a href="" role="menuitem" tabindex="-1" itemprop="url">
                <span itemprop="name">Link 1</span>
            </a>
        </li>   

    </ul>

</nav>

Ответ 5

schema.org/SiteNavigationElement расширяет WebPageElement и может использоваться для разметки ссылок, что часто создает хорошие контекстные ссылки. Вы можете использовать эту схему для своего меню страницы.

<nav role="navigation" itemscope itemtype="http://schema.org/SiteNavigationElement">
<ul>
    <li>
        <a href="https://yoursite.com/" title="Link to Home" itemprop="url">
            <span itemprop="name">Home</span>
        </a>
    </li>
    <li>
        <a href="https://yoursite.com/sample-page" title="Link to sample page" itemprop="url">
            <span itemprop="name">sample page</span>
        </a>
    </li>
</ul>

Ответ 6

ОП оригинальный вопрос содержал хороший пример кода. ни один из ответов не делает, хотя...

Кажется, что все дали несколько случайный ответ... Вы можете проверить код микроданных своей схемы, используя следующий официальный инструмент Google search.google.com/structured-data/testing-tool.

Если вы запустите предложенные ответы в этом инструменте, вы заметите, что ни один из них не даст ожидаемого результата: список SiteNavigationElement с именем и URL

Некоторые могут возразить, что все меню можно считать "элементом навигации", но я думаю, что для этого наименования имеет больше смысла обозначать одну навигационную ссылку. Кроме того, если мы будем использовать SiteNavigationElement в качестве маркера для всего меню, у нас не будет возможности связать имена с URL-адресами в HTML.

Чтобы достичь этого, вам нужно, чтобы каждая ссылка была инкапсулирована свойством itemscope и все они должны иметь свое собственное name и url itemprop (это одноэлементно, как упомянуто @David Harkness, поэтому они должны появляться только один раз за 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>

Приведенный выше код приведет к появлению двух разных элементов навигации, каждый с именем и URL.

Примечание. itemprop="url" использует в качестве значения атрибут привязки href

Ответ 7

Это зависит от поисковой системы. Учитывая следующий фрагмент кода:

<nav itemscope itemtype="http://schema.org/SiteNavigationElement">
  <meta itemprop="name" content="Navigation Menu">
  <a itemprop="url" href="/">Overview</a>
  <a itemprop="url" href="/feature/">Features</a>
  <a itemprop="url" href="/module/">Modules</a>
  <a itemprop="url" href="/shortcode/">Shortcodes</a>
  <a itemprop="url" href="/extra/">Extras</a>
  <a itemprop="url" href="/search/">Search</a>
</nav>

Инструмент тестирования структурированных данных Яндекса вернет:

sitenavigationelement
  itemType = http://schema.org/SiteNavigationElement
  name = Navigation Menu
  url
    href = /
    text = Overview
  url
    href = /feature/
    text = Features
  url
    href = /module/
    text = Modules
  url
    href = /shortcode/
    text = Shortcodes
  url
    href = /extra/
    text = Extras
  url
    href = /search/
    text = Search

Принимая во внимание, что инструмент Google возвращает:

SiteNavigationElement
0 ERRORS
0 WARNINGS
@type = SiteNavigationElement
name = Navigation Menu
url = https://domain.example/
url = https://domain.example/feature/
url = https://domain.example/module/
url = https://domain.example/shortcode/
url = https://domain.example/extra/
url = https://domain.example/search/

Оба инструмента показывают структурированные данные, и оба обеспечивают семантическую ценность, помимо просто использования nav. Поэтому, хотя некоторые считают, что SiteNavigationElement следует полностью исключить, они также, в том же потоке мысли, признаются в том, что они "распознают" - это то, что я предоставил здесь.

Вы должны поместить SiteNavigationElement в оболочку вокруг группы отдельных URL-адресов, используемых в вашей навигации, чтобы вы могли называть саму навигацию с помощью itemprop="name".

Поэтому первый пример верен.

Ответ 8

Это зависит от поисковой системы. Учитывая следующий фрагмент кода:

<nav itemscope itemtype="http://schema.org/SiteNavigationElement">
  <meta itemprop="name" content="Navigation Menu">
  <a itemprop="url" href="/">Overview</a>
  <a itemprop="url" href="/feature/">Features</a>
  <a itemprop="url" href="/module/">Modules</a>
  <a itemprop="url" href="/shortcode/">Shortcodes</a>
  <a itemprop="url" href="/extra/">Extras</a>
  <a itemprop="url" href="/search/">Search</a>
</nav>

Инструмент тестирования структурированных данных Яндекса вернет:

sitenavigationelement
  itemType = http://schema.org/SiteNavigationElement
  name = Navigation Menu
  url
    href = /
    text = Overview
  url
    href = /feature/
    text = Features
  url
    href = /module/
    text = Modules
  url
    href = /shortcode/
    text = Shortcodes
  url
    href = /extra/
    text = Extras
  url
    href = /search/
    text = Search

Принимая во внимание, что инструмент Google возвращает:

SiteNavigationElement
0 ERRORS
0 WARNINGS
@type = SiteNavigationElement
name = Navigation Menu
url = https://domain.example/
url = https://domain.example/feature/
url = https://domain.example/module/
url = https://domain.example/shortcode/
url = https://domain.example/extra/
url = https://domain.example/search/

Поэтому первый пример более "правильный".