h-entry: Difference between revisions
m (Protected "h-entry": protect due to vandalism [edit=sysop:move=sysop]) |
(add p-location re-use from h-event, drop p-geo p-latitude p-longitude p-altitude as no one has ever used them directly inside an h-entry nor hentry. use nested h-geo on a p-location instead. add FAQs.) |
||
Line 43: | Line 43: | ||
* '''<code>u-url</code>''' - entry permalink URL | * '''<code>u-url</code>''' - entry permalink URL | ||
* '''<code>u-uid</code>''' - unique entry ID | * '''<code>u-uid</code>''' - unique entry ID | ||
* '''<code>p- | * '''<code>p-location</code>''' - location the entry was posted from, optionally embed [[h-card]], [[h-adr]], or [[h-geo]] | ||
The following experimental properties are in use in the wild but are not yet part of the spec: | The following experimental properties are in use in the wild but are not yet part of the spec: | ||
Line 67: | Line 64: | ||
== Property Details == | == Property Details == | ||
This section is a stub. | |||
=== p-location === | |||
'''<code>p-location</code>''' has been re-used from [[h-event]]. | |||
== FAQ == | == FAQ == | ||
=== p-name of a note === | |||
<div class="discussion"> | <div class="discussion"> | ||
* '''What is the <code>p-name</code> of a [http://indiewebcamp.com/note note]?''' | * '''What is the <code>p-name</code> of a [http://indiewebcamp.com/note note]?''' | ||
Line 79: | Line 76: | ||
*** '''same as the <code>title</code> element''' on the note permalink post page. When publishing a note on its own permalink post page, the contents of the note are likely abbreviated for the title of the page. The same abbreviation can be used for the p-name. | *** '''same as the <code>title</code> element''' on the note permalink post page. When publishing a note on its own permalink post page, the contents of the note are likely abbreviated for the title of the page. The same abbreviation can be used for the p-name. | ||
*** '''first sentence of the p-content/e-content''' property. It may be better for [http://indiewebcamp.com/syndication syndication] and [[link-preview]] purposes to provide just the first sentence of the note as the <code>p-name</code>. Similarly if only a portion of the content is syndicated to other sites, that portion can be marked up as the <code>p-summary</code>. | *** '''first sentence of the p-content/e-content''' property. It may be better for [http://indiewebcamp.com/syndication syndication] and [[link-preview]] purposes to provide just the first sentence of the note as the <code>p-name</code>. Similarly if only a portion of the content is syndicated to other sites, that portion can be marked up as the <code>p-summary</code>. | ||
* ... | |||
=== venue an entry was posted from === | |||
<div class="discussion"> | |||
* '''How do you indicate a named venue where an entry was posted from? Like a restaurant or park.''' | |||
** Use an embedded [[h-card]] microformat on a <code>p-location</code> property value. | |||
=== address an entry was posted from === | |||
<div class="discussion"> | |||
* '''How do you indicate the address where an entry was posted from? Like a restaurant or park.''' | |||
** If the address is just part of a named venue, see above, use an [[h-card]] | |||
** Otherwise use an embedded [[h-adr]] microformat on a <code>p-location</code> property value. | |||
=== lat long an entry was posted from === | |||
<div class="discussion"> | |||
* '''How do you indicate the latitude and longitude of where an entry was posted from?''' | |||
** If the location has a name in addition to latitude and longitude, see above, use an [[h-card]] | |||
** Otherwise if there is an address in addition to latitude and longitude, see above, use an [[h-adr]] | |||
** Otherwise use an embedded [[h-geo]] microformat on a <code>p-location</code> property value. | |||
</div> | </div> | ||
Line 131: | Line 145: | ||
* <code>author</code> - including compat root <code>vcard</code> in the absence of <code>h-card</code> | * <code>author</code> - including compat root <code>vcard</code> in the absence of <code>h-card</code> | ||
* <code>category</code> | * <code>category</code> | ||
=== Compat FAQ === | === Compat FAQ === |
Revision as of 22:02, 17 September 2013
<entry-title>h-entry</entry-title> Tantek Çelik (Editor)
h-entry is a simple, open format for episodic or datestamped content on the web. h-entry is often used with content intended to be syndicated, e.g. blog posts. h-entry is one of several open microformat draft standards suitable for embedding data in HTML/HTML5.
h-entry is the microformats2 update to hAtom.
Per CC0, to the extent possible under law, the editors have waived all copyright and related or neighboring rights to this work. In addition, as of 2024-10-31, the editors have made this specification available under the Open Web Foundation Agreement Version 1.0.
Example
Here is a simple blog post example:
<article class="h-entry">
<h1 class="p-name">Microformats are amazing</h1>
<p>Published by <a class="p-author h-card">W. Developer</a>
on <time class="dt-published" datetime="2013-06-13 12:00:00">13<sup>th</sup> June 2013</time>
<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>
Get started
The class h-entry
is a root class name that indicates the presence of an h-entry.
p-name, p-author, dt-published and the other h-entry property classnames listed below define properties of the h-entry.
See microformats2-parsing to learn more about property classnames.
Properties
h-entry properties, inside an element with class h-entry:
p-name
- entry name/titlep-summary
- short entry summarye-content
- full content of the entrydt-published
- when the entry was publisheddt-updated
- when the entry was updatedp-author
- who wrote the entry, optionally embedded h-card(s)p-category
- entry categories/tagsu-url
- entry permalink URLu-uid
- unique entry IDp-location
- location the entry was posted from, optionally embed h-card, h-adr, or h-geo
The following experimental properties are in use in the wild but are not yet part of the spec:
u-in-reply-to
- the URL which the h-entry is considered a reply to or comment on.- Potentially optionally an embedded (or nested?) h-entry (for reply contexts) but I’m the only one doing that right now so not considered a recommendation --bw 16:44, 13 June 2013 (UTC)
p-comment
- optionally embedded (or nested?) h-entry(ies), each of which is a comment on/reply to the parent h-entry. See comment-brainstorming.
The following properties are proposed additions based on various existing link preview markup conventions which are not yet used in the wild (Related: link-preview-brainstorming)
u-photo
u-audio
- consider special u- parsing rules for<audio>
u-video
- consider special u- parsing rules for<video>
All properties are optional.
Status
h-entry is a microformats.org draft specification. Public discussion on h-entry takes place on h-entry-feedback, the #microformats irc channel on irc.freenode.net, and microformats-new mailing list.
h-entry is ready to use and implemented in the wild, but for backwards compatibility you should also mark h-entries up as classic hAtom entries.
Property Details
This section is a stub.
p-location
p-location
has been re-used from h-event.
FAQ
p-name of a note
- What is the
p-name
of a note?- A few options, from simplest to most detailed.
- same as the p-content/e-content property.
- same as the
title
element on the note permalink post page. When publishing a note on its own permalink post page, the contents of the note are likely abbreviated for the title of the page. The same abbreviation can be used for the p-name. - first sentence of the p-content/e-content property. It may be better for syndication and link-preview purposes to provide just the first sentence of the note as the
p-name
. Similarly if only a portion of the content is syndicated to other sites, that portion can be marked up as thep-summary
.
- A few options, from simplest to most detailed.
venue an entry was posted from
- How do you indicate a named venue where an entry was posted from? Like a restaurant or park.
- Use an embedded h-card microformat on a
p-location
property value.
- Use an embedded h-card microformat on a
address an entry was posted from
- How do you indicate the address where an entry was posted from? Like a restaurant or park.
lat long an entry was posted from
- How do you indicate the latitude and longitude of where an entry was posted from?
Examples in the wild
Real world in the wild examples:
- ... add uses of h-entry you see in the wild here.
- App.net marks up profile pages and permalink pages with h-entry as of 2013-08-06 (example)
- The Twitter archive browser UI uses h-entry and h-card internally, unfortunately it’s not exposed as HTML in static files anywhere
- Brett Comnes marks up his posts with h-entry and h-card (example)
- Ben Werdmuller marks up his posts with h-card and h-entry, u-in-reply-to and u-like (example)
- Sandeep Shetty marks his posts up with h-card and h-entry, as well as draft u-in-reply-to and experimental u-like properties (example)
- spreadly marks up share permalink pages with h-entry, as well as minimal h-cards and experimental p-like properties (example)
- Laurent Eschenauer marks up his posts with h-entry (example)
- Tom Morris marks up his posts using h-entry (example)
- Numerous newer W3C specs, e.g.
- SemPress is a WordPress theme that supports h-card, h-feed/h-entry.
- The Pastry Box Project use h-card and h-entry markup on their homepage and individual thoughts pages
- Aaron Parecki uses h-entry to mark up notes, e.g. 2012/230/reply/1.
- Tantek Çelik uses h-entry on his home page, as well as h-entry on all post permalinks, e.g. 2012-243 post, with rel-prev/rel-next (if applicable) to indicate prev/next posts
- Barnaby Walters uses h-entry on all notes and articles, as well as nested within notes as reply contexts example and comments example.
Test and validate microformats2 markup in general with:
- https://pin13.net/mf2/ - enter your markup directly
- https://pin13.net/ - enter a URL to a page to test where it says "Microformats Parser"
Backward Compatibility
Publisher Compatibility
For backward compatibility, you may wish to use classic hAtom classnames in addition to the more future-proof h-entry properties, for example:
<div class="h-entry hentry">
<h1 class="p-name entry-title">My great blog post</h1>
</div>
Parser Compatibility
Microformats parsers should detect classic properties and parse them as microformats2 properties. If an "h-entry" is found, don't look for an "hentry" on the same element.
Compat root class name: hentry
Properties: (parsed as p- plain text unless otherwise specified):
entry-title
- parse asp-name
entry-summary
- parse asp-summary
entry-content
- parse ase-content
published
- parse as dt-updated
- parse as dt-author
- including compat rootvcard
in the absence ofh-card
category
Compat FAQ
What about rel bookmark
Also asked as: Why use an h-entry u-url u-uid for permalinks when I have rel=bookmark?
A: tl;dr: use class="u-url u-uid"
instead of rel=bookmark
for post permalinks because it's simpler (fewer attributes), and works better across contexts (permalink page, recent posts on home page, collection of posts on archive pages).
rel=bookmark was the old hAtom way of marking up permalinks. Since then two factors have contributed to reducing use of rel inside microformats:
- rel by typically* document scoped in HTML5 - thus making it inappropriate for use in microformats that are aggregated, e.g. a collection of posts on a home page or in monthly archives.
- it is easier to always use class names for properties. When formats use two (or more!) attributes in HTML to specify properties, confusion results in lower data quality (of the markup and thus the stuff that is marked up). Thus per the microformats principle of simplicity, in microformats2 we only use class names for properties.
* even though rel=bookmark in particular is article-element / sectioning scoped in HTML5[1], it's a detail that typical authors are not going to remember, and thus it's not good to depend on it for any kind of format.
Background
This work is based on the existing hAtom microformat, and extensive selfdogfooding in the indie web camp community.
Design Principles
(stub, expand)