authorship

From IndieWeb

authorship is how to indicate who the author is for a post, and an algorithm that determines the author of a post.

See the specification to implement the algorithm:

Why

You should clearly indicate who is the author of a post so when other sites summarize or reply to your post, they can properly recognize the author(s)!

How to publish

Publishing your authorship of a post is designed to be both easy and flexible to adapt to a variety of publishing methods and designs. Any of the following are fine.

Choose whichever is the least work for you, your site, your theme(s), your code, and easiest for you to maintain!

Authorship for individual posts

For individual posts, (such as a post displayed on its permalink), you have a few options for how to provide authorship information.

Full author information in each post

If your posts have your name and photo already visible, then your h-entry for the post can include a full h-card with the complete author info for the post, by adding an explicit p-author or u-author property with an embedded h-card, e.g. <a class="u-author h-card" href="/">…</a>

Example: 

<div class="h-entry">
  <a href="/" class="u-author h-card">
    <img src="/me.jpg" class="u-photo"> 
    <span class="p-name">Author Name</span>
  </a>
  <div class="e-content">This is an example note</div>
</div>

Author information in a header or footer

If you have an h-card on your website in a header or footer, you can avoid duplicating the author information inside the h-entry by establishing a link between the two: add a <a class="u-author" href="/"></a> inside your post h-entry (an invisible link to your home page), and ensure the h-card in your header or footer has a url property that also links to your home page.

Example: 

<div class="h-entry">
  <div class="e-content">This is an example note</div>
  <a href="/" class="u-author"></a>
</div>

...

<footer>
  <a href="/" class="h-card">
    <img src="/me.jpg" class="u-photo"> 
    <span class="p-name">Author Name</span>
  </a>
</footer>

(This example has a minimal h-card but you can include as many details in the h-card as you would like)

Authorship on a dedicated page

See #Dedicated author page


Authorship for streams of posts

For a page with a stream of posts (like on an archive, homepage, etc.), you may want to avoid duplicating authorship information on each individual post.

Include authorship with h-feed markup

If you have a top-level h-feed, then you can include a u-author property on that feed, either as a full h-card or referencing an h-card in the header or footer as described above.

Example: 

<div class="h-feed">
  <a href="/" class="u-author h-card">
    <img src="/me.jpg"> 
    Author Name
  </a>

  <div class="h-entry">
    <span class="e-content">This is an example note</span>
  </div>
  <div class="h-entry">
    <span class="e-content">This is an example note</span>
  </div>
</div>

(This example has a minimal h-card but you can include as many details in the h-card as you would like)

Include authorship without h-feed markup

If you don't have an h-feed and want to display your author info in your website header or footer, you will need to include an invisible u-author property in each h-entry that shares the same url property as your header or footer h-card.

Example: 

  <div class="h-entry">
    <span class="e-content">This is an example note</span>
    <a href="/" class="u-author"></a>
  </div>
  <div class="h-entry">
    <span class="e-content">This is an example note</span>
    <a href="/" class="u-author"></a>
  </div>
  ...
  <footer>
    <a href="/" class="h-card">
      <img src="/me.jpg">
      Author Name
    </a>
  </footer>

Dedicated author page

If you don't want to show any author information on your post permalinks or feed pages, you can create an h-card on your home page and link to it from an invisible u-author property in each post or feed.

Example permalink: 

<div class="h-entry">
  <div class="e-content">This is an example note</div>
  <a href="/" class="u-author"></a>
</div>

Home page: 

...
<div class="h-card">
  <img src="/me.jpg" class="u-photo">
  <a href="/" class="u-url p-name">Author Name</a>
</div>
...

(This example has a minimal h-card but you can include as many details in the h-card as you would like)

Validate

Try this authorship testing tool to validate your authorship markup - it will tell you how the authorship algorithm finds your author information on a permalink:

You can use the preview feature of Monocle to see if a feed or post will look good in a reader:

How to determine

See authorship-spec.

See Also

Retrieved from "https://indieweb.org/wiki/index.php?title=authorship&oldid=96442"