I think it’s time to inform you about a small project I worked on together with Chris Messina from Factorycity. As Microformats have gained much popularity over the last year we thought it was time to standardize the way they are represented on a website. So we created the Microformats Icon Set.
The starter set contains icons for hCal, hResume, hCard, XFN and a generic TAG icon. All Icons are available here in several formats. If you wanna get started immediately you can grab the PNGs, which will be perfect in most cases. If you need additional icons, you can download the Icon Development Kit containing Photoshop as well as Illustrator templates for all icons. Have fun :)
Furthermore we concentraded on special XFN icons, conveiing the relation to the the person linked to.
36 comments so far
Skip to comment form
Michael Whalen December 04, 2006 at 07:31 PM
Pretty sweet icons man, great idea too. Standardization is the way to go! By the way, I absolutley LOVE the site!
giz404 December 04, 2006 at 08:29 PM
Sweet icons indeed !!
What about the license ? Are we free to use them on our sites ?
José Carlos December 04, 2006 at 08:34 PM
Great icons. Congratulations, they’re amazing!
José Carlos December 04, 2006 at 08:35 PM
As giz404 said: can we use them? What are the restrictions?
Wolfgang December 04, 2006 at 08:51 PM
Well as stated on Chris’ website: “Content provided under Creative Commons ShareAlike 1.0. No warranties are granted herein. Take what ya get and make it better!” So feel free to use them :)
Heiko December 04, 2006 at 09:43 PM
pretty nice icon-set, Wolfgang
macx December 04, 2006 at 10:33 PM
Der Kontrast der XFN-Icon – zumindest von der zweiten Person – sind viel zu schwach. Sehbehinderte werden die zweite Person im Icon nicht sehen und selbst bei mit auf dem TFT muss ich genau hinsehen, um was zu erkennen.
Warum findet eigentlich das Icon für Microformate keine Verwendung?
http://microformats.org/
jharr December 04, 2006 at 10:46 PM
Fantastic idea, excellent execution. Please share screens of others making good use of these.
monkey56657 December 04, 2006 at 11:42 PM
Wow. These will be great for my site (in planning stages)….thanks!.
Matthew Smith December 04, 2006 at 11:50 PM
Well done. This is right alongside the feed icons that have been helpful for usability. This will go a long way. Thanks for putting the time in for all of us.
Alexander Graf December 05, 2006 at 12:39 AM
Pretty sweet icons. Great work and props for sharing them.
However, where would one use them, except for plugging microformats? It’s not like microformats are widely supported yet. Don’t get me wrong, I’m not criticizing your fantastic work :) Just want to know what the intended use is.
– AlexMartin Labuschin December 05, 2006 at 12:52 AM
I think about using it for my site in my next update. thank you
Steve Williams December 05, 2006 at 01:38 AM
Love the hint of a tie on the colleague XFN icon, nice touch!
I really must make the effort to learn and utilise some microformats when I redesign my own site and blog over Christmas.
Not sure if I’ve done a client site that would benefit from microformats? Any good real world examples of when microformats help grow a business site?
Alexander Graf December 05, 2006 at 01:52 AM
Steve Williams: Not yet, but they might in the future. It sure doesn’t hurt implementing them.
Chris Wouters December 05, 2006 at 02:16 AM
nette Idee …
werde mir mal das Icon-Dev-Kit anschauen …
Chris
Andre December 05, 2006 at 02:42 AM
Just discovered your icons via techchrunch. We’ll evaluate how we could use them on our plattform.
Julian Schrader December 05, 2006 at 03:11 AM
Very nice idea! Congratulations to the fulfilment, the icons look as great as usual!
Augusto December 05, 2006 at 03:59 AM
you should register microformatsicons.com!
Nathanael December 05, 2006 at 05:52 AM
Love your work! Any chance of a hListing icon? :-)
Stefan Julius December 05, 2006 at 12:23 PM
Hello very nice.
I will hAtom Icon for my Blog Sidebar, very nice thanx a lot.
I also have written an article to tell the others where to find your microicons.
I Have also put this picture into my post icon-set.png, is it allowed for me?
If not please inform me I will remove it immediately!
Thanx a lot!
Angus McIntyre December 05, 2006 at 11:58 PM
The icons are beautiful, but can you suggest how they should be used? Do you simply add an icon to a page to signal “There is microformat content at this location”, or is it expected to be a clickable link that causes something to happen?
Keri Henare December 06, 2006 at 12:29 AM
My love for Microformats combined with my love for Bartelme Design. What more could I ask for.
Justin Halsall December 06, 2006 at 01:42 AM
Great idea and great icons!
Ramon Bispo December 06, 2006 at 02:54 AM
Realy good!!!
Oliver Coningham December 06, 2006 at 03:11 AM
Fantastic icons. Here is a ‘real-world’ example of how I have used it – http://www.aztecportfolio.com/jays/contact.html.
For those asking for the business benefits of Microformats, just do a little research or visit my own del.icio.us links on them – http://del.icio.us/oconingham/microformats.
One of the key elements of them is the ability to click on a link that will add the hCard to your address book. There are also search engines that allow you to search for specific Microformats such as events or people.
Paul Jensen December 06, 2006 at 06:09 AM
Lovely icons, thank you
Alexander Graf December 06, 2006 at 09:09 PM
Oliver Coningham: Thanks for the links. I didn’t know technorati could automatically generate vCards. That changes matters. Thanks again for the hint :)
Rian December 07, 2006 at 05:42 AM
Why does the hRésumé icon have a reload/refresh symbol?
Ken Rossi : CivilNetizen.com December 07, 2006 at 07:37 AM
Chris M. told me about this. Posted on newstoday pbs. Gonna post on the netizen blog in the coming week.
mr5 December 08, 2006 at 06:26 PM
good work.I am study css style and AI now.It’s funny.
http://www.showone.cn/
Michael December 09, 2006 at 09:31 PM
Nice work
Adam Patterson December 10, 2006 at 04:13 AM
Cool idea, good looking icons as well.
Timo Kleemann December 11, 2006 at 02:26 AM
Extremely useful! Thanks for your input!
Jon Buda December 13, 2006 at 02:34 AM
Great work and thanks for sharing with the community. I’ve always felt that to be able to communicate a message with the minuscule constraints of an icon is truly an art. And an extremely frustrating art at times as well!
regimages January 05, 2007 at 04:33 PM
sell your icons at
http://www.regimages.com
Willis Witze January 31, 2007 at 08:39 PM
nice icons! just bookmarked.. :)