This work is licensed under the Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License. To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-sa/3.0/us/

Semantic HTML

Dr. Harry Chen

CMSC 491S/691S

April 23, 2008

Agenda

Yet Another Semantic Web PresentationEmbed semantic description in HTML

Microformats RDFa

Click to watch the video

Problem & Plausible Solutions

How should we publish semantic information on the Web? One HTML page One RDF document Mix RDF into the HTML page Extend HTML with new semantic tags

Microformats

Introduce semantics into Web pages by using XHTML tags with standard data format vocabularies hCard (People & Organization) hCalendar (Calendar & Events) XFN (Social Networks) rel-tag (tagging) …

Microformats basics

Use standard XHTML attributes to describe information. Mostly thru the “class” attribute Sometimes thru the “id”, “title”, “rel” or “rev” attr.

As the webots process the pages, they reads information from those attributes. For search indexing Grabbing contact & social network information

Describe yourself using Microformats

My Home Page

Find my name

Wrap my name in “fn”

“fn” == Full Name in hCard“url” == my URL CSS Class (not MF)

http://harry.hchen1.com/contact-me/biosketch

What’s next?

http://kitchen.technorati.com/contact/search

Another Example

http://hchen1.com/contact-me/biosketch/

I live in Columbia Maryland.

Add Geo location

Geo vocabulary comes from W3C Geohttp://www.w3.org/2003/01/geo/

Prepare mashup data

Optimus is a Microformats data transformer.

Transform Microformatted page to XML, JSON or JSON-P

Implementation One PHP file and Few XSTL Let’s see a demo…

http://microformatique.com/optimus/

RDFa

“a” == “awesome” -- src:http://www.youtube.com/watch?v=ldl0m-5zLz4

“a” == provide a set of “attributes” that can be used to carry metadata in an XML language

XHTML is XML

RDFa uses…

XML Attributes “about” “rel” “href” “property” “content” “datatype” “typeof”

Dublin Core example

(http://www.example.com/books/wikinomics, dc:title, “Wikinomics”)(http://www.example.com/books/wikinomics, dc:creator, “Don Tapscott”)(http://www.example.com/books/wikinomics, dc:date, 2006-10-01”)

RDF Triples

Source: http://en.wikipedia.org/wiki/RDFa

XHTML + RDFa

Let’s try something cool

Fuzzbot is a Firefox plugin for detecting RDFa and Microformats descriptions http://rdfa.digitalbazaar.com/fuzzbot/

Demo http://rdfa.digitalbazaar.com/fuzzbot/demo/foaf-

depictions.html

Additional Resources

Microformats http://microformats.org/

RDFa http://en.wikipedia.org/wiki/RDFa

Concluding Remarks

Microformats & RDFa are two different approaches to embed semantic information in XHTML pages.

Tools for processing and consuming these data formats are under development.

Question: Which technology will developers embrace in the future Web?