Noscope is a bi-weekly journal serving up snacksized portions of pointless stuff since 2001. On a new linode server!
I also do freelance design and usability via dejligt.com

Favatars (and Favatar WordPress Plugin)

    18:00 on December 26, 2004 ,

Favatars

The latest Favatar plugin for WordPress can always be found at WP-plugins.org.
More info on favicon.ico files is explained elsewhere.

With the help of Gravatar – globally recognized avatar – there’s been a rise in the use of avatars on weblogs. An avatar is a small image representing a commenter.

But no later than the Gravatar service’s skyrocket to success did the wings break. Gravatar’s host had shut them down temporarily. Since Gravatars are server-based, one could guess it was only a matter of time.

There is an alternative, dubbed “Favatars”. The idea, which has been around for a while, is to use small icons files named (favicon.ico files) as avatars. Their initial purpose was to provide a small bookmarks icons and URL addresses.

I am, of course, writing about this because I have now implemented “favatars” on this very website. -Leave a comment — try it out-. No more testing. Trust me, it works if you type in the correct URL :)

1. Technical Background

The initial implementation of Favatars here on Noscope was based on work by Alex Jones that in turn relied on code by Paul James. The basic idea was to analyze the URL of commenters using regular expressions, looking for the presence of a favicon.ico.

In their latest WordPress plugin, version, the presence of a favicon.ico file is automatically stored in the same SQL database WordPress uses.

2. Favatars vs. Gravatars

Whether to choose Gravatars or favatars is a matter of individual taste. Both systems work well, but each system has their pros and cons.

Personally, I have never been a of avatars. While they can potentially make an online debate a bit more personal, this is rarely the case because people will often choose Bart Simpson or Britney Spears. That’s hardly personal. Furthermore, had I chosen Gravatars, I would’ve chosen a very small size, partly because of the above mentioned reason, partly as to not interfere or overshadow the comments themselves. Finally, favatars are peer-based, while Gravatars rely on Gravatar.com running.

Considering this, the 16×16 pixel alternative is perfect for Noscope.

Gravatar pros

  • Rating system
    Gravatar rate submitted avatars. You can choose to show any rating, or only “work-safe” avatars. This is impossible for favatars.
  • Fewer size limitations
    Gravatars can be as much as 80×80 pixels, whereas favatars are _very rarely_ larger than 16x16px. As Matt points out, favatars _can_ be up to 128×128 px in size.

Gravatar cons

  • Serverbased
    If Gravatar.com succumbs to server pressure, all weblog gravatars will be unable to load.

Favatar pros

  • Peer-based
    Each favatar is loaded from each individual commenters server. That means if that commentators server is down, his/her favatar _alone_ will not load. It won’t influence other favatars. It also means if a commentator wants to change his/her favatar, he/she can update their favicon.ico files at their own leisure.

Favatar cons

  • Size limitations
    While favatars can be 16×16, 24×24, 32×32, 48×48, 64×64, 128×128 pixels in size, it is the exception to see favatars that are larger than 16x16px. Additionally, since favatars are bitmap files (whereas gravatars are JPEGs), filesizes are slighly, although not noticably larger.
  • IE problems
    Internet Explorer has problems rendering badly formed favicon.ico files, which do appear from time to time. Other browsers have no problems. Worst case is that IE shows black squares in place of the favatars.
  • No rating
    It’s impossible to rate the contents of favatars. As such, graphic material could potentially appear. Due to the nature of favatars though, this is unlikely to happen.

3. Favatars for WordPress Plugin

Jeff Minard improved my initial experimental plugin. Go grab the latest version now!

WordPress Plugin: Favatars

Installation

Download the plugin and drop it into your plugins directory (wp-content/plugins). Activate the plugin on your WordPress Plugin Admin page.

To show comment author Favatars in your comments, place the following code where you want it to show up:

If you want to set the maximum size of the favatar icons, you can add parameters to the function:

<?php comment_favicon($before='Avatar'); ?>

Another method, suggested by John Serris, is to have the favatars load as CSS backgrounds. To do this, instead show the Favatar this way:

