ISWC08 Tutorials — RDFa

RDFa - Bridging the Web of Documents and the Web of Data

Michael Hausenblas, JOANNEUM RESEARCH
Ivan Herman, W3C
Ben Adida, Creative Commons / Harvard University

Agenda

Web of Documents
Web of Data
RDFa Basics (Publishing & Consuming)
Advanced Issues

Goals of RDFa

Bringing the

"Web of Documents"

and the

"Web of Data" (Semantic Web)

closer

The Web of Documents View

metadata should be added to an (X)HTML page without too much hassle
the (X)HTML page should remain valid under some well defined constraints (DTD, Schema, etc.)
the additional data should be accessible, if necessary, in a DOM tree for further processing
"don't repeat yourself" (DRY) - the (meta)data should make use of the ("visible") XHTML content as much as possible
"mashup" of various data should be possible

The Web of Documents View

the additional data should possibly rely on externally defined vocabularies (simple or complex)
many different types of vocabularies should be usable in the same document
there should be an easy way to transform the data into an RDF repository to combine it with other data on the Web of Data

The Web of Documents View - Existing Solution (I)

(X)HTML has the <meta> and <link> elemets to add metadata to content
can only be used in the header (i.e., no way of DRY for the content)
only a limited number of terms for the attribute name

The Web of Documents View - Existing Solution (II)

microformats (re)use existing (X)HTML attributes to encode some data
through a suitable XSLT transformation the (X)HTML can be converted into RDF
a "partial" solution, only:
- a separate approval process has to define each vocabulary and a separate XSLT has to be developed again and again
- becomes complex if more than one vocabulary is to be used on one page
- there might be clashes with the goals of the XHTML attributes (for example the @abbr is used for accessibility purposes but also used by some microformats)

The Web of Data View

There is a huge amount of structured data out there in (X)HTML pages, and no good way to integrate them on the Web of Data
Mash up applications might be one of the most important applications, but the combination with the structured data is very complex

The Web of Data View - Existing Solution

RDF data can be linked from the (X)HTML header
The RDF data must be written in a separate serialization format (RDF/XML, Turtle, etc.), most of the XHTML authors are not familiar with
Violated the DRY principle

The Web of Data View - Additional Goal

It is not easy to document and describe RDF content (e.g., vocabulary definitions, ontologies, etc.)
The only way is to produce the vocabulary in one syntax (RDF/XML, Turtle, ontology syntaxes) and provide a separate description in, say, XHTML
Best would be better to be able to combine the two

What is RDFa?

From the Web of Documents' point-of-view: a set of new (X)HTML attributes to express metadata within (X)HTML
From the Web of Data point-of-view: a serialization format for RDF (such as RDF/XML, etc.), where the RDF triples are "embedded" into (X)HTML

The Chasm

A significant gap between what browsers see and what humans see

Bridging the Human and Data Webs [A Single DRY Format]

Change the visual, change the machine-readable

Change:

distributed under a 
<a href="http://creativecommons.org/licenses/by/3.0/">CC License</a>

To:

distributed under a 
<a href="http://creativecommons.org/licenses/by-nc/3.0/">CC License</a>

The Machine Readers should Follow

Superposition of Applications

One DRY document; Multiple, superposed applications

A Link with Flavor

distributed under a
<a href="http://creativecommons.org/licenses/by/3.0/">
    Creative Commons License
</a>

A Link with Flavor

distributed under a
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/">
    Creative Commons License
</a>

Text with Flavor

<h2>The Trouble with Bob</h2>
<h3>Alice</h3>

Text with Flavor

<h2 property="dc:title">The Trouble with Bob</h2>
<h3 property="dc:creator">Alice</h3>

why dc:title, why not just title?
which meaning of "title"? Article title, job title, real estate title?
license is a reserved HTML keyword, but title is not.
we must "import" this concept from somewhere.
the Dublin Core vocabulary: http://purl.org/dc/elements/1.1/
concepts including: title, creator, copyright, etc.

<div xmlns:dc="http://purl.org/dc/elements/1.1/">
    ....
</div>

Text with Flavor

<div xmlns:dc="http://purl.org/dc/elements/1.1/">
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
</div>

Text with Flavor and Datatype

<div xmlns:dc="http://purl.org/dc/elements/1.1/">
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
    <em>April 21st, 2008</em>
</div>

Text with Flavor and Datatype

<div xmlns:dc="http://purl.org/dc/elements/1.1/">
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
    <em property="dc:date">April 21st, 2008</em>
