LD SoftwareBespoke Software, Web Design, Security Consultants and Host Services.

Menu

Sentinel
You have been warned!
We have caught 5852 shameful hackers.

NukeSentinel(tm)

Paypal Referral
Sign up for PayPal and start accepting credit card payments instantly.

Link Exchange
Join our free link exchange

Click Here
 
Microformat

Web Design & Development Guide

Microformat

Home | Up


Microformat logo
Microformat logo

In web development, a microformat (sometimes abbreviated μF or uF) is a way of adding simple semantic meaning to human-readable content which is otherwise, from a machine's point of view, just plain text. They allow data items such as events, contact details or locations, on HTML (or XHTML) web pages, to be meaningfully detected and the information in them to be extracted by software, and indexed, searched for, saved or cross-referenced, so that it can be reused or combined.

More technically, they are items of semantic mark up, using just standard (X)HTML with a set of common class-names. They are open and available, freely, for anyone to use.

Current microformats allow the encoding and extraction of events, contact information, social relationships, and so on. More are being developed. Version 3 of the Firefox browser[1], as well as version 8 of Internet Explorer[2] are expected to include native support for microformats.

Principles

(X)HTML standards allow for semantics to be embedded and encoded within them. This is done using specific HTML attributes:

  • class
  • rel
  • rev

For example, 52.48,-1.89 is a pair of numbers which may be understood, from their context, to be a set of geographic coordinates. By wrapping them in spans (or other HTML elements) with specific class names (in this case part of the geo microformat specification):

 <span class="geo"><span class="latitude">52.48</span>, <span class="longitude">-1.89</span></span>

machines can be told exactly what each value represents, and can then index it, look it up on a map, export it to a GPS device, etc.

Example

Consider the contact information:

 <div>
   <div>Joe Doe</div>
   <div>The Example Company</div>
   <div>604-555-1234</div>
   <a href="http://example.com/">http://example.com/</a>
 </div>

With hCard microformat markup, that becomes:

 <div class="vcard">
   <div class="fn">Joe Doe</div>
   <div class="org">The Example Company</div>
   <div class="tel">604-555-1234</div>
   <a class="url" href="http://example.com/">http://example.com/</a>
 </div>

Here the formal name (fn), organisation (org), telephone number (tel) and url have been identified using specific class names; and the whole thing is wrapped in class="vcard", (see vCard) which indicates that the other classes form a vcard, and are not just coincidentally named. Other, optional, hCard classes also exist.

It is now possible for software, for example browser plug-ins, to extract the information, and transfer it to other applications, such as an address book.

Live example

For a live example of microformats on Wikipedia pages, see HCard#Live example

Accessibility of Microformats

Because some microformats make use of the abbr html element in the "abbr design pattern" to conceal machine-only data in the expansion of the abbreviation, the data is inaccessible to some screenreaders that expand abbreviations. This is particularly the case with date-time and geographical data. See the Web Standards Project's Accessibility Task Force article "hAccessibility".

Specific microformats

Several microformats have been developed to enable semantic markup of particular types of information.

  • hAtom (hAtom spec) - for marking up Atom feeds from within standard HTML
  • hCalendar (hCalendar spec) - for events
  • hCard (hCard spec) - for contact information; includes:
    • adr (adr spec) - for postal addresses
    • geo (geo spec) - for geographical coordinates (latitude;longitude)
  • hReview (hReview spec) - for reviews
  • hResume (hResume spec) - for resumes or CVs
  • rel-directory (rel-directory spec) - for distributed directory creation and inclusion
  • rel-nofollow, an attempt to discourage 3rd party content spam (e.g. Spam in blogs).
  • rel-tag (rel-tag spec) - for decentralized tagging (Folksonomy)
  • xFolk (xFolk spec) - for tagged links
  • XFN - for social relationships
  • XOXO - for lists and outlines

Proposed microformats