<?php comment_favicon($before=''); ?>

The primary benefit of this is that it allows JavaScript window.onload events to run before all favatars have finished loading.

Known bugs/conflicts

Ben points out that Favatars Revised might conflict with Subscribe To Comments 1.4.2. Upgrade to 1.4.4 and it should work fine.

4. Discussion

Technicalities aside, feel free to discuss or test favatars.

Oh, and did you know that the word avatar comes from Hindu mythology, and means “the descent of a deity to to earth in bodily form”?

Pings

Comments

  1. Joen: thanks. That’s why I’ve tweaked a bit my .htaccess and made PHP script to provide the animated GIF to Gecko based browers, and the plain favicon to the others. ;)

  2. Joen says:

    Mathieu,

    That?s why I?ve tweaked a bit my .htaccess and made PHP script to provide the animated GIF to Gecko based browers, and the plain favicon to the others. ;)

    I’d love if you could share your .htaccess secrets in a tutorial and pingback this article! Hint hint :)

  3. Dave Child says:

    Hi Joen,

    I don’t know if it would be of interest to you, but I’ve added favatars to my site (I much prefer them to gravatars, especially after reading your articles). I’ve added a live favatar preview to the comment previewing on my site as well, that you are very welcome to make use of if you like.

  4. Joen says:

    Dave,

    That’s damn nice! I AM interested…

    However, I’m so busy atm that I won’t be able to pick it up. Ideally someone else will pick it up and turn it into a plugin — here’s hoping.

    For now: wow! Good job!

  5. Richard W says:

    This plugin is the closest I have come to what I am looking for – but its still not what Im after? Though I did recommend it to a friend and she is loving it.

    I would love to have a “local” version of this where a person gets to choose say from a “folder of images” (gif, jpeg, ico) and thats their default image when they visit… …nothing from anyone elses server, all local – small images “attahced” to their WP profile and show up when they comment.

    The Gravitars and Avitars – but on ur home machine… …know of a plugin that can do that?

    Thanks!

    –Richard

  6. McShelby says:

    I guess Skippys Gravatars can also handle local avatars as so can mine Comvatars plugin:

    http://soeren-weber.net/post/2005/08/07/44/

  7. Blythe says:

    I’m having a hard time… half the time the favatars won’t automatically load and I have to run Favatise. It works sometimes, which confuses me. Other times, a commenter who’s previously had their favicon load successfully will end up with nothing. Any thoughts? I don’t really have any other comment-related plugins, so I’m not sure if there’s conflicts… (using WP 2.0)

  8. Pete Nawara says:

    How do you post your favicon?

  9. Joen says:

    Pete Nawara said:

    How do you post your favicon?

    Posting your favicon happens automatically on a WordPress weblog with the Favatar plugin installed.

    Of course you have to store the favicon on your own server, in your case, at http://www.petenawara.com/favicon.ico. When you type in your URL here, the Favatar plugin will automatically post the favicon for you.

    My favicon is located at http://www.noscope.com/favicon.ico

  10. touchan says:

    I prefer using Favatar ‘caz I can manage my resource. And I’m now tring to implement to my weblog, but I’m stuck. I think I placed my favicon at right directry(which is http://blog.camedo.com/favicon.ico), but it doesn’t favatize OK. still working what’s going on with the plug-in. Or maybe…I must be wrong.

    BTW WP-plugins.org is scrumbled right now? I can’t enter the site.

  11. GooL$ says:

    Thats cool…

    but what if you dont have website?

  12. Joen says:

    GooL$ said:

    Thats cool…
    but what if you dont have website?

    That’s the downside. Then you don’t have a favatar :(

  13. Michael says:

    In regards to Mobius’ problem, if he was downloading from http://dev.wp-plugins.org/wiki/favatars he might have downloaded the actual HTML page instead of the PHP file. I found that you have to click on the download link http://dev.wp-plugins.org/file/favatars/trunk/favatars.php which opens up a page where you can can cut and paste.

    Stupid me spent 30 minutes figuring that one out :) Works great though noscope, thank you.