Apart from  aesthetic values, I think it is very important to have a good favicon.  Why?  Because it helps develop your brand:

• With many browsers (such as Internet Explorer and Firefox) the favicons appear in the tabs, so you can more easily locate sites with recognisable favicons
• They also appear next to the links on booksmarks (including online books marks)
• Apparently links with recognisable favicons get clicked more often

Creating a favicon

A favicon is 16 pixels wide so its design has to be simple to stand out.  Complex logos don’t work.  There are sites where you can upload an image (such as your regular logo) and it will turn it into a favicon for you.  However these  often turn out blurry.  I think the best favicon creation sites are those which allow you to adapt the image, or to create one from scratch.

The site I used to create the S favicon for this site was www.favicon.cc.  This gives you a palette with the 16 x 16 canvas and a colour generator to paint with (see the picture above).

It took quite a bit of messing around to get the S favicon.  I initially made the whole square dark blue.  Colours have numbers when you are creating them on the web, and the number for the dark blue surround I use is #171D86.  White is #ffffff.  I then did quite a few different combinations of the letters SOLB or SOB or SB, none of which really  worked.  I finally put a white border just inside the square and put in the one S which looked much better.

I also created a suitcase favicon for my Lodger Landlord site – it is more of a gladstone bag look than the ‘proper’ case logo, but I think it looks quite nice.  It seems to stand out quite nicely too.

Putting them on your site

If you use the Headway theme, as I do, you can add it to the Headway Configuration page (load the favicon up to the media library and then use the link you will find there).  However I prefer the MaxBlogPress Favicon plugin.

Its a bit of a faff, as its not one you can upload from the wordpress plugins page. You have to download the file from the MaxBlogPress Favicon plugin page, and then upload the php file (no, I don’t really know what that means either) directly to the server. It goes in the wp-content/plugins folder. You can do this by fpt, or I use the file manager facility provided by my ISP Ecowebhosting.  Then, after you have activated it, you need to tell it where to find the favicon to display, in the special admin area. NB If you find it stops your site showing, go to the advanced options section and click the other radio button.

You have to register with MaxBlogPress which means you get put on the mailing list, but its worth it as it is a superior plugin. I like it because you get the icon on the bookmark for the admin area as well as for the site itself, which helps me (as I have quite a few blogs now, and I put them all in the same bookmarks section).

So there you are.  If you want to read more about favicons online, see the post on Blogussion here, and the links that they give.

What do you think about favicons? Have you ever noticed them? If you decide to add a favicon to your site as a result of this post, please let me know how you got on!

Like

Unlike