Systems Librarian, Laurentian University
<!DOCTYPE html>
<h1>House of Cards</h1>
<p>A political drama produced by Kevin Spacey
and released in 2013 directly to Netflix, starring:</p>
<ul>
<li>Kevin Spacey</li>
<li>Robin Wright</li>
<li>Kate Mara</li>
<li>...</li>
</ul>
The above code renders in normal browsers roughly as:
House of Cards
A political drama produced by Kevin Spacey and released in 2013 directly to Netflix, starring:
For example:
<!DOCTYPE html>
Kevin Spacey
In this case, pointing off to some other web page, presumably about Kevin Spacey.
<meta>
tags were quickly gamed: see "spider food"If you love OO, and you love HTML, you're going to love structured data!
* Not me. Very much not me.
Delineate structured data in HTML using attributes.
vocab
: the vocabulary that defines the referenced types and their propertiestypeof
: the type of the thing being describedproperty
: the property of the described thingresource
: an identifier for a given thing on the pageprefix
: if you have to mix multiple vocabularies, you canThe typeof
property creates a new scope, which is (normally) limited to the HTML element on which it is defined, and children of that element.
<!DOCTYPE html>
<div typeof="Example">The scope starts here
<p>and continues
<span>through all of the nested
<em>child</em>
</span>
<span>elements</span>
</p>
</div>
<!DOCTYPE html>
<h1>House of Cards</h1>
<p>A political drama produced by Kevin Spacey
and released in 2013 directly to Netflix, starring:</p>
<ul>
<li>Kevin Spacey</li>
<li>Robin Wright</li>
<li>Kate Mara</li>
<li>...</li>
</ul>
<!DOCTYPE html>
<div vocab="http://schema.org/" typeof="TVSeries">
<h1 property="name">House of Cards</h1>
<p>A political drama produced by
<span property="producer">Kevin Spacey</span> and released in
<span property="copyrightYear">2013</span> directly to Netflix,
starring:</p>
<ul>
<li property="actor">Kevin Spacey</li>
<li property="actor">Robin Wright</li>
<li property="actor">Kate Mara</li>
<li>...</li>
</ul>
</div>
A TVSeries
and its attributes
<!DOCTYPE html>
<div vocab="http://schema.org/" typeof="TVSeries">
<h1 property="name">House of Cards</h1>
<p>A political drama produced by
<span property="producer" typeof="Person">
<span property="name">Kevin Spacey</span>
</span> and released in
<span property="copyrightYear">2013</span>
directly to Netflix, starring:</p>
<ul>
<li property="actor" typeof="Person">
<span property="name">Kevin Spacey</span>
</li>
<li property="actor" typeof="Person">
<span property="name">Robin Wright</span>
</li>
</ul>
</div>
A Person
can have attributes other than just name
<!DOCTYPE html>
<div vocab="http://schema.org/" typeof="TVSeries"
resource="#house_of_cards">
<h1 property="name">House of Cards</h1>
<p>A political drama produced by
<span property="producer" typeof="Person" resource="#kspacey">
<span property="name">Kevin Spacey</span>
</span> and released in
<span property="copyrightYear">2013</span>
directly to Netflix, starring:</p>
<ul>
<li property="actor" resource="#kspacey">Kevin Spacey</li>
<li property="actor" typeof="Person">
<span property="name">Robin Wright</span>
</li>
</ul>
</div>
Avoiding redundant redundancies!
<!DOCTYPE html>
<div vocab="http://schema.org/" prefix="foaf: http://xmlns.com/foaf/0.1/"
typeof="TVSeries" resource="#house_of_cards">
<h1 property="name">House of Cards</h1>
<p>A political drama produced by
<span property="producer" typeof="Person" resource="#kspacey">
<span property="name foaf:account">
<a href="https://plus.google.com/+KevinSpacey"
typeof="foaf:OnlineAccount">Kevin Spacey</a>
</span>
</span> and released in
<span property="copyrightYear">2013</span>
directly to Netflix, starring:</p>
<ul>
<li property="actor" resource="#kspacey">Kevin Spacey</li>
<li property="actor" typeof="Person">
<span property="name">Robin Wright</span>
</li>
</ul>
</div>
Because the world is described by more than one ontology.
Image generated by http://rdfa.info/play
* I am not an SEO consultant and this does not constitute SEO advice