Microformats a Web of Data

100
Microformats Web of Data [email protected] http://suda.co.uk/publications/Web2Expo/

description

Microformats allow you to extend the limited semantics of HTML, thus allowing for a richer web of data. By embedding microformats into HTML it is possible to use the semantic meaning to extract unambiguous data from the web that can then be used in other applications. Microformats focus on how people are already publishing their data online. This session focuses on the more technical aspects of microformats, how they interact with other Semantic Web technologies such as GRDDL and SPARQL, along with a look at browser plugins to detect microformats and browser integration.

Transcript of Microformats a Web of Data

Page 1: Microformats a Web of Data

MicroformatsWeb of Data

[email protected]://suda.co.uk/publications/Web2Expo/

Page 2: Microformats a Web of Data

Microformats: The Nanotechnology of the Semantic Web

Jeremy KeithWednesday, 7th November9:00am

Microformats: The Nanotechnology of the Semantic Web

Jeremy KeithWednesday, 7th November9:00am

Page 3: Microformats a Web of Data
Page 4: Microformats a Web of Data

What are microformats

Page 5: Microformats a Web of Data

What is a web of data?

Page 6: Microformats a Web of Data

Evolution of the Browser

http://blog.mozilla.com/faaborg/2007/04/19/web-2.0-expo-presentation/

Page 7: Microformats a Web of Data

1993: Book1993: Book

Page 8: Microformats a Web of Data

2005: Radio2005: Radio

Page 9: Microformats a Web of Data

2008: Switchboard2008: Switchboard

Page 10: Microformats a Web of Data

Operator & FireFox3

Page 11: Microformats a Web of Data
Page 12: Microformats a Web of Data
Page 13: Microformats a Web of Data
Page 14: Microformats a Web of Data
Page 15: Microformats a Web of Data

hCard

Page 16: Microformats a Web of Data

Web 2.0 ExpoMesse Berlin GmbH

Page 17: Microformats a Web of Data

<div class=“vcard”>Messe Berlin GmbHMessedamm 2214055 Berlin, Germany</div>

Page 18: Microformats a Web of Data

<div class=“vcard”><div class=“fn org”>Messe Berlin GmbH</div>Messedamm 2214055 Berlin, Germany</div>

Page 19: Microformats a Web of Data

<div class=“vcard”><div class=“fn org”>Messe Berlin GmbH</div><div class=“adr”>Messedamm 2214055 Berlin, Germany</div></div>

Page 20: Microformats a Web of Data

<div class=“vcard”><div class=“fn org”>Messe Berlin GmbH</div><div class=“adr”><div class=“street-address”>Messedamm 22</div><span class=“postal-code”>14055</span> <span class=“locality”>Berlin</span> <span class=“country-name”>Germany</span></div></div>

Page 21: Microformats a Web of Data

<div class=“vcard”><a href=“http://www1.messe-berlin.de/” class=“url fn org”>Messe Berlin GmbH</a><div class=“adr”> <div class=“street-address”> Messedamm 22</div> <span class=“postal-code”>14055</span> <span class=“locality”>Berlin</span> <span class=“country-name”>Germany</span></div></div>

Page 22: Microformats a Web of Data

<div class=“vcard”><abbr title=“52.50475;13.279375” class=“geo”><a href=“http://www1.messe-berlin.de/”class=“url fn org”>Messe Berlin GmbH</a></abbr><div class=“adr”> <div class=“street-address”> Messedamm 22</div> <span class=“postal-code”>14055</span> <span class=“locality”>Berlin</span> <span class=“country-name”>Germany</span></div></div>

Page 23: Microformats a Web of Data
Page 24: Microformats a Web of Data

hCalendar

Page 25: Microformats a Web of Data

Web2.0 Expothis session

Page 26: Microformats a Web of Data

<div class=“vevent”>Microformats: Web of DataNovember 6th, 9:00-9:50New York 3</div>

Page 27: Microformats a Web of Data

<div class=“vevent”><span class=“summary”>Microformats: Web of Data</span>November 6th, 9:00-9:50New York 3</div>

Page 28: Microformats a Web of Data

<div class=“vevent”><a href=“http://berlin.web2expo.com/conference/” class=“url summary”>Microformats: Web of Data</a>November 6th, 9:00-9:50New York 3</div>

Page 29: Microformats a Web of Data

