Embed Size (px)
Citation preview
1
MICROFORMATSDushan Hanuska
2
What I will feed you today
http://www.flickr.com/photos/cindyli/2836380076/
4
Microformats - clever use of HTML
Add Machine-readability to everyday web pages, while preserving human-readability
Allow tools to make more sense of your web pages, while not changing the visual appearance for visitors to your site
5
Multi-purpose Web 2.0 Glue
http://www.flickr.com/photos/callendercreates/1798710339/
6
Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More...
7
DEMO
Flickr NBN Co People Directory The Australian IT IBM Employee Directory
8
Browser Extensions
Firefox Chrome Flock Internet Explorer Safari Mosembro for Android
http://microformats.org/wiki/browsers
9
Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More...
10
Licenses
11
Licenses
<a href="http://creativecommons.org/..." >cc by 2.0</a>
12
Licenses – rel=“license”
<a href="http://creativecommons.org/..." rel="license">cc by 2.0</a>
http://microformats.org/wiki/rel-license
13
Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More...
14
Tags
<a href="http://technorati.com/tag/tech" >tech</a>
15
Tags
16
Tags – rel=“tag”
<a href="http://technorati.com/tag/tech" rel="tag">tech</a>
http://microformats.org/wiki/rel-tag
17
Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More...
18
People and Organisations
19
hCard 1.0
Dushan Hanuska NBN Co Limited T: +61299261900 F: +61299261901 E: [email protected] A: L11, 100 Arthur St, North Sydney NSW 2060
http://microformats.org/wiki/hcard
20
hCard 1.0
<span class=“vcard”> Dushan Hanuska NBN Co Limited T: +61299261900 F: +61299261901 E: [email protected] A: L11, 100 Arthur St, North Sydney NSW 2060</span>
21
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> NBN Co Limited T: +61299261900 F: +61299261901 E: [email protected] A: L11, 100 Arthur St, North Sydney NSW 2060</span>
22
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <span class=“org”>NBN Co Limited</span> T: +61299261900 F: +61299261901 E: [email protected] A: L11, 100 Arthur St, North Sydney NSW 2060</span>
23
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <a href=“http://www.nbnco.com.au” class=“url org”>NBN Co Limited</a> T: +61299261900 F: +61299261901 E: [email protected] A: L11, 100 Arthur St, North Sydney NSW 2060</span>
24
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <a href=“http://www.nbnco.com.au” class=“url org”>NBN Co Limited</a> T: <span class=“tel”>+61299261900</span> F: +61299261901 E: [email protected] A: L11, 100 Arthur St, North Sydney NSW 2060</span>
25
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <a href=“http://www.nbnco.com.au” class=“url org”>NBN Co Limited</a> T: <span class=“tel”>+61299261900</span> F: <span class=“tel”>+61299261901</span> E: [email protected] A: L11, 100 Arthur St, North Sydney NSW 2060</span>
26
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <a href=“http://www.nbnco.com.au” class=“url org”>NBN Co Limited</a> T: <span class=“tel”>+61299261900</span> F: <span class=“tel”>+61299261901</span> E: <span class=“email”> [email protected]</span> A: L11, 100 Arthur St, North Sydney NSW 2060</span>
27
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <a href=“http://www.nbnco.com.au” class=“url org”>NBN Co Limited</a> T: <span class=“tel”>+61299261900</span> F: <span class=“tel”>+61299261901</span> E: <span class=“email”>dushan...</span> A: <span class=“adr”> L11, 100 Arthur St, North Sydney NSW 2060 </span></span>
28
hCard 1.0
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <a href=“http://www.nbnco.com.au” class=“url org”>NBN Co Limited</a> T: <span class=“tel”>+61299261900</span> F: <span class=“tel”>+61299261901</span> E: <span class=“email”>dushan...</span> A: <span class=“adr”>...</span></span>
29
hCard 1.0 – telephone numbers
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <span class=“org”>NBN Co Limited</span> T: <span class=“tel”>+61299261900</span> F: <span class=“tel”>+61299261901</span> E: <span class=“email”>dushan...</span> A: <span class=“adr”>...</span></span>
30
hCard 1.0 – telephone numbers
...T: <span class=“tel”> <span class=“type”>work</span> <span class=“value”>+61299261900</span> </span>F: <span class=“tel”> <span class=“type”>fax</span> <span class=“value”>+61299261901</span> </span>...
31
hCard 1.0 – telephone numbers
...T: <span class=“tel”> <span class=“type mf-hide”>work</span> <span class=“value”>+61299261900</span> </span>F: <span class=“tel”> <span class=“type mf-hide”>fax</span> <span class=“value”>+61299261901</span> </span>...
32
hCard 1.0 - address
<span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> <a href=“http://www.nbnco.com.au” class=“url org”>NBN Co Limited</a> T: <span class=“tel”>+61299261900</span> F: <span class=“tel”>+61299261901</span> E: <span class=“email”>dushan...</span> A: <span class=“adr”> L11, 100 Arthur St, North Sydney NSW 2060 </span></span>
33
hCard 1.0 - address
...A: <span class=“adr”> L11, 100 Arthur St, North Sydney NSW 2060 </span>...
34
hCard 1.0 - address
...A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur
St</span>, North Sydney NSW 2060 </span>...
35
hCard 1.0 - address
...A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur
St</span>, <span class=“locality”>North Sydney</span> NSW 2060
</span>...
36
hCard 1.0 - address
...A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur
St</span>, <span class=“locality”>North Sydney</span> <span class=“region” title=“New South Wales”>NSW</span> 2060 Australia
</span>...
37
hCard 1.0 - address
...A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur
St</span>, <span class=“locality”>North Sydney</span> <span class=“region” title=“New South Wales”>NSW</span> <span class=“postal-code”>2060</span>
</span>...
38
hCard 1.0 - address
...A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur
St</span>, <span class=“locality”>North Sydney</span> <span class=“region” title=“New South Wales”>NSW</span> <span class=“postal-code”>2060</span>
<span class=“country-name”>Australia</span> </span>...
39
hCard 1.0 - address
...A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur
St</span>, <span class=“locality”>North Sydney</span> <span class=“region” title=“New South Wales”>NSW</span> <span class=“postal-code”>2060</span>
<span class=“mf-hide country-name”>Australia</span>
</span>...
40
hCard 1.0 - geo
...A: <span class=“adr”>...</span><span class=“geo”> <span class=“latitude”>-33.883121</span> <span class=“longitude”>151.130717</span></span>...
41
Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More...
42
hCalendar 1.0
<div> <a href="http://..."> Brown Bag</a> Consume Microformats: May 16 - 17, in the meeting room 12.2</div>
43
hCalendar 1.0
<div class="vevent"> <a href="http://..."> Brown Bag</a> Consume Microformats: May 16 - 17, in the meeting room 12.2</div>
44
hCalendar 1.0
<div class="vevent"> <a class="url" href="http://..."> Brown Bag</a> Consume Microformats: May 16 - 17, in the meeting room 12.2</div>
45
hCalendar 1.0
<div class="vevent"> <a class="url" href="http://..."> Brown Bag</a> <span class="summary"> Consume Microformats</span>: May 16 - 17, in the meeting room 12.2</div>
46
hCalendar 1.0
<div class="vevent"> <a class="url" href="http://..."> Brown Bag</a> <span class="summary"> Consume Microformats</span>: <abbr class="dtstart" title="2011-05-
16">May 16</abbr> - <abbr class="dtend" title="2011-05-17">17</abbr>, in the meeting room 12.2
</div>
47
hCalendar 1.0
<div class="vevent"> <a class="url" href="http://..."> Brown Bag</a> <span class="summary"> Consume Microformats</span>: <abbr class="dtstart" title="2011-05-
16">May 16</abbr> - <abbr class="dtend" title="2011-05-17">17</abbr>, in the <span class="location">meeting room 12.2</span>
</div>
48
hCalendar 1.0
Category Description dtend (ISO date), duration (ISO date) Location Geo (latitude, longitute) Attendee, Contact, Organizer
49
Dmitry Baranovskiy
http://http://www.flickr.com/photos/dmitry-baranovskiy/2401952999//
50
Further Reading - online
http://www.microformats.org http://microformats.org/wiki/hcard http://microformats.org/wiki/geo http://microformats.org/wiki/hcalendar http://microformats.org/wiki/rel-license http://microformats.org/wiki/rel-tag
51
John Allsop – Microformats: Empowering Your Markup for Web 2.0
52
Emily Lewis, Tantek ÇelikMicroformats Made Simplehttp://microformatsmadesimple.com/
