1 / 23

MICROFORMATS

MICROFORMATS. Ioana B ărbănțan Semantic Web developer. Content. What Are The Microformats ? Definitions Benefits & Limitation An Example Categories Web & Mobile Browsers Supporting Microformats Facebook Conclusions. What Are The Microformats ?.

lola
Download Presentation

MICROFORMATS

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. MICROFORMATS Ioana Bărbănțan Semantic Web developer

  2. Content • What Are The Microformats? • Definitions • Benefits & Limitation • An Example • Categories • Web & Mobile Browsers Supporting Microformats • Facebook • Conclusions

  3. What Are The Microformats? Official definition of microformats • set of simple, open data formats • built upon existing and widely adopted standards • designed for humans first and machines second • intend to solve simpler problems first by adapting to current behaviors and usage patterns Other properties • makes a page evolve from being machine-readable to being machine understandable • set of conventions • microformatsare not a new language • but adapted to current behaviors and usage patterns and is connected with semantic XHTML

  4. Microformats Concept • Generic title given to any and all the formats based on XML/HTML with the objective of providing additional metadata concerning the web object

  5. Benefits & Limitations • B1: They will improve the semantic value of the content • B2: Reuse of HTML and XML tags to convey data • B3:Add structure to content • L1: Web browsers do not support them uniformly • L2: They require additional HTML markup

  6. An Example Problem: the need to mark-up address information semantically. <div class="adr"> <abbr class="type" title="dom">U.S.</abbr> <span class="type">home</span> address, for <abbr class="type" title="postal">mail</abbr> and <abbr class="type" title="parcel">shipments</abbr>: <div class="street-address">123 Main Street</div> <span class="locality">Any Town</span>, <span class="region">CA</span> <span class="postal-code">91921-1234</span> </div> Microformatsare easily human-readable when rendered in a browser.

  7. Categories People and Organizations • hCard <divclass="vcard"><a class="urlfn" href="http://tantek.com/">TantekÇelik</a></div> • Geo • enables publishers to add geodata about the location of a person, place, event, or thing to a page <span class="geo"> <span class="latitude">27.976628</span>, <span class="longitude"> å 86.933302</span> </span> • XFN (XHTML Friends Network) is a simple way to represent human relationships using hyperlinks • indicate their relationship(s) to the people in their blogrolls simply by adding a 'rel' attribute to their <a href> tags <a href="http://jeff.example.org" rel="friend met"> • other rel : coworker, neighbor, child

  8. Categories • hRecipe • markup for creating meals, drinks, food-based items • identify individual food related concepts • required property: fn – fromatted name and an ingredient <span class = “hrecipe”> <span class = “fn ingredient”> sugar </span> </span>

  9. Categories –contd. • Calendars and Events • hCalendar • Opinions, Ratings and Reviews • VoteLinks, hReview • Licenses • rel-license • Tags, Keywords, Categories • rel-tag • Lists and Outlines • XOXO

  10. Web Browsers Supporting Microformats • Firefox from V3 • Operator add-on that detects microformats in each page you view and enables actions on them • IE, 7+ supports microformats using add-ins • Chrome 5+ • Safari– has unofficial plugins

  11. Mobile Browsers Supporting Microformats • No support • BlackBerry • iPhone • Nokia • The S60 3rd generation browser can handle vcards and icalsextracted from hcards and vcards very well

  12. User Interface

  13. Firefox Microformats

  14. Firefox Microformats Person representation <div class="vcard"><a class="urlfn" href="http://tantek.com/">TantekÇelik</a></div>

  15. Firefox Microformats –contd. • Events • export to outlook/ windows live / Google / Apple / 30 boxes • export event • add to 30 boxes • bookmark • add to Google/Yahoo calendar

  16. Firefox Microformats–contd. • Tagspaces • find products on amazon/ del.icio.us • find photos on flickr • find bookmarks • find blogs • find events on upcoming.org • find answers on Yedda • find videos on Youtube

  17. IE Microformats

  18. IE Microformats

  19. Chrome Microformats

  20. Facebook Uses Microformats •  Facebook has marked up all events with the hCalendarmicroformatincluding marking up their venues with hCard as well <div>Monday, March 14 · <span class="dtstart"> <span class="value-title" title="2011-03-14T18:00:00"> </span>6:00pm</span> - <span class="dtend"> <span class="value-title" title="2011-03-14T21:00:00"> </span>9:00pm</span> </div>

  21. Conclusions • A format used in the Semantic Web that re-uses HTML and XML tags to convey • Provide easy reading and understanding by humans • Add structure to content • Humans first, machines second

  22. References • http://microformats.org/ • John Allsop, “Microformats: Empowering Your Markup for Web 2.0”, Berkeley, CA , 2007

  23. Mulțumesc!

More Related