<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.
Here is a simple minimal recipe example:
<article class="h-recipe"> <h1 class="p-name">Bagels</h1> <ul> <li class="p-ingredient">Flour</li> <li class="p-ingredient">Sugar</li> <li class="p-ingredient">Yeast</li> </ul> <p>Takes <time class="dt-duration" datetime="1H">1 hour</time>, serves <data class="p-yield" value="4">four people</data>.</p> <div class="e-instructions"> <ol> <li>Start by mixing all the ingredients together.</li> </ol> </div> </article>
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.
h-recipe properties, inside an element with class h-recipe:
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
dt-published- the date the recipe was published
p-nutrition- nutritional information like calories, fat, dietary fiber etc.
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.
(stub, add any property explanations here)
dt-duration should be marked up using the duration microsyntax defined in HTML5. TODO: add more examples
Examples in the Wild
- … add any h-recipe examples you find in the wild
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"
Microformats parsers SHOULD detect the following root class name and property names. A microformats2 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:
properties: (parsed as p- plain text unless otherwise specified)
fn- parse as
instructions- parse as e-
duration- parse as dt-
photo- parse as u-
author- including compat root
vcardin the absence of
h-recipe is based on the existing hRecipe 0.22 specification.