<div class=“vevent”><a href=“http://berlin.web2expo.com/conference/” class=“url summary”>Microformats: Web of Data</a>November 6th, 9:00-9:50<span class=“location”>New York 3</span></div>

Page 30: Microformats a Web of Data

<div class=“vevent”><a href=“http://berlin.web2expo.com/conference/” class=“url summary”>Microformats: Web of Data</a><abbr class=“dtstart” title=“2007-11-06T08:00:00Z”>November 6th, 9:00</abbr>-<abbr class=“dtend” title=“2007-11-06T08:50:00Z”>9:50</abbr><span class=“location”>New York 3</span></div>

Page 31: Microformats a Web of Data
Page 32: Microformats a Web of Data

Geo

Page 33: Microformats a Web of Data

<abbr title=“52.50475;13.279375” class=“geo”>Messe Berlin GmbH</abbr>

Page 34: Microformats a Web of Data
Page 35: Microformats a Web of Data
Page 36: Microformats a Web of Data

UNIX Pipes

Page 37: Microformats a Web of Data

for the Web

Page 38: Microformats a Web of Data

HTML | WebService

Page 39: Microformats a Web of Data
Page 40: Microformats a Web of Data
Page 41: Microformats a Web of Data
Page 42: Microformats a Web of Data
Page 43: Microformats a Web of Data
Page 44: Microformats a Web of Data
Page 45: Microformats a Web of Data

HTML | WebService | app

Page 46: Microformats a Web of Data
Page 47: Microformats a Web of Data
Page 48: Microformats a Web of Data

http://suda.co.uk/projects/X2V/get-vcal.php?uri=http://upcoming.yahoo.com/event/183827/

Page 49: Microformats a Web of Data
Page 50: Microformats a Web of Data

HTML | Tidy | XSLT | Maps

Page 51: Microformats a Web of Data

HTML

Page 52: Microformats a Web of Data
Page 53: Microformats a Web of Data

Tidy

Page 54: Microformats a Web of Data
Page 55: Microformats a Web of Data

XSLT

Page 56: Microformats a Web of Data
Page 57: Microformats a Web of Data

Maps

Page 58: Microformats a Web of Data
Page 59: Microformats a Web of Data

http://maps.google.com/maps? q=http:%2F%2Fsuda.co.uk%2Fprojects%2Fmicroformats%2Fgeo%2Fget-geo.php%3Furi%3Dhttp%253A%252F%252Fcgi.w3.org%252Fcgi-bin%252Ftidy%253FdocAddr%253Dhttp%25253A%25252F%25252Fsudabot.com%25252Fweb2expo%26type%3Dkml

Page 60: Microformats a Web of Data

Four services, loosely coupled & piped together

Page 61: Microformats a Web of Data

But wait....

Page 62: Microformats a Web of Data

there’s more!

Page 63: Microformats a Web of Data

HTML | Translation | Tidy | XSLT | Maps

Page 64: Microformats a Web of Data
Page 65: Microformats a Web of Data
Page 66: Microformats a Web of Data
Page 67: Microformats a Web of Data
Page 68: Microformats a Web of Data
Page 69: Microformats a Web of Data

http://maps.google.com/maps? q=http:%2F%2Fsuda.co.uk%2Fprojects%2Fmicroformats%2Fgeo%2Fget-geo.php%3Furi%3Dhttp%253A%252F%252Fcgi.w3.org%252Fcgi-bin%252Ftidy%253FdocAddr%253Dhttp%25253A%25252F%25252Fbabelfish.altavista.com%25252Fbabelfish%25252Ftrurl_pagecontent%25253Flp%25253Den_de%252526url%25253Dhttp%2525253A%2525252F%2525252Fsuda.co.uk%2525252FWeb2Expo%2525252F%26type%3Dkml

Page 70: Microformats a Web of Data

http://icanhaz.com/berlin-web2expo-maphttp://tinyurl.com/2xck2d

Page 71: Microformats a Web of Data

http://qrcode.kaywa.com/img.php?s=12&d=http%3A%2F%2Ficanhaz.

com%2Fberlin-web2expo-map

Page 72: Microformats a Web of Data

Data Importing

Page 73: Microformats a Web of Data
Page 74: Microformats a Web of Data
Page 75: Microformats a Web of Data
Page 76: Microformats a Web of Data
Page 77: Microformats a Web of Data
Page 78: Microformats a Web of Data
Page 79: Microformats a Web of Data

Data Sources

