Какой тег HTML5 следует использовать для обозначения имени автора?

Например, сообщение в блоге или статья.

<article>
<h1>header<h1>
<time>09-02-2011</time>
<author>John</author>
My article....
</article>

Тег author не существует, хотя... Итак, каков обычно используемый тег HTML5 для авторов? Спасибо.

(Если нет, не должно быть одного?)

Ответ 1

HTML5 имеет тип ссылки автора:

<a href="http://johnsplace.com" rel="author">John</a>

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

<span class="author">John</span>

Ответ 2

Оба rel="author" и <address> являются предназначенные для этой цели. Оба поддерживаются в HTML5. Спектр говорит нам, что rel="author" можно использовать на <link> <a> и <area>. Google также рекомендует его использование. Сочетание использования <address> и rel="author" кажется оптимальным. HTML5 лучше всего позволяет обернуть <article> заголовки и вывести информацию в <header> так:

<article>
    <header>
        <h1 class="headline">Headline</h1>
        <div class="byline">
            <address class="author">By <a rel="author" href="/author/john-doe">John Doe</a></address> 
            on <time pubdate datetime="2011-08-28" title="August 28th, 2011">8/28/11</time>
        </div>
    </header>

    <div class="article-content">
    ...
    </div>
</article>
  • Атрибут pubdate указывает, что это опубликованная дата.

  • Атрибутами title являются необязательные эстакады.

  • Информацию о байне можно альтернативно обернуть в <footer> в <article>

Если вы хотите добавить микроформат hcard, я бы сделал так:

<article>
    <header>
        <h1 class="headline">Headline</h1>
        <div class="byline vcard">
            <address class="author">By <a rel="author" class="url fn n" href="/author/john-doe">John Doe</a></address> 
            on <time pubdate datetime="2011-08-28" title="August 28th, 2011">on 8/28/11</time>
        </div>
    </header>

    <div class="article-content">
    ...
    </div>
</article>

Ответ 3

В соответствии с спецификацией HTML5 вы, вероятно, хотите address.

Элемент адреса представляет собой контактную информацию для своего ближайшего предка элемента или тела.

Спектр далее ссылается на address в отношении авторов здесь

В разделе 4.4.4

Сведения об авторе, связанные с элементом статьи (q.v. адресный элемент) не относится к вложенным элементам статьи.

В разделе 4.4.9

Контактная информация для автора или редактора раздела принадлежит элемент адреса, возможно, сам внутри нижнего колонтитула.

Все, что делает, кажется, что address является лучшим тегом для этой информации.

Тем не менее, вы также можете указать address a rel или class author.

<address class="author">Jason Gennaro</address>

Подробнее: http://dev.w3.org/html5/spec/sections.html#the-address-element

Ответ 4

Поддержка Google rel= "author" устарела:

"Разметка авторства больше не поддерживается в веб-поиске".

Использовать элемент списка описания (список определений в HTML 4.01).

Из спецификация HTML5:

Элемент dl представляет собой список ассоциаций, состоящий из нулей или более групп значений имен (список описания). Группа имени-значения состоит из одного или нескольких имен (элементов dt), за которыми следуют одно или несколько значений (элементы dd), игнорируя любые узлы, отличные от элементов dt и dd. Внутри одного элемента dl не должно быть более одного элемента dt для каждого имени.

Группы с именами могут быть терминами и определениями, темами и значениями метаданных, вопросами и ответами или любыми другими группами данных с именем.

Авторство и другая мета-информация статьи идеально вписываются в этот ключ: структура пары значений:

  • кто автор
  • дата публикации статьи
  • структура сайта, в которой организована статья (категория/тег: строка/массивы)
  • и т.д..

Упрямый пример:

<article>
  <header>
    <h1>Article Title</h1>
    <p class="subtitle">Subtitle</p>
    <dl class="dateline">
      <dt>Author:</dt>
      <dd>Remy Schrader</dd>
      <dt>All posts by author:</dt>
      <dd><a href="http://www.blog.net/authors/remy-schrader/">Link</a></dd>
      <dt>Contact:</dt>
      <dd><a mailto="[email protected]"><img src="email-sprite.png"></a></dd>
    </dl>
  </header>
  <section class="content">
    <!-- article content goes here -->
  </section>
</article>

Как вы можете видеть при использовании элемента <dl> для метаданных статьи, мы можем обернуть теги <address>, <a> и даже <img> в тегах <dt> и/или <dd> в соответствии с характер содержимого и предполагаемая функция.
Теги <dl>, <dt> и <dd> могут выполнять свою работу - семантически - передавать информацию о родительском <article>; <a>, <img> и <address> также свободны выполнять свою работу - снова, семантически - передавая информацию о том, где найти связанный контент, невербальное визуальное представление и контактные данные для авторитетных сторон, соответственно.

Ответ 5

Как насчет microdata:

<article>
<h1>header<h1>
<time>09-02-2011</time>
<div id="john" itemscope itemtype="http://microformats.org/profile/hcard">
 <h2 itemprop="fn">
  <span itemprop="n" itemscope>
   <span itemprop="given-name">John</span>
  </span>
 </h2>
</div>
My article....
</article>

Ответ 6

Вы можете использовать

<meta name="author" content="John Doe">

в заголовке в соответствии с спецификацией HTML5.

Ответ 7

Если вы указали контактные данные для автора, то тег <address> подходит:

Но если его буквально просто имена авторов, для этого не существует определенного тега. HTML не содержит много связанных с людьми.

Ответ 8

В HTML5 мы можем использовать некоторые семантические метки, которые помогают упорядочить информацию о вашем типе контента, но дополнительные и связанные с предметом вы можете проверить schema.org. Это инициатива Google, Bing и Yahoo, которая направлена на то, чтобы помочь поисковым системам лучше понимать веб-сайты с помощью атрибутов микроданных. Tu post podría tener el siguiente aspecto:

<article itemscope itemtype="http://schema.org/Article">
<header>
  <h1 itemprop="headline">header</h1>
  <time itemprop="dateCreated datePublished">09-02-2011</time>
  <div itemprop="author publisher" itemscope itemtype="http://schema.org/Organization">
    <p>
        <img itemprop="image logo" src="..."/>
        <span itemprop="name">John</span>
    </p>
  </div>
</header>
<section itemprop="articleBody" >
    My article....
    <img itemprop="image" src="..."/>
</section>
</article>