hAtom

hAtom is a microformat used for marking up blog posts/syndicated content.

hAtom is a draft microformat for content that can be syndicated, primarily but not exclusively weblog postings.

http://microformats.org/wiki/hAtom

If you use a blogging application, such as wordpress, hAtom is very easy to implement to your templates.

Marking-up hAtom

The properties of hAtom are show below, along with the part of the blog entry they apply to.

• hfeed – Goes around all the posts on the blog page.
• hentry – Contains an individual blog post.
• entry-title – The title of the blog post.
• entry-content – The content of the blog post.
• entry-summary – Summery of the blog post, for example an excerpt.
• updated – When the post was last updated.
• published – Date the post was published.
• author – Author of the entry, must be a hCard. If no author is present, the nearest
  
  with class ‘author’ (that is a hCard) will be used.
• bookmark -For the permalink, uses rel-bookmark.

Using hAtom with the Wordpress loop

To make wordpress display your posts using hAtom you can add the hAtom class names to the wordpress loop. Here is an extract from a wordpress loop that I converted to use hAtom:

<div id="content" class="hfeed">
	<?php if (have_posts()) : ?>
		<?php while (have_posts()) : the_post(); ?>
			<div class="hentry entry" id="post-<?php the_ID(); ?>">
				<h2 class="entry-title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
				<small><abbr class="published" title="<?php the_time('Y-m-d'); ?>T<?php the_time('h:m:s'); ?>"><?php the_time('F j, Y'); ?></abbr></small>

				<div class="entry-content">
					<?php the_content('Read the rest of this entry &raquo;'); ?>
				</div>

				<p class="postmetadata">Posted in <?php the_category(', ') ?> | <?php edit_post_link('Edit', '', ' | '); ?>  <?php comments_popup_link('No Comments &#187;', '1 Comment &#187;', '% Comments &#187;'); ?></p>
			</div>

		<?php endwhile; ?>

With posts marked up as hAtom, the firefox ‘Tails’ extension can see them, this is a screenshot of Tails viewing Blue Anvil.

So that was a quick tour of hAtom. Although still in the draft stages, hAtom is set to be an extremely useful Microformat, and I look forward to its completion.

For more examples of hAtom go to the hAtom wiki examples page.

For more information on hAtom go to the hAtom wiki.

Closing Remarks

To conclude, I just have to say, I believe Microformats are a great thing, and the web as a whole will benefit from them in the future. The semantic benefits of using Microformats is extremely exciting, and I hope webmasters understand, and use them whenever possible.

I look forward to new and exciting Microformats, and cannot wait for them to be utilised by software and search engines.

Further Reading

• http://microformats.org – Look at the domain name, need I say more?
• http://adactio.com/journal/1122 – Natural language hCard’s
• http://suda.co.uk/projects/microformats/cheatsheet/ - A great cheat sheet showing the properties of various Microformats
• http://microformats.org/code/hcard/creator - The official hCard creator.
• http://www.technorati.com/contacts/ – A great tool for generating vCards from hCards embedded on web pages.

Page: 1 2 3

Found this post useful? Why not buy me a coffee!

Related Entries

• Guide to Semantic Mark-up
• Creating an accessible yet sexy search box with CSS
• Window Resize/Mobile Browser Background Bugs
• Easy jQuery Pull Quotes
• Anti-aliased Rounded corners with JQuery

Popular Entries

• Anti-aliased Rounded corners with JQuery
• JQuery Curvy Corners Update (v1.1.1)
• The great wordpress plugin update extravaganza of the year
• Book Review - Learning jQuery
• Book Review - jQuery Reference Guide