Page 80: Microformats a Web of Data
Page 81: Microformats a Web of Data
Page 82: Microformats a Web of Data
Page 83: Microformats a Web of Data
Page 84: Microformats a Web of Data
Page 85: Microformats a Web of Data

Libraries PHP: http://allinthehead.com/hkit XSLT: http://hg.microformats.org Python: http://www.plaxo.com/info/opensocialgraph Ruby: http://code.google.com/p/identity-matcher/ XSL & JS: http://code.google.com/p/mf-optimus/ Textpattern: http://textpattern.org/plugins/525/pnh_mf http://www.webstandards.org/action/dwtf/microformats/ Django: http://code.google.com/p/django-psn/

http://microformats.org/wiki/implementations

Page 86: Microformats a Web of Data

screen-shots here

Page 87: Microformats a Web of Data

Microformats + GRDDL = RDF

Page 88: Microformats a Web of Data

With important applications such as

connecting microformats to the

Semantic Web, GRDDL is a mechanism to

extract RDF statements from suitable

XHTML and XML content using programs

such as XSLT transformations. GRDDL

allows powerful mash-ups at very low cost.

Page 89: Microformats a Web of Data
Page 90: Microformats a Web of Data
Page 91: Microformats a Web of Data
Page 92: Microformats a Web of Data
Page 93: Microformats a Web of Data
Page 94: Microformats a Web of Data
Page 95: Microformats a Web of Data
Page 96: Microformats a Web of Data
Page 97: Microformats a Web of Data

Resources http://suda.co.uk/publications/Web2Expo/ http://suda.co.uk/projects/microformats/cheatsheet/ mailto:[email protected] http://microformats.org/ http://del.icio.us/tags/microformats/ http://www.pingerati.net/ http://kitchen.technorati.com/search/ http://hg.microformats.org http://www.oreilly.com/catalog/microformats/ https://addons.mozilla.org/en-US/firefox/addon/4106

Page 98: Microformats a Web of Data
Page 99: Microformats a Web of Data

http://microformatique.com/book/

IN THIS BOOK YOU’LL LEARN

How to take best advantage of the built-in semantics of XHTMLand HTML

How to extend the semantics of HTML using microformats and open up a world of new possibilities with web applications

Every aspect of all the common microformats currently in use

How microformats help your websites and applications easily integrate with web applications like Google Maps, as well as desktop applications like iCal, Outlook, and Entourage

What innovative publishers and services, big and small, are doing right now with microformats

MIC

RO

FORM

ATS

this print for reference only—size & color not accurate spine = 0.000" 000 page count

Allsopp

US $39.99Mac/PC compatible

www.friendsofed.comhttp://microformatique.com/

������������������������������������������������

� ������ ������

�����

SHELVING CATEGORY1. WEB DEVELOPMENT

JOHN ALLSOPPForeword by Tantek Çelik

Use rich semantics in your markup to make it machine-readable as well as human-readable

Make your websites “mashup-ready” for a new generation of web applications

Understand this fast-growing technology through this book’s real-world examples, case studies, tools, and much more

MMicroformats burst onto the scene a couple of years ago and are fast becoming an essential tool for all professional web designers and developers. Imagine being able to integrate all of your web-based contact details, tagged articles, and geographical information seamlessly in web and desktop applications, without having to add anything extra to your websites except a little specialized HTML markup.

Microformats provide a more formalized technology for adding commonly used semantics (such as contact details, location, and reviews) to today’s Web. Unlike XML or the Semantic Web, microformats use ubiquitous technologies like HTML and XHTML, existing developer skills, and current web tools, and, perhaps most important, they work in all of today’s web browsers.

This book is a comprehensive guide to microformats. It explores why, in Bill Gates’s words, “We need microformats”; how microformats work; and the kinds of problems microformats help solve. The book covers every current microformat, with complete details of the syntax, semantics, and uses of each, along with real-world examples and a comprehensive survey of the tools available for working with them. The book also features case studies detailing how major web content publishers such as Yahoo put microformats to work in their web applications.

Written by one of the Web’s best-known educators, John Allsopp,Microformats: Empowering Your Markup for Web 2.0 will help you painlessly get up to speed with this exciting technology. Empowering Your Markup for Web 2.0

Also Available

Page 100: Microformats a Web of Data

(EN) http://www.oreilly.com/catalog/microformats/(D) http://www.oreilly.de/catalog/pdf_microformatsger/(FR) http://www.oreilly.fr/catalogue/2354020031