From Microformats Wiki
Revision as of 23:51, 14 June 2013 by Tantek (talk | contribs) (update to)
Jump to navigation Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

<entry-title>h-recipe</entry-title> Tantek Çelik (Editor)

h-recipe is a simple, open format for publishing recipes on the web. h-recipe is one of several open microformat draft standards suitable for embedding data in HTML/HTML5.

h-recipe is the microformats2 update to hRecipe 0.22.


Here is a simple minimal recipe example:

<article class="h-recipe">
  <h1 class="p-name">Bagels</h1>
    <li class="p-ingredient">Flour</li>
    <li class="p-ingredient">Sugar</li>
    <li class="p-ingredient">Yeast</li>
  <p>Takes <time class="dt-duration" datetime="1H">1 hour</time>,
     serves <data class="p-yield" value="4">four people</data>.</p>
  <div class="u-instructions">
      <li>Start by mixing all the ingredients together.</li>

Get started

The class h-recipe is a root class name that indicates the presence of an h-recipe.

p-name, e-instructions, p-ingredient and the other property classnames listed below define elements as properties of the h-recipe.

See microformats2 parsing specification to learn more about property classnames.



  • p-name - the name of the recipe
  • p-ingredient - describes one or more ingredients used in the recipe.
  • p-yield - Specifies the quantity produced by the recipe, like how many persons it satisfyies
  • e-instructions - the method of the recipe.
  • dt-duration - the time it takes to prepare the meal described by the recipe.
  • u-photo - an accompanying image

Experimental properties with wide adoption

  • p-summary - provides a short summary or introduction
  • p-author - the person who wrote the recipe with h-card
  • dt-published - the date the recipe was published
  • p-nutrition - nutritional information like calories, fat, dietary fiber etc.
  • ...

For backward compatibility, microformats 2 parsers SHOULD detect the following root class name and property names. A microformats 2 parser may use existing microformats Microformats Parsers to extract these properties. If an "h-recipe" is found, don't look for an "hrecipe" on the same element.

compat root class name: hrecipe
properties: (parsed as p- plain text unless otherwise specified)

  • fn - parse as p-name
  • ingredient
  • yield
  • instructions - parse as e-
  • duration - parse as dt-
  • photo - parse as u-
  • summary
  • author - including compat root vcard in the absence of h-card
  • nutrition


h-recipe is a microformats.org draft specification. Public discussion on h-recipe takes place on h-recipe-feedback, the #microformats #microformats chat channel on irc.freenode.net, and microformats-new mailing list.

h-recipe is ready to use and implemented in the wild, but for backwards compatibility you should also mark h-recipes up with classic hRecipe 0.22 classnames.

Property Details

(stub, add any property explanations here)

dt-duration should be marked up using the duration microsyntax defined in HTML5. TODO: add more examples

hRecipe 0.22 has a number of experimental properties which have real world adoption due to Google Search recipe search support of hRecipe. These are: summary, author, published and nutrition.

Examples in the Wild

  • … add any h-recipe examples you find in the wild


h-recipe is based on the existing hRecipe 0.22 specification.

See Also