Among the many proposed microformats[3], the following are undergoing active development:

  • citation - for citing references[4]
  • currency - for amounts of money[5]
  • Geo extension - for places on Mars, The Moon, and other such bodies
  • species - For the names of living things.

Uses of microformats

Using microformats within HTML code provides additional formatting and semantic data that can be used by applications. These could be applications that collect data about on-line resources, such as web crawlers, or desktop applications such as e-mail clients or scheduling software.

Several browser extensions, such as Operator, provide the ability to detect microformats within an HTML document and export them into formats compatible with contact management and calendar utilities, such as Microsoft Outlook.

Microsoft expressed a desire to incorporate Microformats into upcoming projects[6]; as have other software companies.

In Wikipedia - and more generally in MediaWiki - microformats are used as part of templates like {{coord}} for example.

Creation of microformats

Most of the existing microformats were created at the microformat wiki and associated mailing list, by a process of gathering examples of web publishing behaviour, then codifying it. Some other microformats (such as rel=nofollow and unAPI have been proposed, or developed, elsewhere.

Critique of microformats

Commentators have offered various critiques of microformats, suggesting viewpoints where they are both potentially favorable and potentially unfavorable.[7]

Favorable aspects

  • Microformats are designed for usability and backward-compatibility.
  • An alternative approach, using XML (for semantics) plus CSS (for presentation), is not as flexible with older web browsers.[8]
  • Microformats are no more subject to abuse and spam than any other similar proposal for data normalization.

Unfavorable aspects

  • Microformats present an undesirable mixing of data-layer with presentation-layer. [9]
  • Accessibility is hindered by the use of abbr. [10]
  • The use of CSS class names to specify the semantics of markup is sub-optimal, and would be better expressed as XML elements.[11][8]
  • Microformats present yet another medium for abuse and spam within HTML markup.

References

Further reading

  • Allsopp, John (2007). Microformats: Empowering Your Markup for Web 2.0. Friends of ED. ISBN 978-1-59059-814-6. 
  • Orchard, Leslie M. (2005). Hacking RSS and Atom. Wiley. ISBN 978-0-7645-9758-9. 
  • Robbins, Jennifer Niederst (2006). Web Design In A Nutshell, Third Edition, O'Reilly Media. ISBN 978-0-596-00987-8. 
  • Suda, Brian (2006). Using Microformats. O'Reilly Media. ISBN 978-0-596-52817-1. 
  • Haine, Paul (2006). HTML Mastery. Friends of ED, pp. 117-154. ISBN 978-1-59059-765-1. 

External links


Home | Up | Cascading Style Sheets | Printer friendly | Brochureware | Digital strategy | DOM scripting | Fahrner Image Replacement | Microformat | Progressive enhancement | Rollover | Spacer GIF | Techniques for creating a User Centered Design | URL redirection | Web Interoperability | Web modeling | Web template | Web-safe fonts | Website architecture | Website wireframe

Web Design & Development Guide, made by MultiMedia | Websites for sale

This guide is licensed under the GNU Free Documentation License. It uses material from the Wikipedia.

 

Text Ads
There isn't content right now for this block.

Community Login
Welcome,
Anonymous

Nickname
Password
   

People Online:
Visitors: 179
Members: 1
Total: 180

Online Now:
01 : Monty

Like my code
Then please make a donation.

Which help me produce more free code.


Paypal Verified

Information

Powered by PHP-Nuke

Valid CSS!


Valid Robots.txt

Bad Behavior

[Valid RSS]

[Valid RSS]
You can syndicate our News with backend.php And our Forums with rss.php
You can also access our feeds via Feedburner Site News and LD Software Forums
© 2009 ld-software.co.uk All Rights Reserved.
PHP-Nuke Copyright © 2005 by Francisco Burzi. This is free software, and you may redistribute it under the GPL. PHP-Nuke comes with absolutely no warranty, for details, see the license.
Page Generation: 0.48 Seconds