todas tipos son sirven sintaxis semanticas semantica que programacion para las funciones etiquetas estructura elementos ejemplos ejemplo cuales codigo atributos html5 tags blogs semantic-markup

html5 - son - tipos de etiquetas html



¿Qué etiqueta HTML5 debería usar para marcar el nombre de un autor? (7)

¿Qué hay de 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>

Por ejemplo, una publicación de blog o artículo.

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

Aunque la etiqueta de author no existe ... Entonces, ¿cuál es la etiqueta HTML5 comúnmente utilizada para los autores? Gracias.

(Si no hay, ¿no debería haber uno?)


Ambos rel="author" y <address> están diseñados para este propósito exacto. Ambos son compatibles con HTML5. La especificación nos dice que rel="author" se puede usar en los elementos <link> <a> y <area> . Google también recommends su usage . Combinar el uso de <address> y rel="author" parece óptimo. HTML5 mejor permite envolver los titulares de <article> y la información de los bylines en un <header> así:

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

  • El atributo pubdate indica que esa es la fecha publicada.

  • Los atributos del title son sobrevuelos opcionales.

  • La información de la línea se puede incluir alternativamente en un <footer> dentro de un <article>

Si desea agregar el microformato hcard , entonces lo haría así:

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


El soporte de Google para rel = "author" está en desuso :

"El marcado de autoría ya no se admite en la búsqueda web".

Use un elemento Lista de descripciones (Lista de definiciones en HTML 4.01).

De la especificación de HTML5 :

El elemento dl representa una lista de asociación que consta de cero o más grupos de nombre-valor (una lista de descripción). Un grupo nombre-valor consiste en uno o más nombres (elementos dt) seguidos de uno o más valores (elementos dd), ignorando los nodos que no sean dt y dd. Dentro de un solo elemento dl, no debe haber más de un elemento dt para cada nombre.

Los grupos de nombre-valor pueden ser términos y definiciones, temas y valores de metadatos, preguntas y respuestas, o cualquier otro grupo de datos de nombre-valor.

La autoría y otra metainformación del artículo encajan perfectamente en esta clave: estructura de pares de valores:

  • quien es el autor
  • fecha en que el artículo fue publicado
  • estructura del sitio bajo la cual se organiza el artículo (categoría / etiqueta: cadena / matrices)
  • etc.

Un ejemplo obstinado:

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

Como puede ver al usar el elemento <dl> para la metainformación del artículo, podemos envolver las etiquetas <address> , <a> e incluso <img> en etiquetas <dt> y / o <dd> según la naturaleza de el contenido y su función prevista .
Las etiquetas <dl> , <dt> y <dd> son libres de hacer su trabajo, semánticamente, transmitiendo información sobre el <article> primario; <a> , <img> y <address> son igualmente libres de hacer su trabajo, una vez más, semánticamente, transmitiendo información sobre dónde encontrar contenido relacionado, presentación visual no verbal y detalles de contacto para partes autorizadas, respectivamente.


HTML5 tiene un tipo de enlace de autor :

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

La debilidad aquí es que debe estar en algún tipo de enlace, pero si tiene eso, hay una larga discusión de alternativas aquí . Si no tiene un enlace, simplemente use un atributo de clase, para eso sirve:

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



Según las especificaciones de HTML5, es probable que desee la address .

El elemento de dirección representa la información de contacto para su antecesor de elemento de cuerpo o artículo más cercano.

La especificación más referencias address con respecto a los autores aquí

Debajo de 4.4.4

La información de autor asociada con un elemento de artículo (qv el elemento de dirección) no se aplica a los elementos de artículo anidados.

Por debajo de 4.4.9

La información de contacto del autor o editor de una sección pertenece a un elemento de dirección, posiblemente también dentro de un pie de página.

Todo lo cual hace que parezca que la address es la mejor etiqueta para esta información.

Dicho esto, también podría dar a su address un rel o class de author .

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

Leer más: http://dev.w3.org/html5/spec/sections.html#the-address-element