Как процитировать сообщение в блоге с использованием микроданных HTML и schema.org?

Моя цель - процитировать сообщение в блоге с помощью микроданных HTML.

Как я могу улучшить следующую разметку для цитат?

Я ищу улучшения в синтаксисе и семантике, чтобы получить результат, который хорошо работает со стандартами HTML5, хорошо проявляется в текущих браузерах и хорошо разбирается в поисковых системах.

Щедрость по этому вопросу предназначена для консультаций и рекомендаций экспертов. В моих исследованиях появилось много мнений и фрагментов, поэтому я ищу четкие ответы, полные образцы и каноническую документацию.

Это моя работа в процессе, и я ищу совета по ее правильности:

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

Ответы

Ответ 1

Если вы спросите меня, какую разметку использовать для списка ссылок на сообщения в блоге (контекст OPs), не видя ваш пример, Id перейдет с чем-то вроде этого:

<body itemscope itemtype="http://schema.org/WebPage">

<ul>
  <li>
    <cite itemprop="citation" itemscope itemtype="http://schema.org/BlogPosting">
      <a href="…" itemprop="url" rel="external"><span itemprop="name headline">Hello World</span></a>, 
      authored by <span itemprop="author" itemscope itemtype="http://schema.org/Person"><a href="…" itemprop="url" rel="external"><span itemprop="name">Alice</span></a></span>,
      posted on <span itemprop="isPartOf" itemscope itemtype="http://schema.org/CreativeWork"><a href="…" itemprop="url" rel="external"><span itemprop="name">Bob’s blog</span></a></span>.
    </cite>
  </li>
  <li>
    <cite itemprop="citation" itemscope itemtype="http://schema.org/BlogPosting">…</cite>
  </li>
</ul>

</body>

Использование элемента содержимого секционирования article, как и в вашем примере, безусловно возможно, хотя, возможно, необычно (если я понимаю ваше использование случай правильно): Поскольку article является элементом содержимого секционирования, он создает запись в контуре документа, которая может быть или не быть тем, что вы хотите для своего дела. (Вы можете проверить схему с помощью HTML5 Outliner, например.)

Еще одно указание на то, что элемент содержимого секционирования может не быть лучшим выбором: ваш article не содержит никакого фактического "основного" контента. Проще говоря, основное содержание элемента содержимого секционирования можно определить, разделив его метаданные: header, footer и address элементы. (Это явно не указано, но это следует из определений в Sections.)

Однако, не имея этого контента, это не так. И можно легко представить (и, может быть, вы все равно это сделаете), что вы цитируете фрагмент из сообщения в блоге (делаете этот случай похожим на запись результата поиска) в этом случае у вас есть:

<article>
  <header></header>
  <blockquote></blockquote> <!-- the non-metadata part of the article -->
  <footer></footer>
</article>

Далее предположим, что вы хотите использовать article.

Заметки о вашем HTML5:

Семантически, упаковка div не нужна. Вы можете напрямую добавить класс citation в article.
header element необязательный, если он просто содержит элемент заголовка (этот элемент имеет смысл, когда ваш заголовок состоит не только из элемента заголовка). Однако, конечно, это не так.
Id предпочитает включать элемент a в элемент cite (аналогично пятому примеру в спецификации).
Элемент span может содержать фразированный контент, поэтому address не разрешается в качестве дочернего.
Элемент address должен использоваться только в том случае, если он содержит контактную информацию. Поэтому, если этот элемент подходит, зависит от того, что доступно на связанной странице: если его контактная форма, да; если его список зарегистрированных сообщений в блоге, нет.
author тип ссылки может оказаться неприемлемым, поскольку он определен для предоставления информации об авторе article элемент. Но, строго говоря, вы являетесь автором. Если article будет состоять только из авторов рекламного сообщения в блоге, актуальным является использование типа ссылки author; но в вашем случае вы пишете контент ( "авторский", "размещен на" ).
Возможно, вы захотите использовать external тип ссылки для всех внешних ссылки.

Заметки о ваших микроданных:

Вы можете указать свойства Schema.org headline и name в том же itemprop (разделенном пробелом).
Возможно, вы захотите использовать Schema.orgs citation свойство в article (для чего требуется указать родительский тип CreativeWork или один из его дочерних типов, т.е. он может быть WebPage или даже AboutPage в вашем случае).

Взяв ваш пример, это даст:

<body itemscope itemtype="http://schema.org/WebPage">

<article itemprop="citation" itemscope itemtype="http://schema.org/BlogPosting" class="citation">
    <header>
      <h1>
          <cite itemprop="headline name"><a itemprop="url" href="…" rel="external">Hello World</a></cite>
      </h1>
    </header>
    <footer>
      authored by
      <span itemprop="author" itemscope itemtype="http://schema.org/Person">
          <a itemprop="url" href="…" rel="external"><span itemprop="name">Alice</span></a>
      </span>
      posted on
      <span itemprop="isPartOf" itemscope itemtype="http://schema.org/Blog">
        <a itemprop="url" href="…" rel="external"><span itemprop="name">Bob’s blog</span></a>
      </span>
    </footer>
</article>

</body>

(Все рассмотренные вещи, я по-прежнему предпочитаю вариант без сечения.)