DTC356 Class Notes: November 19th 2013 (Semantic Markup)
-
Upload
nicholas-schiller -
Category
Education
-
view
109 -
download
1
description
Transcript of DTC356 Class Notes: November 19th 2013 (Semantic Markup)
Semantic MarkupTuesday, November 19th 2013
DTC 356 Fall 2013
Two PerspectivesDavid Weinberger
Sir Tim Berners-Lee
Weinberger’s Smart Leaves
The leaf knows what it is
Physical item w/ bar codes
Bits vs. Atoms
What is a bar code for bits?
Implicit vs. Explicit
“The web is a vast collection of completely uncontrolled heterogeneous documents.”
What does it mean to learn from context?
Freedom vs Control
The Semantic Web proposes not a standard set of relationships but a standard way for people to
describe whatever relationships are important to the topic.
!David Weinberger. Everything Is Miscellaneous (p.
192). Macmillan. Kindle Edition.
Ceci n’est pas un Ted Talk
http://www.ted.com/talks/tim_berners_lee_on_the_next_web.html
How does it work?Microdata markup w/ schema.org
Basic Format!
schema.org is a taxonomy
View the taxonomy at schema.org/Thing
HTML5 allows us to point elements on our pages to the schema.org taxonomy
Basic FormatGetting Started With Schema.Org
Use <div> and <span> to markup elements (div is for blocks of text, span for small inline items.)
itemscope: “This is an item.”
itemtype: “This is what type of item is is.”
itemprop: “This item has the following property.”
Example: (Before)<div>
<h1>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954)</span>
<span>Science fiction</span>
<a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>
Example: (itemscope)<div itemscope>
<h1>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954)</span>
<span>Science fiction</span>
<a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>
Example: (itemtype)<div itemscope itemtype="http://schema.org/Movie">
<h1>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954)</span>
<span>Science fiction</span>
<a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>
Example: (itemprop)<div itemscope itemtype="http://schema.org/Movie">
<h1 itemprop=“name”>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954)</span>
<span>Science fiction</span>
<a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>
Example: (itemprop)<div itemscope itemtype="http://schema.org/Movie">
<h1 itemprop=“name”>Avatar</h1>
<span>Director: <span itemprop=“director”>James Cameron</span> (born August 16, 1954)</span>
<span itemprop=“genre”>Science fiction</span>
<a href=“../movies/avatar-theatrical-trailer.html” itemprop=“trailer"> Trailer</a>
</div>
Example: (embeded)
Before:
<span>Director: <span itemprop=“director”>James Cameron</span> (born August 16, 1954)</span>
After embedding another itemscope:
<div itemprop="director" itemscope itemtype=“http://schema.org/Person"> Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954)</span> </div>
Example: (Before)<div>
<h1>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954)</span>
<span>Science fiction</span>
<a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>
Example: (After)<div itemscope itemtype ="http://schema.org/Movie">
<h1 itemprop="name">Avatar</h1>
<div itemprop="director" itemscope itemtype="http://schema.org/ Person">Director: <span itemprop="name">James Cameron</span> (born <span itemprop=“birthDate">August 16, 1954)</span> </div>
<span itemprop="genre">Science fiction</span>
<a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>
Image Credits
3 (David Weinberger) Some rights reserved by Joi.
3 (Sir Tim Berners-Lee) Some rights reserved by veni markovski
Rene Magritte’s The Treachery of Images is owned and displayed by LACMA