HTML and CSS Reference
In-Depth Information
Figure 6-1. Google Rich Snippets Testing Tool results
See Also
For additional data types that are recognized by search engines, along with sample code,
see
http://schema.org
.
To learn more about microdata, see HTML5 Doctor's Microdata
article (
http://html5doctor.com/microdata/
) and Mark Pilgrim's chapter from “Dive Into
HTML5” (see
http://diveintohtml5.info/extensibility.html
), which also details Google
Rich Snippets.
6.3 Adding Custom Data to Markup
Problem
You want to attach additional data to your content that is not displayed to the user.
Solution
Define your own
data-
attributes to name and store the information:
<h1>My Volkswagens</h1>
<ul>
<li
data-year="1996" data-color="white" data-engine="VR6"
>Cabrio</li>
<li
data-year="1993" data-color="purple" data-engine="VR6"
>Corrado</li>
<li
data-year="2008" data-color="red" data-engine="2.0T"
>Eos</li>
<li
data-year="2003" data-color="blue" data-engine="W8"
>Passat</li>
</ul>
