hrecipe: Difference between revisions
(→Schema: author reused from hAtom) |
m (Replace <entry-title> with {{DISPLAYTITLE:}}) |
||
(105 intermediate revisions by 27 users not shown) | |||
Line 1: | Line 1: | ||
{{DISPLAYTITLE:hRecipe 0.22}} | |||
{{latest|h-recipe}} | |||
{{Template:DraftSpecification}} | {{Template:DraftSpecification}} | ||
{{TOC-right}} | {{TOC-right}} | ||
Line 9: | Line 10: | ||
=== Editor === | === Editor === | ||
* [[User:ThomasLoertsch | Thomas | * [[User:ThomasLoertsch | Thomas Lörtsch]] | ||
=== Authors === | === Authors === | ||
* [[User:Phae|Frances Berriman]] | * [[User:Phae|Frances Berriman]] | ||
* [[User:BenWard|Ben Ward]] | * [[User:BenWard|Ben Ward]] | ||
* [[User:TobyInk|Toby Inkster]] | * [[User:TobyInk|Toby Inkster]] | ||
Line 19: | Line 21: | ||
Microformats [[#Copyright]] and [[#Patents]] statements apply. | Microformats [[#Copyright]] and [[#Patents]] statements apply. | ||
== Introduction == | == Introduction == | ||
Line 36: | Line 39: | ||
=== Scope === | === Scope === | ||
Recipes consistently share several common | hRecipe is a format to annotate descriptions and lists of ingredients for the preparation of food and meals. Recipes consistently share several common properties. hRecipe has been based on this minimal common subset. | ||
=== Out of scope === | === Out of scope === | ||
Recipes that are not for stuff that's meant to be eaten by humans are out of scope. | |||
== Format == | == Format == | ||
Line 47: | Line 51: | ||
=== In General === | === In General === | ||
The hRecipe format is based on a set of | The hRecipe format is based on a set of properties common to numerous recipe sites and formats in use today on the web. Where possible property names have been chosen based on those defined by related microformat standards.<br> | ||
Some properties are marked ''experimental'' since they exceed the minimum set of properties needed to describe a recipe but still are very commonly used on the web. It's not sure if they are relevant enough for inclusion in the format. Implementation and general uptake of these properties will be observed and inform further decisions. So their use is not at all discouraged - but use them with care and be prepared for their eventual removal from the final spec. | |||
=== Schema === | === Schema === | ||
The hRecipe schema consists of the following properties: | |||
* '''hrecipe''' | |||
** '''fn'''. required. text. the name of the recipe. | |||
** '''ingredient'''. required. 1 or more. text with optional valid (x)HTML markup. | |||
*** '''''value''''' and '''''type'''''. optional. [experimental] | |||
** '''''yield'''''. optional. text. | |||
** '''''instructions'''''. optional. text with optional valid (x)HTML markup. | |||
** '''''duration'''''. optional. 1 or more. text. | |||
** ''photo''. optional. 1 or more. using any element containing a URL, such as IMG. [experimental] | |||
** ''summary''. optional. text. [experimental] | |||
** ''author''. optional. 1 or more. [experimental] | |||
** ''published''. optional. [experimental] | |||
** ''nutrition''. optional. 1 or more. [experimental] | |||
*** ''value'' and ''type''. optional. [experimental] | |||
** ''tag''. optional. 1 or more. [experimental] | |||
** ''license''. optional. 1 or more. just use [[rel-license]] to license recipe permalink pages | |||
=== Property details === | |||
Property names <code>fn</code>, <code>photo</code>, <code>author</code>, <code>value</code> and <code>type</code> are reused from [[hCard]]. Property name <code>duration</code> is reused from [[hAudio]]. Property name <code>summary</code> is reused from [[hCalendar]]. Property name <code>published</code> is reused from [[hAtom]]. Property name <code>tag</code> is reused from [[rel-tag]]. | |||
The fields of the hRecipe schema represent the following: | The fields of the hRecipe schema represent the following: | ||
Line 80: | Line 85: | ||
A hRecipe is used to identify and describe values and metadata typically associated with a recipe. | A hRecipe is used to identify and describe values and metadata typically associated with a recipe. | ||
* A hRecipe | * A hRecipe property is identified by the name <code>hrecipe</code> | ||
==== | ==== fn ==== | ||
The title of a single recipe | The title of a single recipe. A short textual description used to identify the work among interested parties. This can be the name of a meal or a short description regarding it's ingredients. | ||
* The | * The property is identified by the name <code>fn</code>. | ||
* A Recipe {{must}} include a <code> | * A Recipe {{must}} include a <code>fn</code>. | ||
* The property {{must}} follow the conventions outlined in [[hCard]] e.g. by using only plain text. | |||
==== | ==== ingredient ==== | ||
Describes one or more ingredients used in the recipe. | |||
* The | * The property is identified by the name <code>ingredient</code>. | ||
* A Recipe {{may}} include a <code> | * A Recipe {{must}} include one or more <code>ingredient</code>s. | ||
* The property {{may}} include valid HTML markup (e.g. a list of ingredients). | |||
* The property {{may}} include the properties <code>value</code> and <code>type</code> following the conventions outlined in [[hCard]], e.g. <source lang=html4strict><p class="ingredient"><span class="value">125</span><span class="type">ml</span> milk</p></source>In this case each ingredient should be marked up with it's own <code>ingredient</code> property. These subproperties are considered ''experimental'' and may be removed from the final specification or replaced by 'num' and 'unit' from [[measure]]. | |||
==== | ==== yield ==== | ||
Specifies the quantity produced by the recipe, like how many persons it satisfyies or how many pieces can be made of it. | |||
* The property is identified by the name <code>yield</code>. | |||
* A Recipe {{may}} include a <code>yield</code>. | |||
==== instructions ==== | |||
The method of the recipe. | |||
* The | * The property is identified by the name <code>instructions</code>. | ||
* A Recipe {{may}} include | * A Recipe {{may}} include a <code>instructions</code> property. | ||
* The | * The property {{may}} include valid HTML markup e.g. paragraphs or a list of steps. | ||
==== | ==== duration ==== | ||
The | The time it takes to prepare the meal described by the recipe. Multiple duration properties can be used to denote e.g. time for preparing a dough, time needed for the dough to raise, time to bake the dough, time for decorating the cake etc. | ||
* The | * The property is identified by the name <code>duration</code>. | ||
* A Recipe {{may}} include | * A Recipe {{may}} include one or more <code>duration</code> properties. | ||
* The | * The property {{may}} encode the timespan as outlined in the [[value-class-pattern|value-class-pattern]]. A duration of 1 hour 30 minutes would translate to "PT1H30M" in ISO 8601 format and can be encoded as follows:<source lang=html4strict><span class="duration"><span class="value-title" title="PT1H30M"> </span>90 min</span></source> | ||
==== photo ==== | ==== photo ==== | ||
Line 117: | Line 131: | ||
Accompanying image. | Accompanying image. | ||
* The | * The property is identified by the name <code>photo</code>. | ||
* A Recipe {{may}} include one or more photo | * A Recipe {{may}} include one or more <code>photo</code> properties. | ||
* The | * The property {{should}} use an <img> element. It {{may}} use any other element that contains a URL, such as <a> or <object>, but it is not recommended. See [[hRecipe#Semantic_XHTML_Design_Principles | notes]] below. | ||
* The property is considered ''experimental'' and may be removed from the final specification. | |||
* The | |||
==== summary ==== | |||
The summary provides a short introduction to or an accompanying statement about the recipe. | |||
* The property is identified by the name <code>summary</code>. | |||
* A Recipe {{may}} include a <code>summary</code>. | |||
* The property {{must}} follow the conventions outlined in [[hCalendar]]. Plain text fulfills these requirements. | |||
* The property is considered ''experimental'' and may be removed from the final specification. | |||
==== author ==== | |||
An author is the person who wrote the recipe. | |||
* The property is identified by the name <code>author</code>. | |||
* A Recipe {{may}} include one or more <code>author</code> properties. | |||
* The contents of the element {{may}} be a plain text string in which case it defaults to a "vcard fn". Anything more elaborate {{must}} follow the conventions outlined in [[hCard]]. | |||
* The element is considered ''experimental'' and may be removed from the final specification. | |||
==== published ==== | |||
The date the recipe was published. | |||
==== | * The property is identified by the name <code>published</code>. | ||
* A Recipe {{may}} include a <code>published</code> date. | |||
* The property {{may}} be encoded using the [[value-class-pattern|value-class-pattern]], e.g.:<source lang=html4strict><p>Published <span class="published"><span class="value-title" title="2008-10-14T10:05:37-01:00"> </span>14. Oct 2008</span></p></source> | |||
* The property is considered ''experimental'' and may be removed from the final specification. | |||
==== nutrition ==== | |||
Nutritional information like calories, fat, dietary fiber etc. | |||
* The | * The property is identified by name <code>nutrition</code>. | ||
* A Recipe {{may}} include | * A Recipe {{may}} include one or more <code>nutrition</code> properties. | ||
* The | * The property {{may}} include the properties <code>value</code> and <code>type</code> following the conventions outlined in [[hCard]]. In this case each nutritional information item should be marked up with it's own <code>nutrition</code> property. These subelement are considered ''experimental'' and may be replaced by 'num' and 'unit' from [[measure]]. | ||
* The property <code>nutrition</code> itself is also considered ''experimental'' and may be removed from the final specification. | |||
==== | ==== tag ==== | ||
A keyword indicating a subject or an important aspect of the recipe like it's main ingredient, type of meal etc. | |||
* The | * The property is identified by the name <code>tag</code>. | ||
* A Recipe {{may}} include | * A Recipe {{may}} include one or more <code>tag</code>'s. | ||
* The property {{must}} follow the conventions outlined in [[rel-tag]]. | |||
* The property is considered ''experimental'' and may be removed from the final specification. | |||
==== license ==== | |||
'license' is simply re-use of the [[rel-license]] microformat as a building block. | |||
Use [[rel-license]] to link to a license for the recipe on the recipe permalink page. | |||
=== | === Version history === | ||
* Version 0.22 changed the proposed formatting of time and date from the [[datetime-design-pattern|datetime-design-pattern]], which has [[datetime-design-pattern#Accessibility_issues|accessibility issues]], to the [[value-class-pattern|value-class-pattern]]. Also corrected some errors in the example especially with regard to the correct handling of vcard properties. | |||
* Version 0.21 changed the status of ingredient/value and ingredient/type to ''experimental'', mentioning that there still is discussion if they should be replaced by 'num' and 'unit' from [[measure]] (which is still in brainstorming). | |||
* Version 0.2: From [http://microformats.org/wiki/index.php?title=hrecipe&oldid=37357 Version 0.1] some elements have been renamed to strenghten re-use of established elements: '''fn''' for '''hRecipe-title''', '''summary''' for '''hRecipe-summary''', '''duration''' for '''preparation-time''', '''value''' and '''type''' for '''num''' and '''unit'''. Also some elements have been marked '''experimental''' because of concerns of element bloat. See the [[hrecipe-issues]] page for a more thorough discussion.<br/>Draft 0.1 was already a result of long lasting efforts. Nonetheless after publishing of it there has been a lively debate about some properties. Since they mostly could be resolved version 0.2 is considered fairly stable now, although of course you never know ;-) | |||
=== Parser Processing Notes === | === Parser Processing Notes === | ||
* If the "author" property contains only a plain text string it should be regarded as of type "vcard fn". | |||
=== Semantic XHTML Design Principles === | === Semantic XHTML Design Principles === | ||
{{semantic-xhtml-design-principles}} | {{semantic-xhtml-design-principles}} | ||
==== More Semantic Equivalents ==== | ==== More Semantic Equivalents ==== | ||
Line 177: | Line 209: | ||
* For "photo", use <code><img class="photo" src="..." alt="" /></code> | * For "photo", use <code><img class="photo" src="..." alt="" /></code> | ||
==== Language ==== | ==== Language ==== | ||
Line 185: | Line 218: | ||
* hRecipe parsers which need to handle the native language of hRecipe {{must}} process the standard (X)HTML 'lang' or 'xml:lang' attribute as specified. | * hRecipe parsers which need to handle the native language of hRecipe {{must}} process the standard (X)HTML 'lang' or 'xml:lang' attribute as specified. | ||
* hRecipe parsers which need to handle native language {{may}} traverse up the DOM to discover the native language of the page and apply that to the hRecipe if no other language is specified on the hRecipe. | * hRecipe parsers which need to handle native language {{may}} traverse up the DOM to discover the native language of the page and apply that to the hRecipe if no other language is specified on the hRecipe. | ||
==== Human vs. Machine Readable ==== | ==== Human vs. Machine Readable ==== | ||
Line 197: | Line 231: | ||
If an <code><object></code> element is used for the 'photo' property, it {{must}} use the property value provided by the <code>data="..."</code> attribute as property value. | If an <code><object></code> element is used for the 'photo' property, it {{must}} use the property value provided by the <code>data="..."</code> attribute as property value. | ||
=== Notes === | === Notes === | ||
Line 202: | Line 237: | ||
This section is informative. | This section is informative. | ||
* | *Non so far. | ||
== XMDP Profile == | == XMDP Profile == | ||
< | <source lang=html4strict> | ||
<dl class="profile"> | <dl class="profile"> | ||
<dt>class</dt> | <dt>class</dt> | ||
Line 221: | Line 257: | ||
Used to identify and describe metadata associated with instructions for creating meals, drinks or food-based items. | Used to identify and describe metadata associated with instructions for creating meals, drinks or food-based items. | ||
</dd> | </dd> | ||
<dt> | <dt>fn</dt> | ||
<dd> | <dd> | ||
The title of the recipe. | The title of the recipe. | ||
</dd> | </dd> | ||
<dt> | <dt>ingredient</dt> | ||
<dd> | <dd> | ||
Describes the ingredient(s) used in the recipe. | |||
</dd> | |||
<dt>yield</dt> | |||
<dd> | |||
Specifies the quantity produced by the recipe. | |||
</dd> | </dd> | ||
<dt> | <dt>instructions</dt> | ||
<dd> | <dd> | ||
The method of the recipe. | |||
</dd> | </dd> | ||
<dt> | <dt>duration</dt> | ||
<dd> | <dd> | ||
The | The time it takes to prepare the meal described by the recipe. | ||
</dd> | </dd> | ||
<dt>photo</dt> | <dt>photo</dt> | ||
Line 241: | Line 281: | ||
Accompanying image. | Accompanying image. | ||
</dd> | </dd> | ||
<dt> | <dt>summary</dt> | ||
<dd> | <dd> | ||
The summary provides a short introduction or an accompanying statement about the recipe. | |||
</dd> | </dd> | ||
<dt> | <dt>author</dt> | ||
<dd> | <dd> | ||
The person who authored the recipe.. | |||
</dd> | </dd> | ||
<dt> | <dt>published</dt> | ||
<dd> | <dd> | ||
The date that the recipe was made available to the public. | |||
</dd> | </dd> | ||
<dt> | <dt>nutrition</dt> | ||
<dd> | <dd> | ||
Nutritional information like calories, fat, dietary fiber etc. | |||
</dd> | </dd> | ||
<dt> | <dt>tag</dt> | ||
<dd> | <dd> | ||
Keyword(s) describing the recipe. | |||
</dd> | </dd> | ||
</dl> | </dl> | ||
</dd> | </dd> | ||
</dl> | </dl> | ||
</ | </source> | ||
== Examples == | == Examples == | ||
Line 272: | Line 313: | ||
Here '''will be''' a few examples of recipes, from real web sites, showing how they could be easily enhanced to use hRecipe. In the meantime the following contrieved example will have to do. | Here '''will be''' a few examples of recipes, from real web sites, showing how they could be easily enhanced to use hRecipe. In the meantime the following contrieved example will have to do. | ||
< | <source lang=html4strict><div class="hrecipe"> | ||
<h1 class="fn">Pommes Frites</h1> | |||
<p class="summary"> | |||
Pommes frites originate in outer space. They are served hot.<br /> | |||
This recipe is only an example. Don't try this at home! | |||
</p> | |||
<p> | |||
Contributed by <span class="author">CJ Tom</span> and the | |||
<span class="author vcard"><a class="url fn" href="http://example.com">Cooky Gang</a></span>. | |||
</p> | |||
<p>Published <span class="published"><span class="value-title" title="2008-10-14T10:05:37-01:00"> </span>14. Oct 2008</span></p> | |||
<img src="/img/pommes.png" class="photo" width="100" height="100" alt="Pommes Frites"/> | |||
<h2>Ingredients</h2> | |||
<ul> | |||
<li class="ingredient"> | |||
<span class="value">500</span> | |||
<span class="type">gramme</span> potatoes, hard cooking. | |||
</li> | |||
<li class="ingredient"> | |||
<span class="value">1</span> <span class="type">spoonful</span> of salt | |||
</li> | |||
<li> | |||
You may want to provide some | |||
<span class="ingredient">Ketchup and Mayonnaise</span> | |||
as well. | |||
</li> | |||
</ul> | |||
<h2>Instructions</h2> | |||
<ul class="instructions"> | |||
<li>First wash the potatoes.</li> | |||
<li>Then slice and dice them and put them in boiling fat.</li> | |||
<li>After a few minutes take them out again.</li> | |||
</ul> | |||
<h2>Further details</h2> | |||
<p>Enough for <span class="yield">12 children</span>.</p> | |||
<p>Preparation time is approximately | |||
<span class="duration"><span class="value-title" title="PT1H30M"> </span>90 min</span> | |||
</p> | |||
<p>Add <span class="duration"><span class="value-title" title="PT30M"></span>half an hour</span> to prepare your homemade Ketchup.</p> | |||
<p>This recipe is <a href="http://www.example.com/tags/difficulty/easy" rel="tag">easy</a> and <a href="http://www.example.com/tags/tastyness/delicious" rel="tag">delicious</a>.</p> | |||
<p> | |||
<span class="nutrition"> | |||
Pommes Frites have more than | |||
<span class="value">1000</span> | |||
<span class="type">Joule</span> | |||
Energy</span>, | |||
while Ketchup and Mayonnaise have | |||
<span class="nutrition">0 vitamins</span>. | |||
</p> | |||
</div> | </div> | ||
</ | </source> | ||
<!-- | <!-- | ||
Want to write valid [[hrecipe|hRecipe]]? Use the [http://microformats.org/code/hrecipe/creator hRecipe creator] (not implemented yet) to write about recipes and publish it on your blog. | Want to write valid [[hrecipe|hRecipe]]? Use the [http://microformats.org/code/hrecipe/creator hRecipe creator] (not implemented yet) to write about recipes and publish it on your blog. | ||
Line 317: | Line 370: | ||
== Examples in the wild == | == Examples in the wild == | ||
This section is '''informative'''. | This section is '''informative'''. | ||
Sites and pages that publish hRecipes. When it gets too big we can move it to a separate page like [[hrecipe-examples-in-wild]]. | |||
* [http://www.vegichef.de/ Vegichef.de]'s recipes are marked up with hRecipe e.g. [http://www.vegichef.de/rezepte/seitan-doner-mit-zaziki/ Seitan Döner mit Tsatsiki] | |||
* [http://funcook.com/ Red social de recetas de cocina] recipes are marked up with hRecipe e.g. [http://funcook.com/receta.php?id=124 Pollo al curry con arroz basmati] | |||
* [http://www.therecipedepository.com The Recipe Depository] recipes are marked up with hRecipe e.g. [http://therecipedepository.com/recipe/650/african-sweet-potato-and-peanut-stew African Sweet Potato and Peanut Stew] | |||
* [http://sabores.sapo.pt/ SAPO Sabores]'s recipes are marked up with hRecipe, e.g. [http://sabores.sapo.pt/receita/espetadas-de-camarao-com-molho-picante Receita: Espetadas de camarão com molho picante - SAPO Sabores] | |||
* [http://www.epicurious.com/ Epicurious.com]'s [http://www.epicurious.com/recipesmenus/ recipes] have been marked up with hRecipe as of April 2010. (E.g., [http://www.epicurious.com/recipes/food/views/Chocolate-Almond-and-Banana-Parfaits-357369 Chocolate, Almond, and Banana Parfaits]) | |||
* [http://www.williams-sonoma.com/ Williams-Sonoma]'s [http://www.williams-sonoma.com/recipe/ recipes section], e.g. [http://www.williams-sonoma.com/recipe/cherry-almond-bundt-cake.html Cherry Almond Bundt Cake] | |||
* http://foodnetwork.com/ has marked up all their recipes with hRecipe as of 2009-10, e.g. [http://www.foodnetwork.com/recipes/ina-garten/deep-dish-apple-pie-recipe2/index.html Deep-Dish Apple Pie recipe] | |||
* [http://www.plantoeat.com/ Plan to Eat]'s [http://www.plantoeat.com/recipe_book recipe planner] is now in hRecipe format as of April 2010. (E.g., [http://www.plantoeat.com/recipes/4583/1fv1A5vFhjm Pasta With Smashed Peas]) | |||
* essen & trinken. As of spring 2009 [http://www.essen-und-trinken.de essen & trinken] publishes all recipes with hRecipe-conformant metadata encoded in RDF. See [[hrecipe-rdf]] for technical details. | |||
* It's Ripe! As of January 2009, [http://itsripe.com/recipes/ http://itsripe.com] supports hRecipe for recipe pages and will soon add support in lists. | |||
*'''Wild Mushroom, Pancetta & Truffle Risotto''' by Toby Inkster | |||
** [http://tobyinkster.co.uk/blog/2008/10/23/mushroom-risotto/ Marked up as hRecipe] using the September 2007 draft format | |||
** [http://srv.buzzword.org.uk/recipebook/tobyinkster.co.uk/blog/2008/10/23/mushroom-risotto/ RecipeBook XML] output from Cognition. | |||
** [http://srv.buzzword.org.uk/rdf-xml/tobyinkster.co.uk/blog/2008/10/23/mushroom-risotto/ RDF/XML] and [http://srv.buzzword.org.uk/turtle/tobyinkster.co.uk/blog/2008/10/23/mushroom-risotto/ Turtle] output from Cognition. | |||
* allrecipes.com e.g. [http://allrecipes.com//Recipe/slow-cooker-chicken-and-dumplings/Detail.aspx Slow cooker chicken and dumplings] | |||
* food.com e.g. [http://www.food.com/recipe/chicken-and-dumplings-72963 Chicken dumplings] | |||
* tablespoon.com e.g. [http://www.tablespoon.com/recipes/old-fashioned-chicken-and-dumplings-recipe/1/ Chicken dumplings] | |||
* shopglider.com e.g. [http://shopglider.com/r/dimathepublisher/19/Fatush-Salad/ Fatush Salad] | |||
== Implementations == | == Implementations == | ||
This section is '''informative'''. | |||
Tools for generating and consuming hRecipes. When it gets too big we can move it to a separate page like [[hrecipe-implementations]]. | |||
Consuming hRecipes (sites and tools that consume and do something with hRecipes) | |||
* '''[[Google Search]] feature: Recipes''' . Launched 24th February, 2011, [http://www.google.com/landing/recipes/ Recipe View] search results from Google are powered by hRecipe marked-up snippets. | |||
* '''Cognition.''' As of September 2008, [http://buzzword.org.uk/cognition/ Cognition] has experimental support for this format. ([http://buzzword.org.uk/cognition/uf-plus.html#hrecipe Details of support].) Recipes may be exported in [[recipe-formats#RecipeBook_XML|RecipeBook XML]] format or RDF. | |||
* | Generating hRecipes (sites and tools that help produce and publish hRecipes) | ||
* '''[http://recipeseo.com/ RecipeSEO Application]''' - a nice hRecipe creator form with fields for title/name, ingredients (expandable), instructions, and more options (author, photo, yield, etc.) | |||
* '''Recipe SEO WordPress Plugin''': [http://sushiday.com/recipe-seo-plugin/ RecipeSEO Plugin] helps you publish hRecipe on your self-hosted WordPress blog. Donation supported. | |||
* '''WordPress hRecipe Plugin.''' There's a [http://wordpress.org/ WordPress ] [http://wordpress.org/extend/plugins/hrecipe/ hRecipe Plugin] available which makes adding hRecipe metadata to recipes very easy, practically effortless. Very nice! | |||
* '''hRecipeHelper Chrome Extension.''' Released 16th March, 2011 [https://chrome.google.com/webstore/detail/cgpnljccbfcjhhekfnikhpllfjpjidlj hRecipeHelper] A [[Chrome]] Extension for building hRecipe formatted HTML for blogging or websites. | |||
* '''hRecipeHelper web app'''. Released 5th April, 2011 [http://bit.ly/hPcVDD hRecipeHelper-webapp] Very similar to the Chrome Extension but, now available for other modern browsers and even IE8. | |||
== References == | == References == | ||
=== Normative References === | === Normative References === | ||
* [http://www.w3.org/TR/2002/REC-xhtml1-20020801/ XHTML 1.0 SE] | * [http://www.w3.org/TR/2002/REC-xhtml1-20020801/ XHTML 1.0 SE] | ||
Line 355: | Line 430: | ||
* [[xoxo|XOXO]] | * [[xoxo|XOXO]] | ||
== Copyright == | |||
<span class="vevent"><span class="summary">Per [[Microformats_Wiki:Copyrights]], hRecipe was placed into the public domain</span> on <span class="dtstart">2008-11-14</span></span> by the authors. There are no usage, distribution, re-printing, or any other restrictions of any kind with regards to the text or content of this specification. | |||
== Patents == | |||
{{MicroFormatPatentStatement}} | {{MicroFormatPatentStatement}} | ||
== Public Domain Release == | |||
The authors and editors of this page due hereby relinquish their copyright on the document and release the text of this page into the public domain. | The authors and editors of this page due hereby relinquish their copyright on the document and release the text of this page into the public domain. | ||
Line 371: | Line 446: | ||
* [[User:TobyInk|Toby Inkster]] | * [[User:TobyInk|Toby Inkster]] | ||
* [[User:ThomasLoertsch | Thomas Loertsch]] ([http://www.essen-und-trinken.de Gruner+Jahr]) | * [[User:ThomasLoertsch | Thomas Loertsch]] ([http://www.essen-und-trinken.de Gruner+Jahr]) | ||
== Work in progress == | == Work in progress == | ||
This specification is a work in progress. As additional aspects are discussed, understood, and written, they will be added. | This specification is a work in progress. As additional aspects are discussed, understood, and written, they will be added. | ||
== derivative works == | |||
* [[hrecipe-rdf|hRecipe in RDF]] - mapping of hRecipe into a RDF vocabulary called "aRecipe" | |||
==related pages== | ==related pages== |
Revision as of 16:27, 18 July 2020
This document represents a draft microformat specification. Although drafts are somewhat mature in the development process, the stability of this document cannot be guaranteed, and implementers should be prepared to keep abreast of future developments and changes. Watch this wiki page, or follow discussions on the #microformats IRC channel to stay up-to-date.
hRecipe is a simple, open, distributed format, suitable for embedding information about recipes for cooking in (X)HTML, Atom, RSS, and arbitrary XML. hRecipe is one of several microformats open standards. This page and Microformat is in the public domain.
hRecipe Microformat Draft Specification
Editor
Authors
Contributors
Andy Mabbett, Frances Berriman, Cameron Perry, John LeMasney, Tantek Çelik, SudarshanP, Ciaran McNulty, Lee Jordan, Robert Bachmann, jeffmcneill, Manu Sporny, Ryan King, HollyMarieKoltz, Straup, Christophe Ducamp, Mercman, Yde, Ameer Dawood, Scottk, Lee Jordan, MonroAlmon, EstevaoSamuel, Brian Suda, SteveL, JohnLeMasney,
Microformats #Copyright and #Patents statements apply.
Introduction
The hRecipe microformat is designed for the mark-up of instructions for creating meals, drinks or food-based items.
It is difficult for a browser to extract semantic information about a recipe described on a web page. Metadata such as author and name and details such as ingredients, method, preparation time etc provide relevant information about the recipe.
Having such information marked up can provide a number of benefits to the viewer. If a web browser understands that a particular web page contains a recipe with specific characteristics, it can produce richer interactions. For example, specific searches may be performed for ingredients or authors via general search services such as Google and Wikipedia. Additionally, classification by crawlers can become more accurate. If there are 20 recipes found on a page, and they all contain a certain ingredient, it can be assumed that the page is not only about cooking, but also about that particular ingredient.
In order to enable and encourage the sharing, distribution, syndication, and aggregation of recipes, the authors propose the hRecipe microformat, an open standard for distributed recipe metadata. The authors have researched both numerous recipe-examples in the wild and earlier attempts at recipe-formats, and have designed hRecipe around a simple minimal schema for recipe content. Feedback is encouraged on the hRecipe feedback page.
Inspiration and Acknowledgments
Many thanks to the various individuals that did research and proposed ideas and discussion related to the hRecipe-format and recipes in general.
Scope
hRecipe is a format to annotate descriptions and lists of ingredients for the preparation of food and meals. Recipes consistently share several common properties. hRecipe has been based on this minimal common subset.
Out of scope
Recipes that are not for stuff that's meant to be eaten by humans are out of scope.
Format
The key words "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY", and "OPTIONAL" in this document are to be interpreted as described in RFC 2119.
In General
The hRecipe format is based on a set of properties common to numerous recipe sites and formats in use today on the web. Where possible property names have been chosen based on those defined by related microformat standards.
Some properties are marked experimental since they exceed the minimum set of properties needed to describe a recipe but still are very commonly used on the web. It's not sure if they are relevant enough for inclusion in the format. Implementation and general uptake of these properties will be observed and inform further decisions. So their use is not at all discouraged - but use them with care and be prepared for their eventual removal from the final spec.
Schema
The hRecipe schema consists of the following properties:
- hrecipe
- fn. required. text. the name of the recipe.
- ingredient. required. 1 or more. text with optional valid (x)HTML markup.
- value and type. optional. [experimental]
- yield. optional. text.
- instructions. optional. text with optional valid (x)HTML markup.
- duration. optional. 1 or more. text.
- photo. optional. 1 or more. using any element containing a URL, such as IMG. [experimental]
- summary. optional. text. [experimental]
- author. optional. 1 or more. [experimental]
- published. optional. [experimental]
- nutrition. optional. 1 or more. [experimental]
- value and type. optional. [experimental]
- tag. optional. 1 or more. [experimental]
- license. optional. 1 or more. just use rel-license to license recipe permalink pages
Property details
Property names fn
, photo
, author
, value
and type
are reused from hCard. Property name duration
is reused from hAudio. Property name summary
is reused from hCalendar. Property name published
is reused from hAtom. Property name tag
is reused from rel-tag.
The fields of the hRecipe schema represent the following:
hRecipe
A hRecipe is used to identify and describe values and metadata typically associated with a recipe.
- A hRecipe property is identified by the name
hrecipe
fn
The title of a single recipe. A short textual description used to identify the work among interested parties. This can be the name of a meal or a short description regarding it's ingredients.
- The property is identified by the name
fn
. - A Recipe MUST include a
fn
. - The property MUST follow the conventions outlined in hCard e.g. by using only plain text.
ingredient
Describes one or more ingredients used in the recipe.
- The property is identified by the name
ingredient
. - A Recipe MUST include one or more
ingredient
s. - The property MAY include valid HTML markup (e.g. a list of ingredients).
- The property MAY include the properties
value
andtype
following the conventions outlined in hCard, e.g.In this case each ingredient should be marked up with it's own<p class="ingredient"><span class="value">125</span><span class="type">ml</span> milk</p>
ingredient
property. These subproperties are considered experimental and may be removed from the final specification or replaced by 'num' and 'unit' from measure.
yield
Specifies the quantity produced by the recipe, like how many persons it satisfyies or how many pieces can be made of it.
- The property is identified by the name
yield
. - A Recipe MAY include a
yield
.
instructions
The method of the recipe.
- The property is identified by the name
instructions
. - A Recipe MAY include a
instructions
property. - The property MAY include valid HTML markup e.g. paragraphs or a list of steps.
duration
The time it takes to prepare the meal described by the recipe. Multiple duration properties can be used to denote e.g. time for preparing a dough, time needed for the dough to raise, time to bake the dough, time for decorating the cake etc.
- The property is identified by the name
duration
. - A Recipe MAY include one or more
duration
properties. - The property MAY encode the timespan as outlined in the value-class-pattern. A duration of 1 hour 30 minutes would translate to "PT1H30M" in ISO 8601 format and can be encoded as follows:
<span class="duration"><span class="value-title" title="PT1H30M"> </span>90 min</span>
photo
Accompanying image.
- The property is identified by the name
photo
. - A Recipe MAY include one or more
photo
properties. - The property SHOULD use an <img> element. It MAY use any other element that contains a URL, such as <a> or <object>, but it is not recommended. See notes below.
- The property is considered experimental and may be removed from the final specification.
summary
The summary provides a short introduction to or an accompanying statement about the recipe.
- The property is identified by the name
summary
. - A Recipe MAY include a
summary
. - The property MUST follow the conventions outlined in hCalendar. Plain text fulfills these requirements.
- The property is considered experimental and may be removed from the final specification.
author
An author is the person who wrote the recipe.
- The property is identified by the name
author
. - A Recipe MAY include one or more
author
properties. - The contents of the element MAY be a plain text string in which case it defaults to a "vcard fn". Anything more elaborate MUST follow the conventions outlined in hCard.
- The element is considered experimental and may be removed from the final specification.
published
The date the recipe was published.
- The property is identified by the name
published
. - A Recipe MAY include a
published
date. - The property MAY be encoded using the value-class-pattern, e.g.:
<p>Published <span class="published"><span class="value-title" title="2008-10-14T10:05:37-01:00"> </span>14. Oct 2008</span></p>
- The property is considered experimental and may be removed from the final specification.
nutrition
Nutritional information like calories, fat, dietary fiber etc.
- The property is identified by name
nutrition
. - A Recipe MAY include one or more
nutrition
properties. - The property MAY include the properties
value
andtype
following the conventions outlined in hCard. In this case each nutritional information item should be marked up with it's ownnutrition
property. These subelement are considered experimental and may be replaced by 'num' and 'unit' from measure. - The property
nutrition
itself is also considered experimental and may be removed from the final specification.
tag
A keyword indicating a subject or an important aspect of the recipe like it's main ingredient, type of meal etc.
- The property is identified by the name
tag
. - A Recipe MAY include one or more
tag
's. - The property MUST follow the conventions outlined in rel-tag.
- The property is considered experimental and may be removed from the final specification.
license
'license' is simply re-use of the rel-license microformat as a building block.
Use rel-license to link to a license for the recipe on the recipe permalink page.
Version history
- Version 0.22 changed the proposed formatting of time and date from the datetime-design-pattern, which has accessibility issues, to the value-class-pattern. Also corrected some errors in the example especially with regard to the correct handling of vcard properties.
- Version 0.21 changed the status of ingredient/value and ingredient/type to experimental, mentioning that there still is discussion if they should be replaced by 'num' and 'unit' from measure (which is still in brainstorming).
- Version 0.2: From Version 0.1 some elements have been renamed to strenghten re-use of established elements: fn for hRecipe-title, summary for hRecipe-summary, duration for preparation-time, value and type for num and unit. Also some elements have been marked experimental because of concerns of element bloat. See the hrecipe-issues page for a more thorough discussion.
Draft 0.1 was already a result of long lasting efforts. Nonetheless after publishing of it there has been a lively debate about some properties. Since they mostly could be resolved version 0.2 is considered fairly stable now, although of course you never know ;-)
Parser Processing Notes
- If the "author" property contains only a plain text string it should be regarded as of type "vcard fn".
Semantic XHTML Design Principles
Note: the Semantic XHTML Design Principles were written primarily within the context of developing hCard and hCalendar, thus it may be easier to understand these principles in the context of the hCard design methodology (i.e. read that first). Tantek
XHTML is built on XML, and thus XHTML based formats can be used not only for convenient display presentation, but also for general purpose data exchange. In many ways, XHTML based formats exemplify the best of both HTML and XML worlds. However, when building XHTML based formats, it helps to have a guiding set of principles.
- Reuse the schema (names, objects, properties, values, types, hierarchies, constraints) as much as possible from pre-existing, established, well-supported standards by reference. Avoid restating constraints expressed in the source standard. Informative mentions are ok.
- For types with multiple components, use nested elements with class names equivalent to the names of the components.
- Plural components are made singular, and thus multiple nested elements are used to represent multiple text values that are comma-delimited.
- Use the most accurately precise semantic XHTML building block for each object etc.
- Otherwise use a generic structural element (e.g.
<span>
or<div>
), or the appropriate contextual element (e.g. an<li>
inside a<ul>
or<ol>
). - Use class names based on names from the original schema, unless the semantic XHTML building block precisely represents that part of the original schema. If names in the source schema are case-insensitive, then use an all lowercase equivalent. Components names implicit in prose (rather than explicit in the defined schema) should also use lowercase equivalents for ease of use. Spaces in component names become dash '-' characters.
- Finally, if the format of the data according to the original schema is too long and/or not human-friendly, use
<abbr>
instead of a generic structural element, and place the literal data into the 'title' attribute (where abbr expansions go), and the more brief and human readable equivalent into the element itself. Further informative explanation of this use of<abbr>
: Human vs. ISO8601 dates problem solved
More Semantic Equivalents
For some properties there is a more semantic equivalent, and therefore they get special treatment, e.g.:
- For "photo", use
<img class="photo" src="..." alt="" />
Language
- To explicitly convey the natural language that an recipe is written in, use the standard (X)HTML 'lang' or 'xml:lang' attribute on the element with class="hrecipe"
- e.g.
<p>I like <span class="hrecipe" lang="de"><span class="fn">Kartoffelknödel</span></span> best.</p>
- e.g.
- If portions of an hRecipe (e.g. an ingredient name) are in a different language to the rest of the hRecipe, use the 'lang' or 'xml:lang' attribute on those portions.
- hRecipe parsers which need to handle the native language of hRecipe MUST process the standard (X)HTML 'lang' or 'xml:lang' attribute as specified.
- hRecipe parsers which need to handle native language MAY traverse up the DOM to discover the native language of the page and apply that to the hRecipe if no other language is specified on the hRecipe.
Human vs. Machine Readable
If an <abbr>
element is used for a property, then its 'title
' attribute is used for the value of the property, instead of the contents of the element, which can then be used to provide a user-friendly alternate presentation of the value.
If an <a>
element is used for one or more properties, it MUST be treated as follows:
- For the 'photo' property and any other property that takes a URL as its value, the
href="..."
attribute provides the property value. - For other properties, the element's content is the value of the property.
If an <img>
element is used for the 'photo' property, it MUST use the property value provided by the src="..."
attribute as property value.
If an <object>
element is used for the 'photo' property, it MUST use the property value provided by the data="..."
attribute as property value.
Notes
This section is informative.
- Non so far.
XMDP Profile
<dl class="profile">
<dt>class</dt>
<dd><p>
<a rel="help" href="http://www.w3.org/TR/html401/struct/global.html#adef-class">
HTML4 definition of the 'class' attribute.</a>
This meta data profile defines some 'class' attribute values (class names)
and their meanings as suggested by a
<a href="http://www.w3.org/TR/WD-htmllink-970328#profile">
draft of "Hypertext Links in HTML"</a>.</p>
<dl>
<dt>hrecipe</dt>
<dd>
Used to identify and describe metadata associated with instructions for creating meals, drinks or food-based items.
</dd>
<dt>fn</dt>
<dd>
The title of the recipe.
</dd>
<dt>ingredient</dt>
<dd>
Describes the ingredient(s) used in the recipe.
</dd>
<dt>yield</dt>
<dd>
Specifies the quantity produced by the recipe.
</dd>
<dt>instructions</dt>
<dd>
The method of the recipe.
</dd>
<dt>duration</dt>
<dd>
The time it takes to prepare the meal described by the recipe.
</dd>
<dt>photo</dt>
<dd>
Accompanying image.
</dd>
<dt>summary</dt>
<dd>
The summary provides a short introduction or an accompanying statement about the recipe.
</dd>
<dt>author</dt>
<dd>
The person who authored the recipe..
</dd>
<dt>published</dt>
<dd>
The date that the recipe was made available to the public.
</dd>
<dt>nutrition</dt>
<dd>
Nutritional information like calories, fat, dietary fiber etc.
</dd>
<dt>tag</dt>
<dd>
Keyword(s) describing the recipe.
</dd>
</dl>
</dd>
</dl>
Examples
This section is informative.
Here will be a few examples of recipes, from real web sites, showing how they could be easily enhanced to use hRecipe. In the meantime the following contrieved example will have to do.
<div class="hrecipe">
<h1 class="fn">Pommes Frites</h1>
<p class="summary">
Pommes frites originate in outer space. They are served hot.<br />
This recipe is only an example. Don't try this at home!
</p>
<p>
Contributed by <span class="author">CJ Tom</span> and the
<span class="author vcard"><a class="url fn" href="http://example.com">Cooky Gang</a></span>.
</p>
<p>Published <span class="published"><span class="value-title" title="2008-10-14T10:05:37-01:00"> </span>14. Oct 2008</span></p>
<img src="/img/pommes.png" class="photo" width="100" height="100" alt="Pommes Frites"/>
<h2>Ingredients</h2>
<ul>
<li class="ingredient">
<span class="value">500</span>
<span class="type">gramme</span> potatoes, hard cooking.
</li>
<li class="ingredient">
<span class="value">1</span> <span class="type">spoonful</span> of salt
</li>
<li>
You may want to provide some
<span class="ingredient">Ketchup and Mayonnaise</span>
as well.
</li>
</ul>
<h2>Instructions</h2>
<ul class="instructions">
<li>First wash the potatoes.</li>
<li>Then slice and dice them and put them in boiling fat.</li>
<li>After a few minutes take them out again.</li>
</ul>
<h2>Further details</h2>
<p>Enough for <span class="yield">12 children</span>.</p>
<p>Preparation time is approximately
<span class="duration"><span class="value-title" title="PT1H30M"> </span>90 min</span>
</p>
<p>Add <span class="duration"><span class="value-title" title="PT30M"></span>half an hour</span> to prepare your homemade Ketchup.</p>
<p>This recipe is <a href="http://www.example.com/tags/difficulty/easy" rel="tag">easy</a> and <a href="http://www.example.com/tags/tastyness/delicious" rel="tag">delicious</a>.</p>
<p>
<span class="nutrition">
Pommes Frites have more than
<span class="value">1000</span>
<span class="type">Joule</span>
Energy</span>,
while Ketchup and Mayonnaise have
<span class="nutrition">0 vitamins</span>.
</p>
</div>
Examples in the wild
This section is informative.
Sites and pages that publish hRecipes. When it gets too big we can move it to a separate page like hrecipe-examples-in-wild.
- Vegichef.de's recipes are marked up with hRecipe e.g. Seitan Döner mit Tsatsiki
- Red social de recetas de cocina recipes are marked up with hRecipe e.g. Pollo al curry con arroz basmati
- The Recipe Depository recipes are marked up with hRecipe e.g. African Sweet Potato and Peanut Stew
- SAPO Sabores's recipes are marked up with hRecipe, e.g. Receita: Espetadas de camarão com molho picante - SAPO Sabores
- Epicurious.com's recipes have been marked up with hRecipe as of April 2010. (E.g., Chocolate, Almond, and Banana Parfaits)
- Williams-Sonoma's recipes section, e.g. Cherry Almond Bundt Cake
- http://foodnetwork.com/ has marked up all their recipes with hRecipe as of 2009-10, e.g. Deep-Dish Apple Pie recipe
- Plan to Eat's recipe planner is now in hRecipe format as of April 2010. (E.g., Pasta With Smashed Peas)
- essen & trinken. As of spring 2009 essen & trinken publishes all recipes with hRecipe-conformant metadata encoded in RDF. See hrecipe-rdf for technical details.
- It's Ripe! As of January 2009, http://itsripe.com supports hRecipe for recipe pages and will soon add support in lists.
- Wild Mushroom, Pancetta & Truffle Risotto by Toby Inkster
- Marked up as hRecipe using the September 2007 draft format
- RecipeBook XML output from Cognition.
- RDF/XML and Turtle output from Cognition.
- allrecipes.com e.g. Slow cooker chicken and dumplings
- food.com e.g. Chicken dumplings
- tablespoon.com e.g. Chicken dumplings
- shopglider.com e.g. Fatush Salad
Implementations
This section is informative.
Tools for generating and consuming hRecipes. When it gets too big we can move it to a separate page like hrecipe-implementations.
Consuming hRecipes (sites and tools that consume and do something with hRecipes)
- Google Search feature: Recipes . Launched 24th February, 2011, Recipe View search results from Google are powered by hRecipe marked-up snippets.
- Cognition. As of September 2008, Cognition has experimental support for this format. (Details of support.) Recipes may be exported in RecipeBook XML format or RDF.
Generating hRecipes (sites and tools that help produce and publish hRecipes)
- RecipeSEO Application - a nice hRecipe creator form with fields for title/name, ingredients (expandable), instructions, and more options (author, photo, yield, etc.)
- Recipe SEO WordPress Plugin: RecipeSEO Plugin helps you publish hRecipe on your self-hosted WordPress blog. Donation supported.
- WordPress hRecipe Plugin. There's a WordPress hRecipe Plugin available which makes adding hRecipe metadata to recipes very easy, practically effortless. Very nice!
- hRecipeHelper Chrome Extension. Released 16th March, 2011 hRecipeHelper A Chrome Extension for building hRecipe formatted HTML for blogging or websites.
- hRecipeHelper web app. Released 5th April, 2011 hRecipeHelper-webapp Very similar to the Chrome Extension but, now available for other modern browsers and even IE8.
References
Normative References
Informative References
- CSS1
- ISO.8601.1988
- International Organization for Standardization, "Data elements and interchange formats - Information interchange - Representation of dates and times", ISO Standard 8601, June 1988.
- W3C NOTE-datetime-19980827
- W3C Patent Policy
- Other recipe metadata efforts. See recipe-formats.
- grouping-examples
- grouping-brainstorming
- XOXO
Copyright
Per Microformats_Wiki:Copyrights, hRecipe was placed into the public domain on 2008-11-14 by the authors. There are no usage, distribution, re-printing, or any other restrictions of any kind with regards to the text or content of this specification.
Patents
This specification is subject to a royalty free patent policy, e.g. per the W3C Patent Policy, and IETF RFC3667 & RFC3668.
Public Domain Release
The authors and editors of this page due hereby relinquish their copyright on the document and release the text of this page into the public domain.
Work in progress
This specification is a work in progress. As additional aspects are discussed, understood, and written, they will be added.
derivative works
- hRecipe in RDF - mapping of hRecipe into a RDF vocabulary called "aRecipe"
- hRecipe issues - issues regarding the hRecipe draft
- hRecipe feedback - general feedback regarding hRecipe
Per the microformats process, the recipe effort developed
- recipe-examples
- recipe-formats
- recipe-brainstorming (see also recipe-brainstorming-archive)
- recipe-issues
towards the development of this draft.