Your SlideShare is downloading. ×
Microformats HTML to API
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Microformats HTML to API


Published on

Published in: Technology

1 Like
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. Microformats HTML to API Glenn Jones WebDD, 3 Feb 2007, Reading UK
  • 2. Contacts Relationships Reviews Licensing Events Tagging Bookmarks Voting Posts Articles
  • 3. HTML is mostly a description of language not content <div id= quot;column1quot; > <h1>About Glenn Jones</h1> <p> I am a web designer and information architect working and living in Brighton. I am currently the Creative Director of Madgex </p> </div>
  • 4. Microformats Contact - hCard <div id= quot;column1quot; class=quot;vcardquot; > <h1>About <span class= quot;fnquot; >Glenn Jones</span></h1> <p> I am a web designer and information architect working and living in Brighton. I am currently the <span class=“titlequot;>Creative Director</span> of <span class=quot;orgquot;>Madgex</span> </p> </div>
  • 5. Build on pre-existing pattern or standards BEGIN:VCARD VERSION:2.1 N:Glenn Jones FN:Glenn Jones ORG:Madgex TITLE:Creative Director TEL;WORK;VOICE:+44 (0) 1273 775100 ADR;POSTAL;ENCODING=QUOTED-PRINTABLE:;;Suite 1=0AClarence House;30-31 North Street;Brigthon;BN1 1EB;United Kingdom …
  • 6. Attributes used in Microformats Class “for general purpose processing by user agents” Rel “describes the relationship from the current document to the anchor specified by the href attribute” Rev “describe a reverse link from the anchor specified by the href attribute to the current document”
  • 7. Elemental Microformats An elemental microformat is a minimal solution to a single problem, built from standard XHTML elements.
  • 8. rel-license <a href=quot; sa/2.5/quot; rel=quot;licensequot;> Some rights reserved </a>
  • 9. rel-tag <a href=quot;; rel=quot;tagquot;>WebDD</a> <ul> <li><a href=quot;; rel=quot;tagquot;>Design</a></li> <li><a href=quot;; rel=quot;tagquot;>Development</a></li> </ul>
  • 10. XFN (Xhtml Friends Network) <ul> <li> <a href=quot;http://jameswragg.comquot; rel=quot;friend met co-worker colleaguequot;> James Wragg</a> </li> </ul>
  • 11. hReview - Review <div class=quot;hreviewquot;> <abbr class=quot;ratingquot; title=quot;5quot;>5 of 5</abbr> <span class=quot;typequot;>event</span> <h2 class=quot;summaryquot;>dconstruct overall</h2> <div class=quot;descriptionquot;><strong>Well dconstruct all done, </strong>good all round I thought although hard to stay awake during the folksonomy stuff!! Jeff barr great… …<ul class=quot;tagsquot;> <li><a href=quot;; rel=quot;tagquot;>dconstruct06</a></li>
  • 12. hCalendar - Event <div class=quot;veventquot;> <h1 class=quot;summaryquot;>WebDD</h1> <p class=quot;descriptionquot;>A free, one day community conference for Web Developers and Designers</p> <p>On <abbr class=quot;dtstartquot; title=quot;20070203T0930quot;>3th February 9:30am</abbr>, <abbr class=quot;dtendquot; title=quot;20070204T1700quot;> 5:00pm</abbr> 2007 </p> </div>
  • 13. Multiple Microformats in Combination – hCard & XFN <ul> <li class=quot;vcardquot;> <a class=quot;fn n urlquot; href=quot;http://jameswragg.comquot; rel=quot;friend met co-worker colleaguequot;> <span class=quot;firstnamequot;>James</span> <span class=quot;givennamequot;>Wragg</span></a> </li> </ul>
  • 14. Implied Relationships <a href=quot;http://jameswragg.comquot; rel=quot;friend met co-worker colleaguequot;> James Wragg</a> <p id=quot;footerquot;>Copyright &copy; <address> <a rel=quot;mequot; href=quot;;>Glenn Jones</a> </address> <p>
  • 15. Operator Discovery & Extraction
  • 16. Search Engines
  • 17. It’s your data
  • 18. <span class=quot;location vcardquot;> <span class=quot;fn orgquot;>Paradise</span>, <abbr class=quot;geo adrquot; title=quot;30.266935;- 97.739267quot;> <span class=quot;street-addressquot;>401 East 6th St</span> </abbr> </span>
  • 19. Microformats as an API
  • 20. But that's the beauty of it! Something I'm calling “oblivious development”. I've always looked at microformats as “planting seeds” that later grow into things you never even thought of. Dan Cederholm, Cork’d
  • 21. By definition microformats are simple blocks data embedded across multiple pages with-in a web site To create an API we need to bring all this information together into a coherent schema
  • 22. Design URLs for maximum clarity & discoverability? people/person.aspx?person=glennjones person/glennjones Describe logical objects not physical file paths Remove hierarchies where possible
  • 23. Designing URLs into a schema to act as an API /tags /people /tag/creative /person/glennjones /person/glennjones/tags Faceted /person/glennjones/tag/creative } Structures /tags/26 /tags/?start=26&pagesize=25
  • 24. URLs have semantic importance <a href=quot;; rel=quot;tagquot;>Fish</a> It’s a quot;dogquot; not a quot; fish quot;
  • 25. backnetwork.tags.getList( “creative”) URLs – that look and act like method calls
  • 26. Using HTTP Verbs that work GET POST Read Create Update Create Update
  • 27. Is this just not REST? (Representational State Transfer) • URLs clarity & discoverability • Uses HTTP Verbs GET, POST, PUT, DELETE • Deal with the concept of resources
  • 28. APIs are not just about the code
  • 29. oblivious development by planting seeds vs the conscious development of an interface
  • 30. Can you develop a Microformats API YES
  • 31. Simplicity gives you lower barrier to entry more chance of traction
  • 32. Microformats, the AK-47 of the web I think history has shown us over and over again that the most successful “things” are those that are only as complex as they needed to be. I can think of the AK-47 rifle, for example… With Web 2.0, we’re seeing that as well. Pat Ramsey
  • 33. Thank You Attribution. You must attribute the work in the manner specified by the author or licensor.