</div>

Text with Flavor and Datatype

<div xmlns:dc="http://purl.org/dc/elements/1.1/">
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
    <em property="dc:date" datatype="xsd:date"
        content="20080421">April 21st, 2008</em>
</div>

A Few Articles

<div ...>
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
</div>

...

<div ...>
    <h2 property="dc:title">Jo's Barbecue</h2>
    <h3 property="dc:creator">Eve</h3>
</div>

A Few Articles

<div about="/alice/posts/trouble_with_bob"...>
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
</div>

...

<div about="/alice/posts/jos_barbecue"...>
    <h2 property="dc:title">Jo's Barbecue</h2>
    <h3 property="dc:creator">Eve</h3>
</div>

Image within an Article

<div about="/alice/posts/trouble_with_bob"...>
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
</div>

Image within an Article

<div about="/alice/posts/trouble_with_bob"...>
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>

    <p>The trouble with Bob is that he takes
    much better photos than I do:</p>

    <div>
        <img src="/bob/photos/sunset.jpg" />
        <span>Beautiful Sunset</span>
        by <a href="/bob/">Bob</a>
    </div>
</div>

Image within an Article

<div about="/alice/posts/trouble_with_bob"...>
    <h2 property="dc:title">The Trouble with Bob</h2>
    <h3 property="dc:creator">Alice</h3>
    
    <p>The trouble with Bob is that he takes
    much better photos than I do:</p>
    
    <div about="/bob/photos/sunset.jpg">
        <img src="/bob/photos/sunset.jpg" />
        <span property="dc:title">Beautiful Sunset</span>
        by <a rel="dc:creator" href="/bob/">Bob</a>
    </div>
</div>

Image within an Article

The power of `about`

Comment Authors with Properties but no URI

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments">
    <p id="c_1">
        Yes, Bob is an evil-doer.
        <em>Cindy</em>
    </p>
    <p id="c_2">
        No way, Bob rocks.
        <em>Michelle</em>
    </p>
</div>

Comment Authors with Properties but no URI

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments">
    <p id="c_1">
        Yes, Bob is an evil-doer.
        <em typeof="foaf:Person">Cindy</em>
    </p>
    <p id="c_2">
        No way, Bob rocks.
        <em typeof="foaf:Person">Michelle</em>
    </p>
</div>

Comment Authors with Properties but no URI

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments">
    <p id="c_1">
        Yes, Bob is an evil-doer.
        <em typeof="foaf:Person" property="foaf:name">
            Cindy</em>
    </p>
    <p id="c_2">
        No way, Bob rocks.
        <em typeof="foaf:Person" property="foaf:name">
            Michelle</em>
    </p>
</div>

Comment Authors with Properties but no URI

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments">
    <p id="c_1" about="#c_1">
        Yes, Bob is an evil-doer.
        <em typeof="foaf:Person" property="foaf:name">
            Cindy</em>
    </p>
    <p id="c_2" about="#c_2">
        No way, Bob rocks.
        <em typeof="foaf:Person" property="foaf:name">
            Michelle</em>
    </p>
</div>

Comment Authors with Properties but no URI

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments">
    <p id="c_1" about="#c_1" rel="dc:creator">
        Yes, Bob is an evil-doer.
        <em typeof="foaf:Person" property="foaf:name">
            Cindy</em>
    </p>
    <p id="c_2" about="#c_2" rel="dc:creator">
        No way, Bob rocks.
        <em typeof="foaf:Person" property="foaf:name">
            Michelle</em>
    </p>
</div>

Comment Authors with Properties but no URI

Connecting the Comments

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments">
    <p id="c_1" about="#c_1" rel="dc:creator">
        Yes, Bob is an evil-doer.
        <em typeof="foaf:Person" property="foaf:name">
            Cindy</em>
    </p>
    <p id="c_2" about="#c_2" rel="dc:creator">
        No way, Bob rocks.
        <em typeof="foaf:Person" property="foaf:name">
            Michelle</em>
    </p>
</div>

Connecting the Comments

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments" rel="blog:comment">
    <p id="c_1" about="#c_1" rel="dc:creator">
        Yes, Bob is an evil-doer.
        <em typeof="foaf:Person" property="foaf:name">
            Cindy</em>
    </p>
    <p id="c_2" about="#c_2" rel="dc:creator">
        No way, Bob rocks.
        <em typeof="foaf:Person" property="foaf:name">
            Michelle</em>
    </p>
