The document discusses Microformats, which allow adding machine-readable semantics to existing HTML/XHTML markup in order to make web pages more understandable to computers. It provides examples of how to mark up people cards, events, licenses, tags, and other types of information using Microformats. It also discusses browser extensions and tools that can interpret Microformat semantics.

1. Microformats Dushan Hanuska 1

2. What I will feed you today http://www.flickr.com/photos/cindyli/2836380076/ 2

3. http://www.flickr.com/photos/suda/363423118/ 3

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 4

5. Multi-purpose Web 2.0 Glue http://www.flickr.com/photos/callendercreates/1798710339/ 5

6. Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More... 6

7. DEMO Flickr NBN Co People Directory The Australian IT IBM Employee Directory 7

8. Browser Extensions Firefox Chrome Flock Internet Explorer Safari Mosembro for Android 8 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... 9

10. Licenses 10

11. Licenses <a href="http://creativecommons.org/..." >cc by 2.0</a> 11

12. Licenses – rel=“license” <a href="http://creativecommons.org/..." rel="license">cc by 2.0</a> http://microformats.org/wiki/rel-license 12

13. Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More... 13

14. Tags <a href="http://technorati.com/tag/tech" >tech</a> 14

15. Tags 15

16. Tags – rel=“tag” <a href="http://technorati.com/tag/tech" rel="tag">tech</a> http://microformats.org/wiki/rel-tag 16

17. Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More... 17

18. People and Organisations 18

19. hCard 1.0 Dushan Hanuska NBN Co Limited T: +61299261900 F: +61299261901 E: dushanhanuska@nbnco.com.au A: L11, 100 Arthur St, North Sydney NSW 2060 http://microformats.org/wiki/hcard 19

20. hCard 1.0 <span class=“vcard”> Dushan Hanuska NBN Co Limited T: +61299261900 F: +61299261901 E: dushanhanuska@nbnco.com.au A: L11, 100 Arthur St, North Sydney NSW 2060 </span> 20

21. hCard 1.0 <span class=“vcard”> <span class=“fn”>Dushan Hanuska</span> NBN Co Limited T: +61299261900 F: +61299261901 E: dushanhanuska@nbnco.com.au A: L11, 100 Arthur St, North Sydney NSW 2060 </span> 21

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: dushanhanuska@nbnco.com.au A: L11, 100 Arthur St, North Sydney NSW 2060 </span> 22

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: dushanhanuska@nbnco.com.au A: L11, 100 Arthur St, North Sydney NSW 2060 </span> 23

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: dushanhanuska@nbnco.com.au A: L11, 100 Arthur St, North Sydney NSW 2060 </span> 24

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: dushanhanuska@nbnco.com.au A: L11, 100 Arthur St, North Sydney NSW 2060 </span> 25

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”> dushanhanuska@nbnco.com.au</span> A: L11, 100 Arthur St, North Sydney NSW 2060 </span> 26

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> 27

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> 28

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> 29

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> ... 30

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> ... 31

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> 32

33. hCard 1.0 - address ... A: <span class=“adr”> L11, 100 Arthur St, North SydneyNSW2060 </span> ... 33

34. hCard 1.0 - address ... A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur St</span>, North SydneyNSW2060 </span> ... 34

35. hCard 1.0 - address ... A: <span class=“adr”> <span class=“street-address”>L11, 100 Arthur St</span>, <span class=“locality”>North Sydney</span> NSW2060 </span> ... 35

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> 2060Australia </span> ... 36

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> ... 37

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> ... 38

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> ... 39

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> ... 40

41. Microformat Specifications People and Organisations Calendars and Events Opinions, Ratings and Reviews Licenses Tags, Keywords, Categories Lists and Outlines More... 41

42. hCalendar 1.0 <div> <a href="http://..."> Brown Bag</a> Consume Microformats: May 16 - 17, in the meeting room 12.2 </div> 42

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> 43

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> 44

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> 45

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> 46

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> 47

48. hCalendar 1.0 Category Description dtend(ISO date), duration (ISO date) Location Geo (latitude, longitute) Attendee, Contact, Organizer 48

49. Dmitry Baranovskiy http://http://www.flickr.com/photos/dmitry-baranovskiy/2401952999// 49

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 50

51. John Allsop – Microformats: Empowering Your Markup for Web 2.0 51

52. Emily Lewis, TantekÇelikMicroformats Made Simplehttp://microformatsmadesimple.com/ 52