我應該使用哪個 HTML5 標簽來標記作者的姓名？

Question

例如博客文章或文章。

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

雖然author標簽不存在... 那么作者常用的 HTML5 標簽是什么？ 謝謝。

（如果沒有，不應該有一個嗎？）

Answer 1

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屬性是可選的天橋。

• 署名信息也可以包含在<article>中的<footer>中

如果你想添加hcard microformat ，那么我會這樣做：

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

Answer 2

HTML5 有一個作者鏈接類型：

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

這里的弱點是它需要在某種鏈接上，但如果你有，這里有一個 關於替代方案的 長時間討論。 如果您沒有鏈接，則只需使用類屬性，這就是它的用途：

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

Answer 3

根據 HTML5 規范，您可能需要address 。

地址元素表示其最近的文章或正文元素祖先的聯系信息。

該規范進一步參考了關於作者的address here

根據 4.4.4

與文章元素（qv 地址元素）相關聯的作者信息不適用於嵌套的文章元素。

根據 4.4.9

某個部分的作者或編輯的聯系信息屬於地址元素，它本身可能位於頁腳內。

所有這些都使得address似乎是此信息的最佳標簽。

也就是說，你也可以給你的address一個rel或author class 。

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

閱讀更多： http : //dev.w3.org/html5/spec/sections.html#the-address-element

Answer 4

在 HTML5 中，我們可以使用一些語義標簽來幫助組織有關您的內容類型的信息，但您可以查看與主題相關的附加信息schema.org 。 這是谷歌、必應和雅虎的一項倡議，旨在通過微數據屬性幫助搜索引擎更好地理解網站。 您的帖子可能如下所示：

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

Answer 5

不推薦使用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="remy@blog.net"><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>類似地可以自由地完成他們的工作——同樣，在語義上——分別傳達有關在哪里可以找到相關內容、非語言視覺呈現和權威方的聯系方式的信息。

Answer 6

您可以使用

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

根據HTML5 規范在標頭中。

Answer 7

如果您包含作者的聯系方式，則<address>標簽是合適的：

• http://dev.w3.org/html5/spec-author-view/the-address-element.html#the-address-element

但如果它實際上只是作者的名字，則沒有特定的標簽。 HTML 沒有包含太多與人相關的內容。

Answer 8

微數據怎么樣：

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

Answer 9

為此，您可以使用元標記，如下所示：

 <head> <meta name="author" content="red bot"> </head>