microformats
TRANSCRIPT
![Page 1: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/1.jpg)
MicroformatsHTML to API
Glenn JonesWebDD, 3 Feb 2007, Reading UK
![Page 2: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/2.jpg)
Voting
Contacts
Reviews
Events
Articles
Bookmarks
Relationships
Licensing
Tagging
Posts
![Page 3: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/3.jpg)
HTML is mostly a description of language not content
<div id= "column1" ><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>
![Page 4: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/4.jpg)
<div id= "column1" class="vcard" ><h1>About <span class= "fn" >Glenn Jones</span></h1><p>I am a web designer and information architect working and living in Brighton. I am currently the <span class=“title">Creative Director</span> of <span class="org">Madgex</span></p></div>
Microformats Contact - hCard
![Page 5: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/5.jpg)
Build on pre-existing pattern or standards
BEGIN:VCARDVERSION:2.1N:Glenn JonesFN:Glenn JonesORG:MadgexTITLE:Creative DirectorTEL;WORK;VOICE:+44 (0) 1273 775100ADR;POSTAL;ENCODING=QUOTED-PRINTABLE:;;Suite1=0AClarence House;30-31 North Street;Brigthon;BN1 1EB;United Kingdom…
![Page 6: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/6.jpg)
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”
![Page 7: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/7.jpg)
Elemental MicroformatsAn elemental microformat is a minimal solution to a
single problem, built from standard XHTML elements.
http://microformats.org/
![Page 8: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/8.jpg)
rel-license
<a href="http://creativecommons.org/licenses/by-nc-sa/2.5/" rel="license">Some rights reserved</a>
![Page 9: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/9.jpg)
rel-tag
<a href="http://technorati.com/tag/webdd" rel="tag">WebDD</a>
<ul><li><a href="http://technorati.com/tag/design" rel="tag">Design</a></li><li><a href="http://technorati.com/tag/development" rel="tag">Development</a></li></ul>
![Page 10: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/10.jpg)
XFN (Xhtml Friends Network)
<ul><li><a href="http://jameswragg.com" rel="friend met co-worker colleague">James Wragg</a></li></ul>
![Page 11: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/11.jpg)
![Page 12: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/12.jpg)
hReview - Review
<div class="hreview"> <abbr class="rating" title="5">5 of 5</abbr><span class="type">event</span> <h2 class="summary">dconstruct overall</h2> <div class="description"><strong>Well dconstruct all done, </strong>good all round I thought although hard to stay awake during the folksonomy stuff!! Jeff barrgreat…
…<ul class="tags"> <li><a href="http://technorati.com/tag/dconstruct06" rel="tag">dconstruct06</a></li>
l h f h h ffb
![Page 13: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/13.jpg)
hCalendar - Event
<div class="vevent"> <h1 class="summary">WebDD</h1><p class="description">A free, one day community conference for Web Developers and Designers</p><p>On<abbr class="dtstart" title="20070203T0930">3th February 9:30am</abbr>, <abbr class="dtend" title="20070204T1700">5:00pm</abbr> 2007</p> </div>
![Page 14: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/14.jpg)
Multiple Microformats in Combination – hCard & XFN
<ul><li class="vcard"><a class="fn n url" href="http://jameswragg.com" rel="friend met co-worker colleague"><span class="firstname">James</span> <span class="givenname">Wragg</span></a></li></ul>
![Page 15: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/15.jpg)
Implied Relationships
<a href="http://jameswragg.com" rel="friend met co-worker colleague">James Wragg</a>
<p id="footer">Copyright © <address><a rel="me"href="http://www.glennjones.net/about">Glenn Jones</a></address><p>
![Page 16: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/16.jpg)
Operator
Discovery & Extraction
![Page 17: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/17.jpg)
![Page 18: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/18.jpg)
![Page 19: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/19.jpg)
search.creativecommons.org
Search Engines
![Page 20: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/20.jpg)
It’s your data
![Page 21: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/21.jpg)
![Page 22: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/22.jpg)
![Page 23: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/23.jpg)
![Page 24: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/24.jpg)
![Page 25: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/25.jpg)
<span class="location vcard"> <span class="fn org">Paradise</span>, <abbr class="geo adr" title="30.266935;-97.739267"> <span class="street-address">401 East 6th St</span> </abbr> </span>
![Page 26: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/26.jpg)
Microformats as an API
![Page 27: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/27.jpg)
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
![Page 28: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/28.jpg)
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
![Page 29: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/29.jpg)
Design URLs for maximumclarity & discoverability?
http://webdd.backnetwork.com/people/person.aspx?person=glennjones
http://webdd.backnetwork.com/person/glennjones
Describe logical objects not physical file pathsRemove hierarchies where possible
![Page 30: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/30.jpg)
Designing URLs into a schemato act as an API
/tags/people
/tag/creative/person/glennjones
/person/glennjones/tags/person/glennjones/tag/creative }Faceted
Structures
/tags/26/tags/?start=26&pagesize=25
![Page 31: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/31.jpg)
URLs have semantic importance
<a href="http://webdd.backnetwork.com/tag/dog/" rel="tag">Fish</a>
It’s a "dog" not a " fish "
![Page 32: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/32.jpg)
![Page 33: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/33.jpg)
URLs – that look and act like method calls
http://webdd.backnetwork.com/tag/creative
backnetwork.tags.getList( “creative”)
![Page 34: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/34.jpg)
Using HTTP Verbs that work
POSTGET
Read Create Update
http://webdd.backnetwork.com/people/ Createhttp://webdd.backnetwork.com/person/glennjones Update
![Page 35: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/35.jpg)
Is this just not REST?(Representational State Transfer)
• URLs clarity & discoverability
• Uses HTTP Verbs GET, POST, PUT, DELETE• Deal with the concept of resources
![Page 36: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/36.jpg)
APIs are not just about the code
![Page 37: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/37.jpg)
oblivious development by planting seeds
vs
the conscious development of an interface
![Page 38: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/38.jpg)
Can you develop a Microformats API
YES
![Page 39: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/39.jpg)
Simplicity gives you
lower barrier to entrymore chance of traction
![Page 40: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/40.jpg)
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.
Microformats, the AK-47 of the web
Pat Ramsey
![Page 41: Microformats](https://reader034.vdocuments.net/reader034/viewer/2022042714/555853c5d8b42a943b8b4af9/html5/thumbnails/41.jpg)
Thank You glennjones.net
Attribution. You must attribute the work in the mannerspecified by the author or licensor.
http://creativecommons.org/licenses/by/2.5/