Microformats Wiki - User contributions [en]

rel-tag-examples-in-wild

2013-02-02T06:51:35Z

LawrenceWoodman: Add goodpredictions example

<entry-title>rel-tag Examples in the wild</entry-title>

This page is an '''informative''' section of the [[rel-tag|rel-tag specification]].

The following sites have published [[rel-tag|rel-tag]], and thus are a great place to start for anyone looking for examples "in the wild" for inspiration, or try parsing and indexing.

== new and uncategorized examples ==

* [http://goodpredictions.com GoodPredictions] uses rel-tag on questions such as [http://goodpredictions.com/question/7/who_will_be_sworn_in_after_the_2013_australian_federal_election/ Who will be sworn in after the 2013 Australian federal election?]. Note that rel-tag, as per the spec, is only used on the page that is being tagged, not on all pages mentioning that tag. So on the [http://goodpredictions.com/closing/ Closing soon] page you will see that rel-tag is not being used against the tags there.
* [http://picc.it Picc.it] uses rel-tag site-wide to markup links from pictures and albums back to their tag search pages. [http://picc.it/c/wallpapers/pictures/id/1246992/@_fountain_trafalger_square_lo Example Picture (Fountain, Trafalger Square, London)].
** '''Problematic.''' The example of "Trafalger Square" gets rel-tag wrong, and thus uses the tag "1" three times due to putting pagination (1) in the last segment of the URL.
* [http://sterlinghotels.com Sterling Hotels] uses rel-tag to mark up links to countries in search (look at country links on left) [http://sterlinghotels.com/search.aspx?hotelname=hotel Search for term hotel]
* [http://sterlingdesignhotels.com Sterling Design Hotels] uses rel-tag to mark up links to countries in search (look at country links on left) [http://sterlingdesignhotels.com/search.aspx?hotelname=hotel Search for term hotel]
* [http://www.blogspot.com Blogger by Google] uses rel-tag for post tags e.g. [http://analytics.blogspot.com Google Analytics Blog]
* [http://www.therecipedepository.com The Recipe Depository] uses rel-tag on all recipe pages to mark all the categories the recipes are filed under, e.g. [http://therecipedepository.com/recipe/662/spaghetti-with-tomatoespine-nutsand-arugula Spaghetti with Tomatoes, Pine Nuts, and Arugula]
* [http://www.linkedin.com LinkedIn] uses rel-tag throughout their pages.
* [http://www.amazon.com Amazon.com] now uses rel-tag on individual product pages allowing users to tag products with tags to help other users find products easier, e.g. [http://www.amazon.com/Febreze-Refresher-Antimicrobial-27-Ounce-Bottles/dp/B001D1YJKC/ref=wl_it_dp_o_npd?ie=UTF8&coliid=I1TJPD1T16WZ2W&colid=30JQN5R73GXZP Febreze Fabric Refresher, Antimicrobial, 27-Ounce Bottles (Pack of 6)]
* [http://trustafriend.com Trust a Friend] uses rel-tag for reviewed businesses in a city. For example: [http://trustafriend.com/reviews/le-gigot-cornelia-st-new-york-ny/ Le Gigot] has the tags: [http://trustafriend.com/us/newyork/french French] and [http://trustafriend.com/us/newyork/restaurant Restaurant].
* [http://en.newsgrail.com/ Newsgrail] uses rel-tag for an implementation of structured sematic tagging by [http://opencalais.com/ OpenCalais].
* [http://davidswain.co.uk Actor David Swain] uses rel-tag on all "tag" links on his site each pointing to its own tag-space.
* [http://beeets.com beeets] is a tag-based event search engine that uses rel-tag on all "tag" links, each pointing to its own tag-space.
* [http://www.beginrunning.com/ Begin Running] uses rel-tag on pages containing tagged content.
* [http://www.sunfactory.fr/en/ Sun Factory] uses rel-tag on some of its product pages. For example : [http://www.sunfactory.fr/en/personalized-gifts/statuette-trophy-soccer-player-football.html Trophy Soccer Player].
* [http://laibcoms.asia/blog/ Snow World] uses rel-tag on all "tag" links. As is built in [http://b2evolution.net b2evolution].
* [http://gameshogun.ws/ gameshogun™] uses rel-tag on all "tag" links. A [http://b2evolution.net b2evolution] implementation.
* [http://clothesonline.info ClothesOnline] uses rel-tag for categorizing shops and brands, for example: [http://clothesonline.info/brands/canada-goose Canada Goose].
* [http://huffduffer.com/ Huffduffer] uses rel-tag on every page, pointing to its own tag space e.g. http://huffduffer.com/tags/microformats
* [http://www.pantrymothtrap.com/ Pantry Moth Traps] implements the rel-tag in articles where an authoritative source is known. (for example in the article [http://www.pantrymothtrap.com/MothTrapsPick.html Moth Trap Picks] the tag [http://www.cleanertoday.com/tag/moth%20trap Moth Trap])
* [http://www.hightechcville.com/ HighTechCville] uses rel-tag on all the pages listing tagged content for [http://www.hightechcville.com/people people], [http://www.hightechcville.com/organizations organizations] and [http://www.hightechcville.com/events events] related to high tech in Charlottesville, VA.
* [http://skateboardspot.info skateboardspot.info] uses rel-tag in spotguide entries which are added to the site and categorized by the users (for example: [http://skateboardspot.info/cat/spotguide/action/view/id/1 “El Toro High School” spotguide entry]).
* [http://www.idoneos.com Idoneos.com] uses rel-tag for conceptual links to its own tag space, a collection of 'concepts' (mostly spanish).
* [http://www.professionalontheweb.com Professional On The Web] uses rel-tag for user entered tags which categorize web professionals and freelancers.
* [https://www.coderesort.com/p/epicode/wiki/CloudCuckoo CloudCuckoo] (secure site but open to all) an [http://www.episerver.com EPiServer] module distributed free by [http://www.interakting.co.uk Interakting], generates tag clouds with rel-tag links.
* [http://www.lifetime.com Lifetime.com] uses rel- and rev-tags in all content pages.
* [http://www.my-warehouse.de the my-Warehouse shopsystem] implements rel-tags in box headings and categories links.
* Joseph Bergantine uses tags to categorize [http://bergantinedesign.us/wallpaper/ wallpapers] and [http://bergantinedesign.us/blog/my-name-is-rachel-corrie blog posts]
* [http://www.codesignville.com Codesignville] uses rel-tag to indicate content categories.
* [http://www.bossalive.com BossaLive] uses rel-tag for tagging music. Publishes rel-tags for album, artist and genre.
** Also uses [[hcard|hCard]] on user profile pages.
* [http://www.qmpeople.com/ qmpeople] Uses rel-tag for translated tags into english, french and italian to meet new friends in different countries.
* [http://www.keevu.com Keevu.com] uses rel-tag to indicate content categories on most pages, like [http://www.keevu.com/venues venues]
* [http://www.amazingincredible.com Amazing Incredible] uses rel-tag on content pages
* [http://www.auctionlink.com.au AuctionLink] uses rel-tag on [http://www.auctionlink.com.au/TagList/Auctioneers/ Auction Sales Listings] tags.
** Could also use [[hcard|hCard]], e.g. on [http://www.auctionlink.com.au/Auctioneers/Auctioneer/Bonhams_Goodman_1/] [[User:AndyMabbett|Andy Mabbett]]
* Christian Hess uses rel-tag on his [http://www.hess-cr.com homepage blog] and several other pages of his site.
* [http://spacedust.atspace.com/ Spacedust] uses rel-tag to mark up gallery pages.
* [http://my.opera.com/dstorey/blog/ My Opera] uses rel-tag for tags on all user's blog entries.
* [http://dev.opera.com/articles/view/making-wii-friendly-pages/ Dev Opera] uses rel-tag on all article tags.
* [http://www.international.unt.edu UNT International] uses rel-tag to indicate content categories on most pages
* [http://yedda.com Yedda] - Yedda publishes rel-tags for all of the tags the people entered on themselves as well as on all tags entered on questions asked on Yedda.
* [http://www.lingr.com Lingr] publishes rel-tags for all user entered tags.
* [http://odeo.com ODEO] [http://odeo.com/blog/2005/07/adding-microformats-to-odeo.html publishes] rel-tags for user entered tags.
* [http://eventful.com Eventful] publishes rel-tags for user entered tags.
* [http://spinn3r.com Spinn3r] implements rel-tag as well as RSS and Atom subject and categories.
* [http://www.weboffate.com Web of Fate] publishes rel-tags for future predictions.
* [http://www.netd.it/sviluppo/ Netdesign] uses rel-tag for all blog posts.

rel-tag

2011-10-27T06:57:29Z

LawrenceWoodman: Add Trust a Friend example

<entry-title>rel="tag"</entry-title>
__TOC__
== Draft Specification 2005-01-10 ==
; Editors/Authors
:[http://tantek.com/ Tantek Çelik]
:[http://epeus.blogspot.com/ Kevin Marks]

;Concept
:[http://powazek.com/ Derek Powazek]

;short URL
:http://tr.im/reltag

=== Copyright ===
{{MicroFormatCopyrightStatement2004}}
* [[User:Tantek|Tantek]]: I release all my contributions to this specification into the public domain and I encourage the other authors to do so as well.
* [[User:Kevin Marks|Kevin Marks]]: I release all my contributions to this specification into the public domain and I encourage the other authors to do so as well.
** When all authors/editors have done so, we can remove the MicroFormatCopyrightStatement template reference and replace it with the MicroFormatPublicDomainContributionStatement.

=== Patents ===
{{MicroFormatPatentStatement}}

== Abstract ==
[[Rel-Tag]] is one of several [[MicroFormats]]. By adding <code>rel="tag"</code> to a hyperlink, a page indicates that the destination of that hyperlink is an author-designated "tag" (or keyword/subject) for the current page. Note that a tag may just refer to a major portion of the current page (i.e. a blog post). e.g. by placing this link on a page,

<source lang=html4strict><a href="http://technorati.com/tag/tech" rel="tag">tech</a></source>

the author indicates that the page (or some portion of the page) has the tag "tech".

The linked page SHOULD exist, and it is the linked page, rather than the link text, that defines the tag. The last path component of the URL
is the text of the tag, so

<source lang=html4strict><a href="http://technorati.com/tag/tech" rel="tag">fish</a></source>

would indicate the tag "tech" rather than "fish".

== Scope ==
rel="tag" is specifically designed for "tagging" content, typically web pages (or portions thereof, like blog posts).

rel="tag" is NOT designed for "tagging" arbitrary URLs or external content. There is demand for a general decentralized syntax for tagging URLs external to the current page, but this is not meant for that. See [[xfolk|xFolk]] and [[hreview|hReview]] for ways to tag arbitrary URLs.

If you need to define tags as part of a more specialized format, rel="tag" is the recommended way to do so, and [[xfolk|xFolk]], [[hreview|hReview]], [[hcard |hCard]], [[hcalendar|hCalendar]] and [[hrecipe|hRecipe]] all do this.

== XMDP profile ==
See [[rel-tag-profile]].

== Tag Spaces ==

Tags are embedded in HTTP URIs in a well-defined manner so that the tag embedded in an HTTP URI can be mechanically extracted from that URI. Specifically, the last segment of the path portion of the URI (after the final "/" character) contains the tag value. For example, the URI <source lang=html4strict>http://www.example.com/tags/foo</source> contains the tag "foo".

Thus, for the purposes of comparing two HTTP URIs as tags, the last segment of the path portion should be extracted and only that value (that value of the tag) should be compared.

''Need more formal language about comparison and extraction process.''

The destination of a rel="tag" hyperlink is required to be a tag space (a place that collates or defines tags), where the last segment of the path of the URL is the tag, e.g.

<source lang=html4strict>http://technorati.com/tag/tech </source>

is a URL for the tag "tech".

Tags may only be placed in the URL path, and only in the last segment of the path. Tags may not be placed in query parameters or fragment identifiers. e.g.

<source lang=html4strict>http://technorati.com/tag/tech?tag=fish#emu </source>

is still a URL for the tag "tech", not "fish" or "emu".

Since the only part of a tag space URL of which any structure is required is the last path segment, a tag space URL can be hosted at any domain. Authors may choose to link to a tag at a particular tag space in order to provide a specific meaning. E.g. a tag for technology could link to:

<source lang=html4strict> http://en.wikipedia.org/wiki/Technology </source>

Trailing slashes in tag URLs are ignored, that is:

<source lang=html4strict> http://technorati.com/tag/Technology/ </source>
as a rel-tag URL is treated as:
<source lang=html4strict> http://technorati.com/tag/Technology </source>

== Encoding issues ==
Spaces can be encoded either as <code>+</code> or <code>%20</code>. Unicode characters are encoded as specified in [http://www.ietf.org/rfc/rfc3986.txt <nowiki>RFC 3986</nowiki>]. For example:

<source lang=html4strict><a href="http://technorati.com/tag/Sant%C3%A9+et+bien-%C3%AAtre" rel="tag">Santé et bien-être</a> </source>

Note that if using Wikipedia as a tagspace, as discussed above, you should use <code>%20</code> as they remap '+' to <code>%2B</code>, causing a page with a plus sign in the title (which usually does not exist) to appear.

== Tags Are Visible Metadata ==
<code>rel="tag"</code> hyperlinks are intended to be visible links on pages and posts. This is in stark contrast to meta keywords (which were invisible and typically never revealed to readers), and thus is at least somewhat more resilient to the problems which plagued meta keywords.

Making tag hyperlinks visible has the additional benefit of making it more obvious to readers if a page is abusing tag links, and thus providing more peer pressure for better behavior. It also makes it more obvious to authors, who may not always be aware what invisible metadata is being generated on their behalf.

As a result the invisible tag link syntax variant: <code><link rel="tag" href="..." /></code> SHOULD NOT be supported by implementations.

==Examples in the wild==
This section is '''informative'''.

The following sites have implemented rel-tag, and thus are a great place to start for anyone looking for examples "in the wild" to try parsing, indexing, organizing etc. If your site is marked up with rel-tag, feel free to add it to the '''top''' of this list. Once the list grows too big, we'll make a separate wiki page like [[rel-tag-examples-in-wild]].<span id="Examples_in_the_Wild"> </span>
* [http://trustafriend.com Trust a Friend] uses rel-tag for reviewed businesses in a city. For example: [http://trustafriend.com/reviews/le-gigot-cornelia-st-new-york-ny/ Le Gigot] has the tags: [http://trustafriend.com/us/newyork/french French] and [http://trustafriend.com/us/newyork/restaurant Restaurant].
* [http://en.newsgrail.com/ Newsgrail] uses rel-tag for an implementation of structured sematic tagging by [http://opencalais.com/ OpenCalais].
* [http://davidswain.co.uk Actor David Swain] uses rel-tag on all "tag" links on his site each pointing to its own tag-space.
* [http://beeets.com beeets] is a tag-based event search engine that uses rel-tag on all "tag" links, each pointing to its own tag-space.
* [http://www.beginrunning.com/ Begin Running] uses rel-tag on pages containing tagged content.
* [http://www.sunfactory.fr/en/ Sun Factory] uses rel-tag on some of its product pages. For example : [http://www.sunfactory.fr/en/personalized-gifts/statuette-trophy-soccer-player-football.html Trophy Soccer Player].
* [http://laibcoms.asia/blog/ Snow World] uses rel-tag on all "tag" links. As is built in [http://b2evolution.net b2evolution].
* [http://gameshogun.ws/ gameshogun™] uses rel-tag on all "tag" links. A [http://b2evolution.net b2evolution] implementation.
* [http://clothesonline.info ClothesOnline] uses rel-tag for categorizing shops and brands, for example: [http://clothesonline.info/brands/canada-goose Canada Goose].
* [http://huffduffer.com/ Huffduffer] uses rel-tag on every page, pointing to its own tag space e.g. http://huffduffer.com/tags/microformats
* [http://www.pantrymothtrap.com/ Pantry Moth Traps] implements the rel-tag in articles where an authoritative source is known. (for example in the article [http://www.pantrymothtrap.com/MothTrapsPick.html Moth Trap Picks] the tag [http://www.cleanertoday.com/tag/moth%20trap Moth Trap])
* [http://www.hightechcville.com/ HighTechCville] uses rel-tag on all the pages listing tagged content for [http://www.hightechcville.com/people people], [http://www.hightechcville.com/organizations organizations] and [http://www.hightechcville.com/events events] related to high tech in Charlottesville, VA.
* [http://skateboardspot.info skateboardspot.info] uses rel-tag in spotguide entries which are added to the site and categorized by the users (for example: [http://skateboardspot.info/cat/spotguide/action/view/id/1 “El Toro High School” spotguide entry]).
* [http://www.idoneos.com Idoneos.com] uses rel-tag for conceptual links to its own tag space, a collection of 'concepts' (mostly spanish).
* [http://www.professionalontheweb.com Professional On The Web] uses rel-tag for user entered tags which categorize web professionals and freelancers.
* [https://www.coderesort.com/p/epicode/wiki/CloudCuckoo CloudCuckoo] (secure site but open to all) an [http://www.episerver.com EPiServer] module distributed free by [http://www.interakting.co.uk Interakting], generates tag clouds with rel-tag links.
* [http://www.lifetime.com Lifetime.com] uses rel- and rev-tags in all content pages.
* [http://www.my-warehouse.de the my-Warehouse shopsystem] implements rel-tags in box headings and categories links.
* Joseph Bergantine uses tags to categorize [http://bergantinedesign.us/wallpaper/ wallpapers] and [http://bergantinedesign.us/blog/my-name-is-rachel-corrie blog posts]
* [http://www.codesignville.com Codesignville] uses rel-tag to indicate content categories.
* [http://www.bossalive.com BossaLive] uses rel-tag for tagging music. Publishes rel-tags for album, artist and genre.
** Also uses [[hcard|hCard]] on user profile pages.
* [http://www.qmpeople.com/ qmpeople] Uses rel-tag for translated tags into english, french and italian to meet new friends in different countries.
* [http://www.keevu.com Keevu.com] uses rel-tag to indicate content categories on most pages, like [http://www.keevu.com/venues venues]
* [http://www.amazingincredible.com Amazing Incredible] uses rel-tag on content pages
* [http://www.auctionlink.com.au AuctionLink] uses rel-tag on [http://www.auctionlink.com.au/TagList/Auctioneers/ Auction Sales Listings] tags.
** Could also use [[hcard|hCard]], e.g. on [http://www.auctionlink.com.au/Auctioneers/Auctioneer/Bonhams_Goodman_1/] [[User:AndyMabbett|Andy Mabbett]]
* Christian Hess uses rel-tag on his [http://www.hess-cr.com homepage blog] and several other pages of his site.
* [http://spacedust.atspace.com/ Spacedust] uses rel-tag to mark up gallery pages.
* [http://my.opera.com/dstorey/blog/ My Opera] uses rel-tag for tags on all user's blog entries.
* [http://dev.opera.com/articles/view/making-wii-friendly-pages/ Dev Opera] uses rel-tag on all article tags.
* [http://www.international.unt.edu UNT International] uses rel-tag to indicate content categories on most pages
* [http://yedda.com Yedda] - Yedda publishes rel-tags for all of the tags the people entered on themselves as well as on all tags entered on questions asked on Yedda.
* [http://www.lingr.com Lingr] publishes rel-tags for all user entered tags.
* [http://odeo.com ODEO] [http://odeo.com/blog/2005/07/adding-microformats-to-odeo.html publishes] rel-tags for user entered tags.
* [http://eventful.com Eventful] publishes rel-tags for user entered tags.
* [http://spinn3r.com Spinn3r] implements rel-tag as well as RSS and Atom subject and categories.
* [http://www.weboffate.com Web of Fate] publishes rel-tags for future predictions.

== Implementations ==
This section is '''informative'''.

The following implementations have been developed which either generate or parse rel-tag links. If you have a rel-tag implementation, feel free to add it to the '''top''' of this list. Once the list grows too big, we'll make a separate wiki page like [[rel-tag-implementations]].

* [http://b2evolution.net b2evolution] A blog platform which generates rel-tag for all tags on blog posts (starting from v3.x).
* [http://www.textcube.org Textcube.org] makes a blogging tool, Textcube which generates rel-tag for tags on blog posts.
* [http://hashtags.org/ HashTags] tags Twitter posts, converting "#example" into a tag of "example"
* [http://ikiwiki.info ikiwiki] generates rel-tag for all tagged pages (as of version 2.6)
* [http://www.hubtag.com HubTag] helps users find a unique tag across the web for their event - eg. JohnAndBettysWeddingWimbledonMarch07
* [http://www.necctar.com Necctar] is a search engine exclusively based on tag microformat parsing and processing. Necctar uses tags entered by bloggers to index the world wide web
* Nutch has a [[rel-tag]] parser [http://www.mail-archive.com/nutch-commits@lucene.apache.org/msg01014.html committed to their svn repository].
* [http://www.webstandards.org/action/dwtf/microformats/ Dreamweaver Extension suite] from the [http://webstandards.org/ Web Standards Project] enables rel-tagging from within Dreamweaver 8.
* [http://scooch.gr0w.com/ Scooch] slide show creator allows authors to generate rel-tags and group slide shows by rel-tag via a list or cloud with tag usage count.
* The Freetag plugin for the [http://www.s9y.org Serendipity] blog software supports rel-tags on a per-entry basis, as well as inside of its tag clouds. (The Freetag plugin is available inside of SPARTACUS)
* [http://placenamehere.com/TXP/pnh_mf/ pnh_mf] is a plugin for [http://textpattern.com/ Textpattern] that supports embedding rel-tags and other microformats in templates and blog posts. Written by [http://placenamehere.com/ Chris Casciano].
* [http://www.rainskit.com/blog/493/trutags-a-tagging-plugin-for-textpattern tru_tags] is a plugin for [http://textpattern.com/ Textpattern] that supports rel-tagging blog posts via the Keywords field.
* [http://clothesonline.info ClothesOnline] uses rel-tag for categorizing shops and brands, for example: [http://clothesonline.info/brands/canada-goose Canada Goose].
* [http://news.livejournal.com/86492.html?thread=24881884 LiveJournal] - see also [http://www.livejournal.com/support/faq.bml?cat=tags their FAQ regarding their tags support]
* [http://trac.labnotes.org/cgi-bin/trac.cgi/wiki/TagsLinks TagsLinks] Turn each tag into links that let you find related content on tagging services.
* [http://www.octofinder.com OctoFinder] uses rel-tag for all live news tag clouds.
* [http://dev.wp-plugins.org/wiki/BunnysTechnoratiTags Tag plugin for WordPress]
** Note that some sites using WordPress (http://microformatique.com/ for instance) are getting incorrect tags. The tag is ?cat=12 instead of the actual tag value.
* [http://noone.org/blog/tags/Tagging Tag plugin for Blosxom]
* Technorati first implemented rel-tag in its [http://technorati.com/tag/ Technorati Tags] service. Technorati indexes rel-tag tags.
* [http://consumingexperience.blogspot.com/2005/12/updated-multiple-word-technorati-tag.html Greasemonkey script for Firefox that generates tags for Blogger]
* [http://tools.microformatic.com/help/xhtml/rel-lint/ rel-lint] is a validation tool by [[User:DrewMcLellan|Drew McLellan]] that will validate existence of rel-tag attributes.

== References ==
=== Normative References ===
* [http://www.w3.org/TR/REC-html40/ HTML 4]
* [http://www.w3.org/TR/xhtml1/ XHTML 1]
* [http://gmpg.org/xmdp/ XMDP]
* RFC 3986 specifies URL syntax. Section 3.3 specifies URL paths and path segments.

=== Informative References ===
* [[hreview|hReview]] uses rel-tag for tags and scalar tags
* [[xfolk|xFolk]] uses rel-tag to build a distributed remote resource tagging construct
* [http://developers.technorati.com/wiki/attentionxml Attention.XML] uses rel-tag for reader tagging of pages, posts, feeds
* [[hcard|hCard]] can use rel-tag for categories
* [[hcalendar|hCalendar]] can use rel-tag for categories
* [http://technorati.com/help/tags.html Using Technorati Tags]
* Contributed from http://developers.technorati.com/wiki/RelTag
* [http://microformatique.com/?p=61 Know your rel-tag] at microformatique.com

== Discussions ==
* Feedback is encouraged on the [[rel-tag-feedback]] page.
* See also [http://www.technorati.com/cosmos/referer.html blogs discussing this page].
* History: [http://www.powazek.com/2005/07/000532.html How Tags Happened at Technorati] by [http://www.powazek.com/ Derek Powazek]

=== Q&A ===
* If you have any questions about rel-tag, check the [[rel-faq|rel FAQ]] first for general rel attribute questions, then check the [[rel-tag-faq|rel-tag FAQ]], and then if you don't find answers, ask your question on the [http://microformats.org/discuss microformats-discuss] mailing list.

==Related pages==
{{rel-tag-related-pages}}

[[Category:Specifications]]
[[Category:rel-tag]]

hreview-aggregate

2011-06-01T14:13:04Z

LawrenceWoodman: /* examples in the wild */

<entry-title>hReview-aggregate 0.2</entry-title>
{{DraftSpecification}}

[[hreview-aggregate|hReview-aggregate]] is a format for embedding review information (of products, services, businesses, etc). Whereas [[hreview|hReview]] is intended for an individual review, hReview-aggregate is meant for summary information about a collection of user or critic reviews about an item. hReview-aggregate is one of several [[microformats]] open standards suitable for embedding in HTML, XHTML, Atom, RSS, and arbitrary XML.

== Microformats Draft Specification 2009-11-10 ==

; Editor: [[User:KaviGoel|Kavi Goel]], Google
; Authors/Contributers (alphabetical): [[User:Tantek|Tantek Çelik]]
: Othar Hansson, Google
: [[User:JayMyers|Jay Myers]], [http://www.bestbuy.com/ Best Buy, Co., Inc.]

== Introduction ==

Many websites publish reviews using a variety of organization schemes. hReview-aggregate and the similar microformat [[hreview|hReview]] were designed to enable sharing of review information.

hReview, created in 2006, is well suited to mark up reviews done by individuals on their own websites or for editor's reviews for a new product or service. However, in recent years, there has been an increasing number of sites who aggregate user reviews, either by accepting reviews submitted to their website or by collecting those user reviews from across the web. In these cases, it is often valuable to share not just the individual reviews shown on the webpage, but the consensus opinion derived from those individual reviews.

hReview-aggregate was created to address this need. hReview-aggregate is a standard that can be used to share the number of reviews, average rating, and consensus opinion for a particular product or service. It is meant to complement hReview and reuses hReview properties wherever appropriate. Research and discussion that fed into the design of hReview-aggregate can be found on the [[aggregate-review-brainstorming|aggregate review brainstorming]] wiki page.

{{rfc-2119-intro}}

=== Scope ===

Collections of reviews consistently share several common aspects. Where possible hReview-aggregate has been based on this common subset.

=== Out of scope ===

Portions of reviews that are specific to particular kinds of items have been omitted from hReview-aggregate.

== Format ==

=== Schema ===

The hReview-aggregate schema consists of the following:

* hReview-aggregate ('''<code>hreview-aggregate</code>''')
** '''<code>item</code>''' info. required. '''<code>fn</code>''' ('''<code>url</code>''' || '''<code>photo</code>''' ) | '''[[hcard|hCard]]''' (for person or business) | '''[[hcalendar|hCalendar]]''' (for event) | '''[[hproduct|hProduct]]''' (for product)
** '''<code>rating</code>'''. required. fixed point integer [1.0-5.0], with optional alternate '''<code>worst</code>''' (default:1.0) and/or '''<code>best</code>''' (default:5.0), also fixed point integers, and explicit '''<code>average</code>'''.
** '''<code>count</code>'''. optional. non-negative integer.
** '''<code>votes</code>'''. optional. non-negative integer. Note that while <code>count</code> and <code>votes</code> are both marked optional, at least one of the two fields must be specified.
** '''<code>summary</code>'''. optional. text.

=== Property details ===

Details of the hReview-aggregate properties:

'''item''':: This required property {{must}} have at a minimum the name of the entity being reviewed (using the subproperty "fn"), or alternatively have an encapsulated microformat (i.e. [[hcard|hCard]] for a business or person, [[hproduct|hProduct]] for a product, or [[hcalendar|hCalendar]] for an event). If an encapsulated microformat is not used, a URI ("url") for the item and a photo or depiction ("photo") {{may}} also be provided. Non-URL unique item IDs (e.g. ISBNs, UPCs) {{may}} be represented as a URN ("url") for the item. Encapsulated microformats must be set on the item itself (e.g. class="item vcard"). However, when using item info subproperties ("fn", "url", "photo"), they must be nested inside the item element.

'''rating''':: The rating is a fixed point integer (one decimal point of precision) from 1.0 to 5.0 inclusive indicating the average rating for the item across all reviews, higher indicating a better rating by default. Optionally a different integral "worst" value and/or "best" value may be specified to indicate a different range (e.g. 6 from 0-10).

'''count''':: This property is used to specify the total number of reviews for the product or service.

'''votes''':: This property is used to specify the total number of users who have rated the product or service, contributing to the average rating. For some sites, the number of votes is equal to the number of reviews, so <code>count</code> may be used and this property omitted.

'''summary''':: This optional property can be the title for the review collection or a very short summary of the consensus opinion from the collection.

The <code>item</code>, <code>rating</code>, and <code>summary</code> properties are reused from [[hreview|hReview]].

== Examples ==

=== Basic example ===

Here is an example showing aggregate review information for a restaurant:

<pre><nowiki>
<div>
<h3>
<span>Mediterranean Wraps</span>
</h3>
<span>Customers flock to this small restaurant for their
tasty falafel and shawerma wraps and welcoming staff.</span>
<span>4.5 out of 5 based on 17 reviews</span>
</div>
</nowiki></pre>

Adding hReview-aggregate markup to this is straightforward:

<pre><nowiki>
<div class="hreview-aggregate">
<h3 class="item">
<span class="fn">Mediterranean Wraps</span>
</h3>
<span class="summary">Customers flock to this small restaurant for their
tasty falafel and shawerma wraps and welcoming staff.</span>
<span><span class="rating">4.5</span> out of 5
based on <span class="count">17</span> reviews</span>
</div>
</nowiki></pre>

=== Embedded microformat, 10-point rating scale ===

Often, there is more information available on a page about the item being reviewed than the title. Here is another example of a restaurant review, but with address information present.

<pre><nowiki>
<div>
<div>
<h3>Mediterranean Wraps</h3>
<span>433 S California Ave</span>
<span>Palo Alto, CA
<span>(650) 321-8189</span>
</div>
<span>Customers flock to this small restaurant for their
tasty falafel and shawerma wraps and welcoming staff.</span>
<span>9.2 out of 10 based on 17 reviews</span>
</div>
</nowiki></pre>

And here it is with hReview-aggregate markup, along with an embedded [[hcard|hCard]] to describe the address and phone information for the restaurant:

<pre><nowiki>
<div class="hreview-aggregate">
<div class="item vcard">
<h3 class="fn">Mediterranean Wraps</h3>
<span class="adr">
<span class="street-address">433 S California Ave</span>
<span><span class="locality">Palo Alto</span>, <span class="region">CA</span></span>
<span class="tel">(650) 321-8189</span>
</span>
</div>
<span class="summary">Customers flock to this small restaurant for their
tasty falafel and shawerma wraps and welcoming staff.</span>
<span class="rating"><span class="average">9.2</span> out of <span class="best">10</span>
based on <span class="count">17</span> reviews</span>
</div>
</nowiki></pre>

Note that the <code>item</code> and <code>vcard</code> are put next to each other in the same class attribute in order to show that the item being reviewed is described by the embedded hCard.

=== Count vs votes ===

In the examples so far, the <code>count</code> property has been used but not <code>votes</code>. <code>votes</code> is useful when users have rated an item without writing full corresponding reviews. Their vote contributed toward the average rating but not towards the number of reviews available.

Consider this example:

<pre><nowiki>
<div>
<h3>
<span>Mediterranean Wraps</span>
</h3>
<span>Customers flock to this small restaurant for their
tasty falafel and shawerma wraps and welcoming staff.</span>
<span>4.5 out of 5 based on 24 ratings.</span>
<span>5 user reviews:</span>
...
</div>
</nowiki></pre>

Here the example is again, with both <code>count</code> and <code>votes</code> specified where appropriate.

<pre><nowiki>
<div class="hreview-aggregate">
<h3 class="item">
<span class="fn">Mediterranean Wraps</span>
</h3>
<span class="summary">Customers flock to this small restaurant for their
tasty falafel and shawerma wraps and welcoming staff.</span>
<span><span class="rating">4.5</span> out of 5
based on <span class="votes">24</span> ratings.</span>
<span><span class="count">5</span> user reviews:</span>
...
</div>
</nowiki></pre>

== examples in the wild ==
This section is '''informative'''.

The following sites have implemented [[hReview-aggregate]], and thus are a great place to start for anyone looking for examples "in the wild" to try parsing, indexing, organizing etc. If your site is marked up with hReview aggregate, feel free to add it to the '''top''' of this list. Once the list grows too big, we'll make a separate wiki page like [[hreview-aggregate-examples-in-wild]].

* [http://trustafriend.com Trust a Friend] Lists reviews of products and services submitted by users and external blogs. Example: [http://trustafriend.com/reviews/j.george-plastering-newent-gloucestershire/ J.George Plastering, Newent, Gloucestershire]
* CustomerLink Reviews has implemented hReview-aggregate for reviews of local businesses. Example: [http://reviews.customerlink.com/biz/auto-tech-sonora Review of Auto Tech & Tire]
* SuperStoreSearch.com is a shopping search engine and price comparison site and offers an interesting implementation of hReview-aggregate and hProduct, whereas typical e-commerce sites feature one store offer, this shopping search vertical site allows users to [http://www.superstoresearch.com/ compare prices], therefore you can see an example of the 'price' class being utilized with nested tags that also features the 'pricerange' class - which can be seen on individual pages such as this comparison listing for the [http://www.superstoresearch.com/shopping/categories/electronics/personal-audio/mp3-digital-media-players/apple-ipod-touch-8gb--24603784.html Apple iPod Touch 8GB]. The product information pages that have hReview-aggregate markup, also incorporate hProduct classes. hProduct has also been used on category menu pages such as this guide on [http://www.superstoresearch.com/shopping/categories/home-appliances/4253/washing-machines.html Washing Machines] - where multiple instances of hProduct can be seen on a single page. In total, over 10+ million products and pages have been updated with hProduct and hReview-aggregate markup.

* [http://www.thesuggestr.com theSUGGESTR.com] has implemented hReview-aggregate for it's business ratings and reviews.
* Google has implemented support for [http://www.google.com/support/webmasters/bin/answer.py?hl=en&answer=146645 hReview-aggregate] via [http://googlewebmastercentral.blogspot.com/2009/05/introducing-rich-snippets.html Rich Snippets].
* [http://local.stv.tv/glasgow/place/restaurant-japanese/10320725-wagamama/ STV Local] uses hreview-aggregate for business ratings, average prices and contact details with hcard
* [http://www.critiki.com Critiki] publishes ratings and reviews of Tiki bars, and uses hReview aggregate for average ratings on their pages, e.g. [http://www.critiki.com/cgi-bin/location.cgi?loc_id=162 overview of The Tonga Room]. (as [http://twitter.com/humuhumu/status/4165014155 tweeted by humuhumu] 2009-09-21)
* [http://free.naplesplus.us NAPLESPLUS] is an example of a website that has implemented hreview-aggregate via Google specs.
*[http://FriendsEAT.com FriendsEAT] is an example of a food website that has implemented hreview-aggregate for it's restaurant and recipe ratings/reviews, e.g. [http://friendseat.com/restaurants/New-York/Churrascaria-Plataforma Review of Churrascaria Plataforma]
* ...

== Related Pages ==

* [[hreview|hReview]] - microformat for marking up individual reviews
* [[aggregate-review-brainstorming|Aggregate review brainstorming]] - discussions leading to the creation of hReview-aggregate and ideas for improvement.
* [[aggregate-review-examples|Aggregate review examples]]

[[Category:Draft Specifications]]
[[Category:hReview-aggregate]]

User:LawrenceWoodman

2011-06-01T13:52:30Z

LawrenceWoodman: Add my blog

My Blog: [http://techtinkering.com techtinkering]