h-entry: Difference between revisions

From Microformats Wiki
Jump to navigation Jump to search
No edit summary
m (Undo revision 64239 by Laestelm (Talk) spam removed)
Line 1: Line 1:
'''Watch all episodes of Tv set series online
<entry-title>h-entry</entry-title>
<span class="h-card vcard"><span class="p-name fn">[[User:Tantek|Tantek Çelik]]</span> (<span class="p-role role">Editor</span>)</span>
----
<dfn style="font-style:normal;font-weight:bold">h-entry</dfn> 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 [[microformats|microformat]] draft standards suitable for embedding data in HTML/HTML5.


'''
h-entry is the [[microformats2]] update to [[hAtom]]'s "hentry". For an update to "hfeed" see [[h-feed]].


Numerous individuals may possibly overlook their favourite television shows or series on account of different reasons. They usually desire to watch these television series, however they might miss out on as a result of their function. In before days, there is no option to see the missed tv plans. The invention of world wide web and its improved technologies has transformed every thing. Now using the improvement of net technological innovation, people can watch their skipped television exhibits or series online. The majority of the house makers use the internet to [http://www.watchtvseries.info/ watch series] online. They no have to pay out cash for seeing television series online. It is fully freed from value with computer and fast and consistent world wide web relationship. On the internet, there are so many web sites to watch the tv series. These websites have the two regional television programs and likewise worldwide tv programs on the net. The online users can watch the television series from anyplace of the world and at any time using the net. This is largely utilized for the people in abroad who may overlook their native tv packages.
{{cc0-owfa-license}}


== Example ==
Here is a simple blog post example:


<source lang=html4strict>
<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 class="p-summary">In which I extoll the virtues of using microformats.</p>
 
  <div class="e-content">
    <p>Blah blah blah</p>
  </div>
</article>
</source>


The website offers an opportunity towards the online users to watch any forms of tv series on the web. This site offers many Television set series including American dad, arrow, bones, Cali fornication, elementary, household man, game of thrones, homeland, new lady, jail split, parenthood, South Park, scandal, the tomorrow people, the vampire diaries, and white collar and several much more. This website has all episodes of all of these television applications to the online users. The online customers can watchseries which are their favorite television programs. This website listed its full episodes of all television series or programs and folks also can search their favorite series in getting into the title from the series within the research box of this website. They provide a greater interface among their net server as well as the customer method with their quickly broadcasting speed. The online customers can definitely enjoy their online seeing of television series using this website. They're able to also obtain the ideal television experience using this type of online tv. As opposed to buying the tv, set-top box and cable connection, the homeowners can use this online tv to watch tv series or plans on the net.  
=== Get started ===
The class '''<code>h-entry</code>''' 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.


In other methods of watching television applications wants a great deal of expense funds but online tv need only computer with consistent internet relationship? This is quite easy strategy to the online end users to watch series on the net. The online end users must have to open up a free of charge account on this internet site to watch television series on this site. With that cost-free account, only folks can stream or down load the film or television series or applications through the active server of this website. This internet site has lawful rights to distribute the Tv set series on the internet. This site also requires get in touch with info on the online consumers that have viewed the series on this internet site. This is for indicating these online users regarding their website once they add a whole new episode of any of the user’s favorite series on this internet site.
== Properties ==
h-entry properties, inside an element with class '''h-entry''':
* '''<code>p-name</code>''' - entry name/title
* '''<code>p-summary</code>''' - short entry summary
* '''<code>e-content</code>''' - full content of the entry
* '''<code>dt-published</code>''' - when the entry was published
* '''<code>dt-updated</code>''' - when the entry was updated
* '''<code>p-author</code>''' - who wrote the entry, optionally embedded [[h-card]](s)
* '''<code>p-category</code>''' - entry categories/tags
* '''<code>u-url</code>''' - entry permalink URL
* '''<code>u-uid</code>''' - unique entry ID
* '''<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:
 
* '''<code>u-in-reply-to</code>''' - 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 --[[User:Barnabywalters|bw]] 16:44, 13 June 2013 (UTC)
* '''<code>p-comment</code>''' - 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]])
* '''<code>u-photo</code>''' - a representative photo or image for the entry, e.g. primary photo for an article or subject-cropped photo, suitable for use in a [[link-preview]].
* '''<code>u-audio</code>''' - consider special u- parsing rules for <code>&lt;audio></code>
* '''<code>u-video</code>''' - consider special u- parsing rules for <code>&lt;video></code>
 
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 [http://microformats.org/discuss/mail/microformats-new/ 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 ===
'''<code>p-location</code>''' has been re-used from [[h-event]].
 
== FAQ ==
=== p-name of a note ===
<div class="discussion">
* '''What is the <code>p-name</code> of a [http://indiewebcamp.com/note note]?'''
** A few options, from simplest to most detailed.
*** '''same as the p-content/e-content''' property.
*** '''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>.
</div>
 
=== 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.
</div>
=== 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.
</div>
=== 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>
=== does the dt-published property need to be a time element ===
<div class="discussion">
* The <code>dt-published</code> property should be a <code>&lt;time&gt;</code> element so that you can take advantage of HTML5's "datetime" property.
* This lets you specify a human-readable date in the value of the attribute, and the ISO8601 machine-readable date in the "datetime" property.
</div>
=== what is the bare minimum list of required properties on an h-entry ===
<div class="discussion">
</div>
 
== Examples in the wild ==
Real world in the wild examples:
 
* ... add uses of h-entry you see in the wild here.
* Okinawan-lyrics marks up his posts with h-entry and h-card ([http://www.okinawan-lyrics.com/ example])
* App.net marks up profile pages and permalink pages with h-entry as of 2013-08-06 ([https://alpha.app.net/voidfiles 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 ([http://bret.io/2013/06/29/getting-started-with-bower/ example])
* Ben Werdmuller marks up his posts with h-card and h-entry, u-in-reply-to and u-like ([http://werd.io/view/51d5097fbed7ded0633a5956 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 ([http://sandeep.io/101 example])
* spreadly marks up share permalink pages with h-entry, as well as minimal h-cards and experimental p-like properties ([http://my.spread.ly/share/51d570bc09e9486562000002 example])
* Laurent Eschenauer marks up his posts with h-entry ([http://eschnou.com/entry/first-autonomous-flight-of-my-nodecopter-62-24992.html example])
* Tom Morris marks up his posts using h-entry ([http://tommorris.org/posts/8417 example])
* Numerous newer W3C specs, e.g.
** [http://www.w3.org/TR/2013/CR-css3-values-20130404/ CSS Values and Units Module Level 3 - 2013-04-04]
** [http://www.w3.org/TR/2013/CR-css3-conditional-20130404/ CSS Conditional Rules Module Level 3 - 2013-04-04]
** [http://www.w3.org/TR/2013/WD-css3-page-20130314/ CSS Paged Media Module Level 3 - 2013-03-14]
** [http://www.w3.org/TR/2013/WD-css-counter-styles-3-20130221/ CSS Counter Styles Level 3 - 2013-02-21]
* [http://wordpress.org/extend/themes/sempress SemPress] is a WordPress theme that supports h-card, h-feed/h-entry.
* [http://the-pastry-box-project.net/ 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. [http://aaronparecki.com/2012/230/reply/1 2012/230/reply/1].
* [http://tantek.com/ Tantek Çelik] uses h-entry on his home page, as well as h-entry on all post permalinks, e.g. [http://tantek.com/2012/243/t1/name-beats-title-modern-use-dubline-core-wrong-uf2 2012-243 post], with [[rel-prev]]/[[rel-next]] (if applicable) to indicate prev/next posts
* [http://waterpigs.co.uk/ Barnaby Walters] uses h-entry on all notes and articles, as well as nested within notes as reply contexts [http://waterpigs.co.uk/notes/1468/ example] and comments [http://waterpigs.co.uk/notes/1482/ example].
 
== Validating ==
* '''[http://indiewebify.waterpigs.co.uk/validate-h-entry/ indiewebify.me h-entry validator]''' parses [[h-entry]] markup, finds common errors and makes suggestions for things to add, with code samples
{{h-spec-section-validating}}
 
== 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:
 
<source lang=html4strict>
<div class="h-entry hentry">
  <h1 class="p-name entry-title">My great blog post</h1>
</div>
</source>
 
=== Parser Compatibility ===
Microformats parsers {{should}} detect classic properties only if a classic root class name is found 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: <code id="hentry">hentry</code><br/>
Properties: (parsed as '''p-''' plain text unless otherwise specified):
 
* <code>entry-title</code> - parse as '''<code>p-name</code>'''
* <code>entry-summary</code> - parse as '''<code>p-summary</code>'''
* <code>entry-content</code> - parse as '''<code>e-content</code>'''
* <code>published</code> - parse as '''dt-'''
* <code>updated</code> - parse as '''dt-'''
* <code>author</code> - including compat root <code>vcard</code> in the absence of <code>h-card</code>
* <code>category</code>
 
=== 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|rel=bookmark]]?''
 
A: tl;dr: use <code>class="u-url u-uid"</code> instead of <code>rel=bookmark</code> 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.
 
<nowiki>*</nowiki> even though rel=bookmark in particular is article-element / sectioning scoped in HTML5[http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#link-type-bookmark], 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 [http://indiewebcamp.com indie web camp] community.
 
== Design Principles ==
 
(stub, expand)
 
== See Also ==
* [[h-feed]]
* [[microformats2]]
* [[microformats2-parsing]]
* [[h-geo]]
* [[hCard]]
 
[[Category:Draft Specifications]]

Revision as of 08:42, 12 March 2014

<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's "hentry". For an update to "hfeed" see h-feed.

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-11-21, 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" 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 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/title
  • p-summary - short entry summary
  • e-content - full content of the entry
  • dt-published - when the entry was published
  • dt-updated - when the entry was updated
  • p-author - who wrote the entry, optionally embedded h-card(s)
  • p-category - entry categories/tags
  • u-url - entry permalink URL
  • u-uid - unique entry ID
  • p-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 - a representative photo or image for the entry, e.g. primary photo for an article or subject-cropped photo, suitable for use in a link-preview.
  • 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 the p-summary.

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.

address an entry was posted from

  • 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 p-location property value.

lat long an entry was posted from

  • 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 p-location property value.

does the dt-published property need to be a time element

  • The dt-published property should be a <time> element so that you can take advantage of HTML5's "datetime" property.
  • This lets you specify a human-readable date in the value of the attribute, and the ISO8601 machine-readable date in the "datetime" property.

what is the bare minimum list of required properties on an h-entry

Examples in the wild

Real world in the wild examples:

Validating

Main article: validators

Test and validate microformats2 markup in general with:

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 only if a classic root class name is found 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 as p-name
  • entry-summary - parse as p-summary
  • entry-content - parse as e-content
  • published - parse as dt-
  • updated - parse as dt-
  • author - including compat root vcard in the absence of h-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)

See Also