1 / 24

Microformats

Microformats. Embedding Semantics in XHTML. Microformats Defined. Microformats are small patterns of (X)HTML to represent commonly published things like people, events, blog posts, reviews and tags in web pages. Microformats Rely on POSH. Microformats rely on POSH (Plain Old Semantic HTML).

shiri
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 Embedding Semantics in XHTML Using Microformats

  2. Microformats Defined Microformats are small patterns of (X)HTML to represent commonly published things like people, events, blog posts, reviews and tags in web pages. Using Microformats

  3. Microformats Rely on POSH Microformats rely on POSH (Plain Old Semantic HTML). • We all know that (X)HTML is for structure & semantics, not style. • Semantics are meaning. • Adding standard classes to an (X)HTML document we can augment the semantics and store further information. Using Microformats

  4. How are they consumed? Microformats are currently consumed in several ways (not a comprehensive list): • By web users • By spiders • By web services Using Microformats

  5. Web Users Web users consume Microformats info through specialty tools such as the Firefox Operate extension. This extension allows users to: • Add hCard & hCalendar info to Outlook. • Add hCard & hCalendar info to Yahoo & Google • Find Microformat addresses on Google Maps Using Microformats

  6. Web Spiders Web spider or web crawlers already pick up useful information such as email addresses. In the near future look for spiders to pick up hCard, vCard and other Microformat information which they will compile for use with Web Services. Using Microformats

  7. Web Services Web services are applications that collect and process information then distribute that information to end users. Examples: • Stock quotes • Events collection • Contact info collection Using Microformats

  8. Two Common Microformats Two common Microformats: • hCard: is an HTML vCard which contains contact information. • hCalendar: capable of storing event information. Using Microformats

  9. hCard Uses the following classes (to name a few): • vcard: this is the root class • url: a web address • fn: first name • org: organization • adr: an address wrapper with the following: • street-address: street # and name • locality: city • region: state • postal-code: zip • tel: telephone # Using Microformats

  10. hCard Example Using Microformats

  11. hCard Example Code (1) Using Microformats

  12. hCard Example Code (2) Using Microformats

  13. hCard Example Code (3) Using Microformats

  14. hCard Example Code (4) Using Microformats

  15. hCard Example Code (5) Using Microformats

  16. hCard Example Code (6) Next, you can create the CSS classes: N Using Microformats

  17. hCalendar Uses the following classes (to name a few): • vevent: this is the root class • dtstart & dtend: event start & end times • summary: the name of the event • location: the location of the event • description: event details Using Microformats

  18. hCalendar Example Using Microformats

  19. hCalendar Example Code (1) Using Microformats

  20. hCalendar Example Code (2) Using Microformats

  21. hCalendar Example Code (3) Using Microformats

  22. hCalendar Example Code (4) Using Microformats

  23. hCalendar Example Code (5) Using Microformats

  24. hCalendar Example Code (6) Using Microformats

More Related