Which HTML5 tag should I use to mark up an author’s name?

Question

For example of a blog-post or article.

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

The author tag doesn't exist though... So what is the commonly used HTML5 tag for authors? Thanks.

(If there isn't, shouldn't there be one?)

Answer 1

Both rel="author" and <address> are designed for this exact purpose. Both are supported in HTML5. The spec tells us that rel="author" can be used on <link> <a>, and <area> elements. Google also recommends its usage. Combining use of <address> and rel="author" seems optimal. HTML5 best affords wrapping <article> headlines and bylines info in a <header> like so:

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

• The pubdate attribute indicates that that is the published date.

• The title attributes are optional flyovers.

• The byline info can alternatively be wrapped in a <footer> within an <article>

If you want to add the hcard microformat, then I would do so like this:

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