wake-up-neo.com

Welches HTML5-Tag soll ich verwenden, um den Namen eines Autors zu kennzeichnen?

Zum Beispiel eines Blogposts oder Artikels.

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

Das author -Tag existiert jedoch nicht ... Was ist das häufig verwendete HTML5-Tag für Autoren? Vielen Dank.

(Wenn es keine gibt, sollte es keine geben?)

88
Quang Van

HTML5 hat einen Autorenlink-Typ :

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

Die Schwäche hier ist, dass es auf einer Art Link sein muss, aber wenn Sie das haben, gibt es ein lange Diskussion über Alternativen hier . Wenn Sie keinen Link haben, verwenden Sie einfach ein Klassenattribut.

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

Beide rel="author" und <address> sind genau für diesen Zweck konzipiert. Beide werden in HTML5 unterstützt. Die Spezifikation sagt uns, dass rel="author" kann verwendet werden auf <link><a>, und <area> Elemente. Google auch empfiehlt seine Verwendung . Kombinieren der Verwendung von <address> und rel="author" scheint optimal. HTML5 bietet sich am besten zum Umschließen an <article> Überschriften und Bylines in einem <header> wie 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>
  • Das Attribut pubdate gibt an, dass dies das Veröffentlichungsdatum ist.

  • Die title Attribute sind optionale Überflüge.

  • Die Byline-Informationen können alternativ in ein <footer> innerhalb eines <article>

Wenn Sie das hcard microformat hinzufügen möchten, würde ich dies folgendermaßen tun:

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

Gemäß der HTML5-Spezifikation möchten Sie wahrscheinlich address.

Das Adresselement stellt die Kontaktinformationen für den nächsten Artikel oder das nächste Textelement des Vorfahren dar.

In der Spezifikation wird bezüglich der Autoren hier auf address verwiesen

Unter 4.4.4

Mit einem Artikelelement verknüpfte Autoreninformationen (siehe Adresselement) gelten nicht für verschachtelte Artikelelemente.

Unter 4.4.9

Kontaktinformationen für den Autor oder Herausgeber eines Abschnitts gehören in ein Adresselement, möglicherweise selbst in eine Fußzeile.

All das scheint, dass address der beste Tag für diese Info ist.

Das heißt, Sie können Ihrer address auch eine rel oder class von author zuweisen.

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

Lesen Sie mehr: http://dev.w3.org/html5/spec/sections.html#the-address-element

17
Jason Gennaro

Google-Unterstützung für rel = "author" veraltet :

"Autorenmarkup wird in der Websuche nicht mehr unterstützt."

Verwenden Sie ein Beschreibungslistenelement (Definitionsliste in HTML 4.01).

Aus der HTML5-Spezifikation :

Das dl-Element repräsentiert eine Zuordnungsliste, die aus null oder mehr Name-Wert-Gruppen besteht (eine Beschreibungsliste). Eine Name-Wert-Gruppe besteht aus einem oder mehreren Namen (dt-Elementen), gefolgt von einem oder mehreren Werten (dd-Elementen), wobei andere Knoten als dt- und dd-Elemente ignoriert werden. Innerhalb eines einzelnen dl-Elements sollte es nicht mehr als ein dt-Element für jeden Namen geben.

Name-Wert-Gruppen können Begriffe und Definitionen, Metadatenthemen und -werte, Fragen und Antworten oder andere Gruppen von Name-Wert-Daten sein.

Autoren- und andere Artikel-Metainformationen passen perfekt in diese Schlüssel: Wertepaar-Struktur:

  • wer ist der Autor
  • datum der Veröffentlichung des Artikels
  • site-Struktur, unter der der Artikel organisiert ist (Kategorie/Tag: String/Arrays)
  • etc.

Ein meinungsbildendes Beispiel:

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

Wie Sie sehen können, wenn Sie das <dl> Element für Artikel-Metainformationen, wir können <address>, <a> und selbst <img> Tags in <dt> und/oder <dd> Tags gemäß der Art des Inhalts und der beabsichtigten Funktion .
Das <dl>, <dt> und <dd> Tags können ihre Aufgabe - semantisch - erledigen und Informationen über das übergeordnete Element übermitteln <article>; <a>, <img> und <address> können ihre Arbeit ebenfalls erledigen - wiederum semantisch - und Informationen darüber übermitteln, wo verwandte Inhalte zu finden sind, sowie nonverbale visuelle Darstellungen bzw. Kontaktdaten für maßgebliche Parteien.

9
remyActual

In HTML5 können wir einige semantische Bezeichnungen verwenden, mit denen Sie die Informationen zu Ihrer Art von Inhalten organisieren können. Zusätzlich und in Bezug auf das Thema können Sie schema.org . Es ist eine Initiative von Google, Bing und Yahoo, die Suchmaschinen dabei unterstützen soll, Websites anhand von Mikrodatenattributen besser zu verstehen. 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>
3
HarleySG

Wie wäre es mit Mikrodaten :

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

Sie können verwenden

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

im Header gemäß HTML5-Spezifikation .

2
Raphael

Wenn Sie die Kontaktdaten des Autors angegeben haben, wird das <address> Tag ist angemessen:

Wenn es sich jedoch buchstäblich nur um den Namen des Autors handelt, gibt es kein spezielles Tag dafür. HTML enthält nicht viel, was mit Menschen zu tun hat.

1
Paul D. Waite