Angel Cruz

nano /var/log/microformats.log

Coding, life & stuff.

h-entry es un formato simple y abierto para contenido episódico o con marca de fecha en la web. h-entry se usa a menudo con contenido destinado a ser sindicado, p. ej. publicaciones de blog. h-entry es uno de varios estándares de microformato abiertos adecuados para incrustar datos en HTML.

microformats

Ejemplo de uso

<article class="h-entry">
    <h1 class="p-name">
        Microformats are amazing
    </h1>
    <p>
        Published by
        <a class="p-author h-card" href="http://example.com">
            W. Developer
        </a>
        on <time class="dt-published" datetime="2013-06-13 12:00:00">
            13
            <sup>th</sup>
            June 2013
        </time>
    </p>
    <p class="p-summary">
        In which I extoll the virtues of using microformats.
    </p>
    <div class="e-content">
        <p>
            Blah blah blah
        </p>
    </div>
</article>

Validar tu micro formato

Existen varios sitios webs para validar la correcta implementación de h-entry:

Retrocompatibilidad

Para obtener compatibilidad con versiones anteriores de implementaciones que consumen hAtom 0.1 heredado, se pueden usar nombres de clase (o valores rel) de hAtom 0.1 además de las propiedades de h-entry más preparadas para el futuro, por ejemplo:

<article class="h-entry hentry">
    <h1 class="p-name entry-title">
        A Tale Of Two Tags
    </h1>
    <address class="p-author author h-card vcard">
        <a href="https://chandra.example.com/" class="u-url url p-name fn" rel="author">
            Chandra
        </a>
    </address>
    <time class="dt-published published" datetime="2012-06-20T08:34:46-07:00">
        June 20, 2012
    </time>
    <div class="e-content entry-content">
        <p>
            It was the best of visible tags, it was the alternative invisible tags.
        </p>
        <p>
            The a tag is perhaps the best of HTML, yet its corresponding invisible link tag has uses too.
        </p>
    </div>
    <a href="/category/uncategorized/" rel="category tag" class="p-category">
        General
    </a>
</article>

Se puede utilizar cualquier elemento HTML5 válido. Los elementos de tipo article h1 address time, se utilizan en el ejemplo como sugerencias semánticamente más ricas, sin embargo, en general, las etiquetas div / span también funciona bien. Sin embargo, el elemento datetime es especial en el sentido de que su atributo de fecha y hora proporciona una forma más sencilla para el autor / usuario de separar una fecha y hora de tipo ISO8601 legible por máquina a una que sea legible por humanos.

Link to, or bookmark, here using this permalink.

Sigue la conversación en twitter.

Angel's avatar
Watagatapitusberry... !!

Comments