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

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

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

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

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

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

Используйте <div class="citation">, чтобы обернуть все.
Используйте <article> с itemscope и BlogPost, чтобы обернуть информацию о сообщении, включая его вложенную информацию.
Используйте <header> и <h1 itemprop="headline">, чтобы обернуть ссылку на сообщение.
Используйте <cite>, чтобы обернуть имя сообщения.
Используйте <footer>, чтобы обернуть информацию об авторе и информацию о блоге.
Используйте <address>, чтобы обернуть ссылку и имя автора.
Используйте rel="author" для аннотирования ссылки на имя автора.
Используйте itemprop="isPartOf" для подключения сообщения к блогу.

Это моя работа в разработке HTML-источника:

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

Связанные примечания:

В теге <cite> тег W3 говорится, что тег - это "уровень фразы", поэтому он работает как встроенный диапазон, а не div блока. Но тег <article>, по-видимому, выигрывает от использования <h1>, <header>, <footer>. Насколько я могу судить, спецификация не дает решения для цитирования статьи, используя <cite> для обертывания <article>. Есть ли решение для этого или обходного пути? (Проделанная работа подталкивает это, используя <div class="citation">)
В теге <address> тег W3 говорится о содержании "Элемент адреса не должен использоваться для представления произвольных адресов, если эти адреса фактически не являются соответствующей контактной информацией". Насколько я могу судить, спецификация не дает решения для обозначения URL-адреса автора статьи и имени, в отличие от контактной информации статьи. Есть ли решение для этого или обходного пути? (Проделанная работа подталкивает это, используя <address> для URL-адреса автора и имени)

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

Ответ 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>

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