Practical Microformats - Voices That Matter

8,041 views
6,894 views

Published on

Talk for Voices That Matter - Web Design conference covering the basics of microformats, as well as examples and exercises to help publish microformats (XFN, hCard and hCalendar). Also includes numerous demonstrations and microformats resources, including validation, authoring and parsing tools.

Published in: Technology
1 Comment
25 Likes
Statistics
Notes
No Downloads
Views
Total views
8,041
On SlideShare
0
From Embeds
0
Number of Embeds
1,103
Actions
Shares
0
Downloads
0
Comments
1
Likes
25
Embeds 0
No embeds

No notes for slide





























































































  • Practical Microformats - Voices That Matter

    1. Practical Microformats Emily Lewis Voices That Matter June 28, 2010 Some rights reserved.
    2. • Freelance web designer • Lover of web standards, semantic markup and CSS, accessibility, usability and microformats • Writer of web design/development topics at A Blog Not Limited, ScriptJunkie and MIX Online • Author of Microformats Made Simple Practical Microformats Voices That Matter
    3. Today, you’ll learn • What are microformats • Benefits of microformats • How to enrich your content with some common microformats • Where you can see microformats in action • Lots of resources to help you publish microformats Practical Microformats Voices That Matter
    4. What are microformats? Microformats: Web Semantics & More Practical Microformats Voices That Matter
    5. What are microformats? Microformats: Web Semantics & More Practical Microformats Voices That Matter
    6. Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards. Microformats: Web Semantics & More Practical Microformats Voices That Matter
    7. Microformats enable the publishing and sharing of higher fidelity information on the web. Microformats: Web Semantics & More Practical Microformats Voices That Matter
    8. Building blocks that enable users to own, control, move and share their data on the web. Microformats: Web Semantics & More Practical Microformats Voices That Matter
    9. Smart content Building blocks that enable users to own, control, move and share their data on the web. Microformats: Web Semantics & More Practical Microformats Voices That Matter
    10. Smart content Building blocks that enable users to own, control, move and share Markup, with their data on the web. more meaning Microformats: Web Semantics & More Practical Microformats Voices That Matter
    11. Huh? Practical Microformats Voices That Matter
    12. Microformats are sets of HTML attributes and values that are applied to common web content - people, events, blog posts, reviews, tags - to provide more meaning. Practical Microformats Voices That Matter
    13. Microformats are sets of HTML attributes and values that are applied to common web content - people, events, blog posts, reviews, tags - to provide more meaning. Content published with microformats can be extracted by software and indexed, downloaded, searched for, saved, cross- referenced or combined. Practical Microformats Voices That Matter
    14. Formal microformats • hCalendar: event information • hCard: contact information • rel-license: license links • rel-nofollow: restricting increased page rank for links • rel-tag: tag links • VoteLinks: for, against and abstain links • XFN: distributed social networks • XOXO: outline content Practical Microformats Voices That Matter
    15. And even more drafts • hAtom: syndicated • hProduct: consumer content products • hAudio: audio content • hRecipe: food and beverage recipes • hListing: open, distributed listings • hResume: Résumés and C.V.s • hMedia: video, images and audio media • hReview: reviews • hNews: journalistic • xFolk: bookmarks news Practical Microformats Voices That Matter
    16. Let’s talk fundamentals Practical Microformats Voices That Matter
    17. FUNDAMENTALS The basics • Use existing standards: (X)HTML • Emphasize semantics (POSH) • Intentionally simple • Address a specific “problem” • Humans first, machines second Practical Microformats Voices That Matter
    18. FUNDAMENTALS The benefits • Semantics • User experience enhancements • More meaningful search results & better findability • Encourages consistency and standards • Minimal development effort • No need for software or special technologies • Enables sharing and re-use of your web content elsewhere Practical Microformats Voices That Matter
    19. FUNDAMENTALS Who benefits? • Managers • Developers • Designers • Content Authors • Users Practical Microformats Voices That Matter
    20. EVERYONE BENEFITS Practical Microformats Voices That Matter
    21. EVERYONE BENEFITS *BLATANT PLUG WARNING* Check out Microformats Role Play for more on how microformats benefit different people Practical Microformats Voices That Matter
    22. Sounds good, but is anyone really using them? Practical Microformats Voices That Matter
    23. 6,137,400,000 Practical Microformats Voices That Matter
    24. 60,600,000 - hReview 1,660,000,000 - hCard 2,090,000,000 - rel-tag 807,000,000 - hAtom 6,137,400,000 Yahoo! SearchMonkey results as of 12/17/09 452,000,000 - XFN 108,000,000 - hResume 148,000,000 - geo 768,000,000 - adr 44,100,000 - hCalendar Practical Microformats Voices That Matter
    25. Everyone’s doing it • XFN: Twitter Flickr Google Buzz Huffduffer Digg LinkedIn Plaxo Technorati Last.fm Google Social Graph API Ident Engine • rel-license: Creative Commons Yahoo! CC Search Google "Usage Rights" search • hCard: Google Rich Snippets Google Maps Yahoo! Local Google Profiles Twitter Last.fm MySpace • hCalendar: Yahoo! Upcoming MapQuest Local Facebook Last.fm Eventful Google Rich Snippets Practical Microformats Voices That Matter
    26. Everyone’s doing it • hResume: LinkedIn SimplyHired Stack Overflow • hReview: Google Rich Snippets Yelp Yahoo! Local Technorati New York Times Travel Cork’d • hListing: Every Car Listed RealEstate.com dealtagger • hRecipe: Food Network Williams Sonoma Recipes Google Rich Snippets Microformats Wiki: Examples in the Wild Practical Microformats Voices That Matter
    27. Enough with the sales pitch, let’s get started! Practical Microformats Voices That Matter
    28. ELEMENTALS rel-me Assigned to links to sites that represent you online: <a href="http://ablognotlimited.com"> A Blog Not Limited</a> Practical Microformats Voices That Matter
    29. ELEMENTALS rel-me Assigned to links to sites that represent you online: <a href="http://ablognotlimited.com" rel="me"> A Blog Not Limited</a> Practical Microformats Voices That Matter
    30. ELEMENTALS rel-me Assigned to links to sites that represent you online: <a href="http://ablognotlimited.com" rel="me"> A Blog Not Limited</a> One of the values of XFN. Aids in online identity consolidation. Practical Microformats Voices That Matter
    31. blog Practical Microformats Voices That Matter
    32. blog portfolio Practical Microformats Voices That Matter
    33. blog portfolio Practical Microformats Voices That Matter
    34. blog portfolio Practical Microformats Voices That Matter
    35. blog portfolio Practical Microformats Voices That Matter
    36. blog portfolio Practical Microformats Voices That Matter
    37. blog portfolio Practical Microformats Voices That Matter
    38. blog portfolio Practical Microformats Voices That Matter
    39. blog portfolio Practical Microformats Voices That Matter
    40. blog portfolio Practical Microformats Voices That Matter
    41. blog portfolio Practical Microformats Voices That Matter
    42. blog portfolio Practical Microformats Voices That Matter
    43. blog portfolio Practical Microformats Voices That Matter
    44. DIY DEMOS Identity consolidation • Create a new account at Huffduffer using a URL containing rel="me" (i.e. Twitter profile) • Visit Ident Engine’s Identity Discovery and enter a profile URL that uses rel="me" • Add a <link> to your Google Profile with rel="me" to your site for automatic discovery with Buzz Practical Microformats Voices That Matter
    45. COMPOUNDS hCard Adds semantics to contact information for people, places and organizations/companies. Contact information published with hCard can be transformed into an electronic business card. hCard also improves the findability of your contact information. Practical Microformats Voices That Matter
    46. STEP 1 Consider your content Emily Lewis A Blog Not Limited Albuquerque, NM 87106 emily@ablognotlimited.com Practical Microformats Voices That Matter
    47. STEP 2 POSHify <dl> <dt>Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com"> A Blog Not Limited</a></li>       <li>Albuquerque, <abbr title="New Mexico">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    48. STEP 3 Add hCard <dl> <dt>Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com"> A Blog Not Limited</a></li>       <li>Albuquerque, <abbr title="New Mexico">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    49. STEP 3 Add hCard Practical Microformats Voices That Matter
    50. STEP 3 Add hCard <dl class="vcard"> <dt>Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com"> A Blog Not Limited</a></li>       <li>Albuquerque, <abbr title="New Mexico">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    51. STEP 3 Add hCard Practical Microformats Voices That Matter
    52. STEP 3 Add hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com"> A Blog Not Limited</a></li>       <li>Albuquerque, <abbr title="New Mexico">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    53. STEP 3 Add hCard Practical Microformats Voices That Matter
    54. STEP 3 Add hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url">A Blog Not Limited</a></li>       <li>Albuquerque, <abbr title="New Mexico">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    55. STEP 3 Add hCard Practical Microformats Voices That Matter
    56. STEP 3 Add hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url">A Blog Not Limited</a></li>       <li class="adr">Albuquerque, <abbr title="New Mexico">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    57. STEP 3 Add hCard Practical Microformats Voices That Matter
    58. STEP 3 Add hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url">A Blog Not Limited</a></li>       <li class="adr"><span class="locality">Albuquerque </span>, <abbr title="New Mexico">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    59. STEP 3 Add hCard Practical Microformats Voices That Matter
    60. STEP 3 Add hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url">A Blog Not Limited</a></li>       <li class="adr"><span class="locality">Albuquerque </span>, <abbr title="New Mexico" class="region">NM</abbr> 87106</li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    61. STEP 3 Add hCard Practical Microformats Voices That Matter
    62. STEP 3 Add hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url">A Blog Not Limited</a></li>       <li class="adr"><span class="locality">Albuquerque </span>, <abbr title="New Mexico" class="region">NM</abbr> <span class="postal-code">87106</span></li>      <li><a href="mailto:emily@ablognotlimited.com"> emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    63. STEP 3 Add hCard Practical Microformats Voices That Matter
    64. STEP 3 Add hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url">A Blog Not Limited</a></li>       <li class="adr"><span class="locality">Albuquerque </span>, <abbr title="New Mexico" class="region">NM</abbr> <span class="postal-code">87106</span></li>      <li><a href="mailto:emily@ablognotlimited.com" class="email">emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    65. Final hCard Practical Microformats Voices That Matter
    66. Final hCard <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url">A Blog Not Limited</a></li>       <li class="adr"><span class="locality">Albuquerque </span>, <abbr title="New Mexico" class="region">NM</abbr> <span class="postal-code">87106</span></li>      <li><a href="mailto:emily@ablognotlimited.com" class="email">emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    67. Worth noting • Markup doesn't matter, but it should be POSH • Attribute values are case-sensitive • Root properties cannot be combined with sub-properties • You don't need additional class values for styling, but you can use them Practical Microformats Voices That Matter
    68. DIY DEMOS Electronic business card • Go to H2VX Contacts Conversion, enter URL of a page with hCard and select “download.” Or copy the generated URL and paste into your own markup. • Using Firefox, install the Operator add-on and visit a page with hCard. Next, select “contacts” from the new Operator toolbar. • Add the Oomph Microformats Toolkit to your site with hCard. Once installed, select the “gleam” icon from the upper left-hand corner. Select any of the “contacts” export options. Practical Microformats Voices That Matter
    69. COMPOUNDS hCalendar Adds semantics to event information. Event information published with hCalendar can be extracted and imported into users' calendars. hCalendar also improves the findability of your event information. Practical Microformats Voices That Matter
    70. STEP 1 Consider your content at M atter ing on h s Voi ces T c e focun web feren ents i p th conancem In-de g adv io ns by rs and e xcitin with sess y autho , r d esign ted indust c respe rs. leade 10 2 9, 20 e 28- rence • Jun on Bay Confe Missi r • ente C Practical Microformats Voices That Matter
    71. STEP 2 POSHify <h1><a href="http://www.voicesthatmatter.com/ webdesign2010">Voices That Matter</a></h1> <p>In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li>June 28-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> Practical Microformats Voices That Matter
    72. STEP 3 Add hCalendar <h1><a href="http://www.voicesthatmatter.com/ webdesign2010">Voices That Matter</a></h1> <p>In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li>June 28-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> Practical Microformats Voices That Matter
    73. STEP 3 Add hCalendar <div class="vevent"> <h1><a href="http://www.voicesthatmatter.com/ webdesign2010">Voices That Matter</a></h1> <p>In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li>June 28-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    74. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010">Voices That Matter</a></h1> <p>In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li>June 28-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    75. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p>In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li>June 28-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    76. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li>June 28-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    77. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li><span class="dtstart">June 28</span>-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    78. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li><span class="dtstart"><span class="value-title" title="2010-06-28"> </span>June 28</span>-29, 2010</li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    79. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li><span class="dtstart"><span class="value-title" title="2010-06-28"> </span>June 28</span>-<span class="dtend">29, 2010</span></li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    80. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li><span class="dtstart"><span class="value-title" title="2010-06-28"> </span>June 28</span>-<span class="dtend"><span class="value-title" title="2010-06-29"> </span>29, 2010</span></li> <li><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    81. STEP 3 Add hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li><span class="dtstart"><span class="value-title" title="2010-06-28"> </span>June 28</span>-<span class="dtend"><span class="value-title" title="2010-06-29"> </span>29, 2010</span></li> <li class="location"><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    82. Final hCalendar <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li><span class="dtstart"><span class="value-title" title="2010-06-28"> </span>June 28</span>-<span class="dtend"><span class="value-title" title="2010-06-29"> </span>29, 2010</span></li> <li class="location"><a href="http://www.acc- missionbayconferencecenter.com">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    83. DIY DEMOS Electronic calendar • Go to H2VX Events Conversion, enter URL of a page with hCalendar and select “download.” Or copy the generated URL and paste in your own markup. • Using Chrome, install the Michromeformats extension and visit a page with hCalendar. Next, select the new uf icon from your address bar and download the .ics file. Practical Microformats Voices That Matter
    84. Combining microformats Practical Microformats Voices That Matter
    85. For mo even sem re powantic er! Combining microformats Practical Microformats Voices That Matter
    86. hCard and XFN Practical Microformats Voices That Matter
    87. hCard and XFN <dl class="vcard"> <dt class="fn">Emily Lewis</dt>   <dd>    <ul>      <li><a href="http://www.ablognotlimited.com" class="url" rel="me">A Blog Not Limited</a></li>       <li class="adr"><span class="locality">Albuquerque </span>, <abbr title="New Mexico" class="region">NM</abbr> <span class="postal-code">87106</span></li>      <li><a href="mailto:emily@ablognotlimited.com" class="email">emily@ablognotlimited.com</a></li>    </ul> </dd> </dl> Practical Microformats Voices That Matter
    88. hCalendar with hCard Practical Microformats Voices That Matter
    89. hCalendar with hCard <div class="vevent"> <h1 class="summary"><a href="http:// www.voicesthatmatter.com/webdesign2010" class="url">Voices That Matter</a></h1> <p class="description">In-depth conference focusing on exciting advancements in web design, with sessions by respected industry authors and leaders.</p> <ul> <li><span class="dtstart"><span class="value-title" title="2010-06-28"> </span>June 28</span>-<span class="dtend"><span class="value-title" title="2010-06-29"> </span>29, 2010</span></li> <li class="location vcard"><a href="http://www.acc- missionbayconferencecenter.com" class="fn org url">Mission Bay Conference Center</a></li> </ul> </div> Practical Microformats Voices That Matter
    90. Resources Practical Microformats Voices That Matter
    91. Resources *BLATANT PLUG WARNING* Practical Microformats Voices That Matter
    92. RESOURCES My book! Practical Microformats Voices That Matter
    93. RESOURCES My book! Microformats Made Simple Practical Microformats Voices That Matter
    94. RESOURCES My book! Microformats Made Simple Want a preview? Check out Rough Cuts excerpts *BLATANT PLUGS NOT OVER YET* Practical Microformats Voices That Matter
    95. RESOURCES My blog tutorials Getting Semantic With Microformats: • rel-home, rel-tag, rel-license • XFN • hCard • hCalendar • hAtom • hResume • Themes & Issues • Value class pattern Practical Microformats Voices That Matter
    96. RESOURCES Great stuff from other folks • Microformats Wiki • A good resource once you understand the basics • Microformats: Empowering Your Markup for Web 2.0 by John Allsopp • microformatique • Follow @microformats • Send questions to @microformateers Practical Microformats Voices That Matter
    97. RESOURCES Authoring tools • hCard Creator • hCalendar Creator • hReview Creator • XFN Creator • Jeffrey Zeldman's Web Standards Advisor Dreamweaver plug-in Practical Microformats Voices That Matter
    98. RESOURCES Validate, extract, transform • H2VX • Tails Export Add-on for Firefox • Optimus-Microformats Transformer • Semantic Checker Add- on for Firefox • Microform.at Transformer • Michromeformats extension for Chrome • Oomph Microformats Toolkit • SafariMicroformats plug-in for Safari • Operator Add-on for Firefox Practical Microformats Voices That Matter
    99. RESOURCES Additional reading • Microformats Role Play • The Value Class Pattern • More on developing naming conventions, Microformats and HTML5 • Styling hReview Microformats • Styling XFN and rel-license links • Styling hCard Practical Microformats Voices That Matter
    100. RESOURCES Additional reading • Discovering Magic • Meaningful Markup: POSH and Beyond • Google’s Semantic Web Push: Rich Snippets Usage Growing • Microformats Profile URIs Updated Practical Microformats Voices That Matter
    101. Questions? Comments? • emily@ablognotlimited.com • @emilylewis • Introduce yourself and let’s talk! Practical Microformats Voices That Matter
    102. Thanks! Practical Microformats Voices That Matter

    ×