</div>

Connecting the Comments

<h2 property="dc:title">The Trouble with Bob</h2>
...
<div id="comments" rel="blog:comment">
    <p id="c_1" about="#c_1" rel="dc:creator">
        Yes, Bob is an evil-doer.
        <em typeof="foaf:Person" property="foaf:name">
            Cindy</em>
    </p>
    <p id="c_2" about="#c_2" rel="dc:creator">
        No way, Bob rocks.
        <em typeof="foaf:Person" property="foaf:name">
            Michelle</em>
    </p>
</div>

Connecting the Comments

A Second Complete Example: FOAF

<span>Ivan Herman</span>
Email: <a href="mailto:ivan@w3.org">ivan@w3.org</a>
(<span>5ac8032d5f6012aa1775ea2f63e1676bafd5e80b</span>)

Phone numbers:
phone: <a href="tel:+31-20-5924163">+31-20-5924163</a>
mobile: <a href="tel:+31-641044153">+31-641044153</a>
fax: +31-20-5924312
<a href="/pgpkey.html">GnuPGP key</a>

Misc:
I am often on
    freenode, (acc. name <span>IvanHerman</span>

...

A Second Complete Example: FOAF

<span property="foaf:name">Ivan Herman</span>
Email: <a href="mailto:ivan@w3.org">ivan@w3.org</a>
(<span>5ac8032d5f6012aa1775ea2f63e1676bafd5e80b</span>)

Phone numbers:
phone: <a href="tel:+31-20-5924163">+31-20-5924163</a>
mobile: <a href="tel:+31-641044153">+31-641044153</a>
fax: +31-20-5924312
<a href="/pgpkey.html">GnuPGP key</a>

Misc:
I am often on
    freenode, (acc. name <span>IvanHerman</span>

...

A Second Complete Example: FOAF

<span property="foaf:name">Ivan Herman</span>
Email: <a rel="foaf:mbox" href="mailto:ivan@w3.org">ivan@w3.org</a>
(<span>5ac8032d5f6012aa1775ea2f63e1676bafd5e80b</span>)

Phone numbers:
phone: <a href="tel:+31-20-5924163">+31-20-5924163</a>
mobile: <a href="tel:+31-641044153">+31-641044153</a>
fax: +31-20-5924312
<a href="/pgpkey.html">GnuPGP key</a>

Misc:
I am often on
    freenode, (acc. name <span>IvanHerman</span>

...

A Second Complete Example: FOAF

<span property="foaf:name">Ivan Herman</span>
Email: <a rel="foaf:mbox" href="mailto:ivan@w3.org">ivan@w3.org</a>
(<span property="foaf:mbox_sha1sum">5ac8032d5f6012aa1775ea2f63e1676bafd5e80b</span>)

Phone numbers:
phone: <a href="tel:+31-20-5924163">+31-20-5924163</a>
mobile: <a href="tel:+31-641044153">+31-641044153</a>
fax: +31-20-5924312
<a href="/pgpkey.html">GnuPGP key</a>

Misc:
I am often on
    freenode, (acc. name <span>IvanHerman</span>

...

A Second Complete Example: FOAF

<span property="foaf:name">Ivan Herman</span>
Email: <a rel="foaf:mbox" href="mailto:ivan@w3.org">ivan@w3.org</a>
(<span property="foaf:mbox_sha1sum">5ac8032d5f6012aa1775ea2f63e1676bafd5e80b</span>)

Phone numbers:
phone: <a rel="foaf:phone href="tel:+31-20-5924163">+31-20-5924163</a>
mobile: <a rel="foaf:phone href="tel:+31-641044153">+31-641044153</a>
fax: +31-20-5924312
<a href="/pgpkey.html">GnuPGP key</a>

Misc:
I am often on
    freenode, (acc. name <span>IvanHerman</span>

...

A Second Complete Example: FOAF

<span property="foaf:name">Ivan Herman</span>
Email: <a rel="foaf:mbox" href="mailto:ivan@w3.org">ivan@w3.org</a>
(<span property="foaf:mbox_sha1sum">5ac8032d5f6012aa1775ea2f63e1676bafd5e80b</span>)

Phone numbers:
phone: <a rel="foaf:phone href="tel:+31-20-5924163">+31-20-5924163</a>
mobile: <a rel="foaf:phone href="tel:+31-641044153">+31-641044153</a>
fax: +31-20-5924312
<a rel="wot:pubkeyAddress" href="/pgpkey.html">GnuPGP key</a>

Misc:
I am often on
    freenode, (acc. name <span>IvanHerman</span>

...

A Second Complete Example: FOAF

<span property="foaf:name">Ivan Herman</span>
Email: <a rel="foaf:mbox" href="mailto:ivan@w3.org">ivan@w3.org</a>
(<span property="foaf:mbox_sha1sum">5ac8032d5f6012aa1775ea2f63e1676bafd5e80b</span>)

Phone numbers:
phone: <a rel="foaf:phone href="tel:+31-20-5924163">+31-20-5924163</a>
mobile: <a rel="foaf:phone href="tel:+31-641044153">+31-641044153</a>
fax: +31-20-5924312
<a rel="wot:pubkeyAddress" href="/pgpkey.html">GnuPGP key</a>

Misc:
I am often on
<span rel="foaf:holdsAccount">
  <span about="http://www.freenode.net/irc_servers.shtml"
        typeof="foaf:OnlineAccount foaf:OnlineChatAccount">
    freenode, (acc. name <span property="foaf:accountName">IvanHerman</span>
  </span>
</span> 
...

A Second Complete Example: FOAF

Adding Fields: Digg

<div about="/articles/cheneys_glasses">
    <a rel="dc:source" href=".." property="dc:title">
      Enhancement of Reflection in Cheney's Glasses
    </a>
    <h3 property="dc:creator">Rick</h3>
    
    1957 diggs
    <a href="up?article_id=42">up</a>
    <a href="down?article_id=42">down</a>
    <a href="bury?article_id=42">bury</a>
</div>

Adding Fields: Digg

<div about="/articles/cheneys_glasses"
     xmlns:digg="http://digg.com/vocab/">
    <a rel="dc:source" href=".." property="dc:title">
      Enhancement of Reflection in Cheney's Glasses
    </a>
    <h3 property="dc:creator">Rick</h3>
    
    1957 diggs
    <a href="up?article_id=42">up</a>
    <a href="down?article_id=42">down</a>
    <a href="bury?article_id=42">bury</a>
</div>

Adding Fields: Digg

<div about="/articles/cheneys_glasses"
     xmlns:digg="http://digg.com/vocab/">
    <a rel="dc:source" href=".." property="dc:title">
      Enhancement of Reflection in Cheney's Glasses
    </a>
    <h3 property="dc:creator">Rick</h3>
    
    <span property="digg:score">1957</span> diggs
    <a href="up?article_id=42">up</a>
    <a href="down?article_id=42">down</a>
    <a href="bury?article_id=42">bury</a>
</div>

Adding Fields: Digg

<div about="/articles/cheneys_glasses"
     xmlns:digg="http://digg.com/vocab/">
    <a rel="dc:source" href=".." property="dc:title">
      Enhancement of Reflection in Cheney's Glasses
    </a>
    <h3 property="dc:creator">Rick</h3>
    
    <span property="digg:score">1957</span> diggs
    <a rel="digg:up" href="up?article_id=42">up</a>
    <a href="down?article_id=42">down</a>
    <a href="bury?article_id=42">bury</a>
</div>

Adding Fields: Digg

<div about="/articles/cheneys_glasses"
     xmlns:digg="http://digg.com/vocab/">
    <a rel="dc:source" href=".." property="dc:title">
      Enhancement of Reflection in Cheney's Glasses
    </a>
    <h3 property="dc:creator">Rick</h3>
    
    <span property="digg:score">1957</span> diggs
    <a rel="digg:up" href="up?article_id=42">up</a>
    <a rel="digg:down" href="down?article_id=42">down</a>
    <a rel="digg:bury" href="bury?article_id=42">bury</a>
</div>

Adding Fields: Flickr

<div about="/photos/timbl/12345">
    <img src="/photos/timbl/12345_medium.jpg" />
    <span property="dc:title">
      Me and Vint Cert, partying Beijing style
    </span>
    <h3 property="dc:creator">DanC</h3>
    
    Other Sizes:
    <a href="12345_small.jpg">small, 300x200</a>
    <a href="12345_big.jpg">big, 800x600</a>
    
    Taken with:
    <a href="...">Canon Rebel XTi</a>
</div>

Adding Fields: Flickr

<div about="/photos/timbl/12345" xmlns:photo="...">
    <img src="/photos/timbl/12345_medium.jpg" />
    <span property="dc:title">
      Me and Vint Cert, partying Beijing style
    </span>
    <h3 property="dc:creator">DanC</h3>
    
    Other Sizes:
    <a href="12345_small.jpg">small, 300x200</a>
    <a href="12345_big.jpg">big, 800x600</a>
    
    Taken with:
    <a rel="photo:camera" href="...">Canon Rebel XTi</a>
</div>

Adding Fields: Flickr

<div about="/photos/timbl/12345" xmlns:photo="...">
    <img src="/photos/timbl/12345_medium.jpg" />
    <span property="dc:title">
      Me and Vint Cert, partying Beijing style
    </span>
    <h3 property="dc:creator">DanC</h3>
    
    Other Sizes:
    <a rel="photo:alternate" href="12345_small.jpg">
      small, 300x200
    </a>

...

Adding Fields: Flickr

<div about="/photos/timbl/12345" xmlns:photo="...">
    <img src="/photos/timbl/12345_medium.jpg" />
    <span property="dc:title">
      Me and Vint Cert, partying Beijing style
    </span>
    <h3 property="dc:creator">DanC</h3>
    
    Other Sizes:
    <a rel="photo:alternate" href="12345_small.jpg">
      small, <span property="photo:dimensions">300x200</span>
    </a>

...

Adding Fields: Flickr

RDFa - Publishing

manual addition of RDF into a Web page is easy with RDFa (see all above)
many Web sites are are generated from databases using scripts or frameworks - adapting the templates to add some extra structural data in RDFa is just as easy
there are projects and people already doing this or plan to offer it in near future (Drupal, Wordpress, Shift, OpenLink Virtuoso, etc.).
find out more about RDFa tools at the community Wiki

RDFa - Consumption

A complete examples can be accessed in a standalone XHTML+RDFa document (from the RDFa Primer). This document will be used as a base in the following consumption examples.

RDFa - Consumption

@prefix dc: <http://purl.org/dc/elements/1.1/>.
@prefix foaf: <http://xmlns.com/foaf/0.1/>.
@prefix cc: <http://creativecommons.org/ns#>.

<http://example.com/alice>
    cc:license <http://creativecommons.org/licenses/by/3.0/>;

<http://example.com/posts/trouble_with_bob> dc:creator "Alice";
                                            dc:title "The trouble with Bob".
   
<http://example.com/alice#me> a foaf:Person;
    foaf:knows
            [ a foaf:Person;
            	foaf:homepage <http://example.com/manu>;
            	foaf:name "Manu" ],
            [ a foaf:Person;
            	foaf:homepage <http://example.com/bob>;
            	foaf:name "Bob" ],
            [ a foaf:Person;
            	foaf:homepage <http://example.com/eve>;
            	foaf:name "Eve" ];
    foaf:mbox <mailto:alice@example.com>;
    foaf:name "Alice Birpemswick";
    foaf:phone <tel:+1-617-555-7332> .

</2006/07/SWD/RDFa/primer/sunset.jpg> dc:creator "Bob";
                                      dc:title "Beautiful Sunset" .

<http://example.com/posts/jos_barbecue>
	dc:creator "Eve"; 
	dc:title "Jo's Barbecue" .

RDFa - Consumption (SPARQL)

Who is the creator of the post with the title "The trouble with Bob"? Answer ...

PREFIX dc: <http://purl.org/dc/elements/1.1/>

SELECT ?creator_of_post
FROM <http://www.w3.org/2007/08/pyRdfa/extract?uri=http://www.w3.org/2006/07/SWD/RDFa/primer/alice-example.html>
WHERE { 
 ?post dc:title ?post_title ;
       dc:creator ?creator_of_post .
 FILTER regex(?post_title, "The trouble with Bob", "i")
}

RDFa - Consumption (SPARQL)

Whom the heck knows Alice? Answer ...

PREFIX rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#>
PREFIX foaf: <http://xmlns.com/foaf/0.1/>

SELECT ?whom_name ?whom_homepage
FROM <http://www.w3.org/2007/08/pyRdfa/extract?uri=http://www.w3.org/2006/07/SWD/RDFa/primer/alice-example.html>
WHERE { 
 ?alice rdf:type foaf:Person ; 
        foaf:mbox <mailto:alice@example.com> ;
        foaf:knows ?whom.
 ?whom rdf:type foaf:Person ; 
       foaf:name ?whom_name ;  
       foaf:homepage ?whom_homepage .  
}

Applications I

Yahoo! SearchMonkey - example: Creative Commons application

Applications II

Bitmunk, expressing music, video and cultural semantics (see also Bitmunk Overview)

Applications - Outlook

Firefox and Fuzzbot (see also Fuzzbot RDFa audio vocabulary demo, Fuzzbot RDFa video vocabulary demo)
Mozilla Labs' Aurora
Joost
Flickr
Digg

Advanced Issues

Vocabulary Definition
Deployment
Dynamic Content
Performance & Scalability
Other Target Languages

Advanced Issues - Deployment

How to config your Web server ...

in the real world, RDFa and other representations (RDF/XML, etc.) can happily exist together
an overview of how to setup RDFa along with other formats is available

Advanced Issues - Vocabulary Definition

Define self-descriptive RDF-based vocabularies ...

Advanced Issues - Dynamic Content

Parsing of a DOM that is updated via Javascript

client-side (easy)
server-side processing (workaround needed)

Advanced Issues - Dynamic Content

Advanced Issues - Performance & Scalability

riese is the linked data version of the Eurostat data, deployed in XHTML+RDFa.

Advanced Issues - Performance & Scalability

Issue: find tradeoff between embedding and referencing metadata (granularity issue).

Advanced Issues - Other Target Languages

RDFa for other host languages

Yahoo! DataRSS
RDFa in HTML4
Metadata in SVG tiny

Status of RDFa

early work in the SWBP & XHTML Working Groups
current work in SWD & XHTML2 Working Groups
a W3C Recommendation as of 14 Oct 2008
Companies doing RDFa: Digg, Creative Commons, Yahoo!...
Tons of Implementations: ARC 2 (PHP), Operator (JavaScript), librdfa/Fuzzbot (C / Firefox), Semantic Radar (Firefox), RDFa Distiller (Python), RDFa Bookmarklets (JavaScript), XSTL, RDFa on Rails (Ruby/Rails), Cognition (Perl), ...
http://rdfa.info

ISWC08 Tutorials — RDFa

RDFa - Bridging the Web of Documents and the Web of Data

Agenda

Goals of RDFa

The Web of Documents View

The Web of Documents View

The Web of Documents View - Existing Solution (I)

The Web of Documents View - Existing Solution (II)

The Web of Data View

The Web of Data View - Existing Solution

The Web of Data View - Additional Goal

What is RDFa?

The Chasm

A significant gap between what browsers see and what humans see

Bridging the Human and Data Webs [A Single DRY Format]

Change the visual, change the machine-readable

The Machine Readers should Follow

Superposition of Applications

One DRY document; Multiple, superposed applications

A Link with Flavor

A Link with Flavor

Text with Flavor

Text with Flavor

Text with Flavor

Text with Flavor and Datatype

Text with Flavor and Datatype

Text with Flavor and Datatype

A Few Articles

A Few Articles

A Few Articles

Image within an Article

Image within an Article

Image within an Article

Image within an Article

The power of about

Comment Authors with Properties but no URI

Comment Authors with Properties but no URI

Comment Authors with Properties but no URI

Comment Authors with Properties but no URI

Comment Authors with Properties but no URI

Comment Authors with Properties but no URI

Comment Authors with Properties but no URI

Connecting the Comments

Connecting the Comments

Connecting the Comments

Connecting the Comments

A Second Complete Example: FOAF

A Second Complete Example: FOAF

A Second Complete Example: FOAF

A Second Complete Example: FOAF

A Second Complete Example: FOAF

A Second Complete Example: FOAF

A Second Complete Example: FOAF

A Second Complete Example: FOAF

Adding Fields: Digg

Adding Fields: Digg

Adding Fields: Digg

Adding Fields: Digg

Adding Fields: Digg

Adding Fields: Digg

Adding Fields: Flickr

Adding Fields: Flickr

Adding Fields: Flickr

Adding Fields: Flickr

Adding Fields: Flickr

RDFa - Publishing

RDFa - Consumption

RDFa - Consumption

RDFa - Consumption (SPARQL)

RDFa - Consumption (SPARQL)

Applications I

Applications II

Applications - Outlook

Advanced Issues

Advanced Issues - Deployment

Advanced Issues - Vocabulary Definition

Advanced Issues - Dynamic Content

Advanced Issues - Dynamic Content

Advanced Issues - Performance & Scalability

Advanced Issues - Performance & Scalability

The power of `about`