HTML and CSS Reference
In-Depth Information
Solution
Use the itemscope and itemprop attributes, along with descriptive property names, to
label your content:
<p itemscope >
<span itemprop="inventor" >Tim Berners-Lee</span> created the
<span itemprop="invention" >World Wide Web</span>.
</p>
Discussion
The itemscope attribute is used to identify the scope of the microdata item—an item
being a set of name/value pairs. The itemprop attribute values define the property names
and their associated values—in this case, the contents of the span tags. Thus, this
example yields the following name/value pairs:
• Inventor: Tim Berners-Lee
• Invention: World Wide Web
This is a very basic example. In the next recipe, we'll look at an example that implements
a standardized vocabulary.
See Also
The itemprop attribute in the HTML5 specification at http://www.w3.org/TR/html5/
microdata.html#names:-the-itemprop-attribute .
6.2 Using Microdata and Schema.org
Problem
You want to convey additional meaning about your content—for example, that the
content identifies a person—so that popular search engines can extrapolate this data.
Solution
In addition to using the itemscope and itemprop attributes, specify an itemtype and
apply the appropriate property names from the Schema.org vocabulary:
<section itemscope itemtype="http://schema.org/Person" >
<h1 itemprop="name">Tim Berners-Lee</h1>
<img itemprop="image"
src="http://www.w3.org/Press/Stock/Berners-Lee/2001-europaeum-eighth.jpg">
<p>
<span itemprop="jobTitle">Director</span>,
<span itemprop="affiliation" itemscope
itemtype="http://schema.org/Organization" itemprop="name">World Wide
Web Consortium</span>
</p>
 
Search WWH ::




Custom Search