Creating a Favicon for your blog in less than 5 minutes [Blog Design]

by Ashwin on March 22, 2009

What is a favicon?

As Wikipedia puts it,

A favicon (short for favorites icon), also known as a website icon, shortcut icon,url icon, or bookmark icon is a 16×16 pixel square icon associated with a particular website or webpage

In short, a favicon is something that you see on the title bar, at the left corner of a webpage or a website that you visit.

Here is how the favicon of a page in Google looks, in case you haven’t seen this before.


Why do I need it for my Blog?

Once your Blog starts growing, many people might like to bookmark your blog home page or a specific post, on their favorite browser.   When they do this, the “favicon” will help to distinguish and uniquely identify your content from the rest.

Here is an example that shows, how a favicon might distinguish various bookmarks that are grouped together.


How to Create and Install a favicon?

If you are convinced that a favicon might be good for your blog or a website, then I am going to show you how to create one for “free” and install it.

There are many websites that let you create a favicon from scratch and download the “favicon.ico” file that can be installed on your website.  And, this is one of my favorites:favicon_3

Here is another site that allows you to Upload an image file of your choice and convert it into a 16 x 16,  “.ico” file –

Once you have created a favicon of your choice, follow these simple steps to install it on your website:

  • Upload the “favicon.ico” file to the root of your website using any FTP tool.  For example, if your site is hosted at, upload it directly under the public_html folder
  • Make sure it is uploaded by accessing it at
  • Insert the following HTML snippet inside the tag of your web pages
  • If you are trying to install the favicon on your Wordpress blog, make sure to add the HTML snippet in the header.php file, under the tag
  • You are done!!!

Note that it may take sometime for the favicon to appear in your Browser.  Sometimes you may have to clear the cache or wait a little longer.

Spice up your Website or Blog with a favicon and let me know how it goes…

Related posts:

  1. Create a Contact Form for your Blog in minutes using Wufoo
  2. Setup Google AdSense for Search for your site in 5 minutes [Blogging]
  3. Write Pretty Code snippets in your Blog with SyntaxHighlighter WP plugin [Blogging Tips]
  4. Mobilizing your Wordpress Blog
  5. Everything you wanted to know about XML Sitemaps [SEO Tips]

Learn Blogging Success from the likes of Darren Rowse, Brian Clark and many other Bloggers. Grab your copy of Beyond Blogging here

  • Subscribe
  • Print This
  • Digg
  • Peter Fletcher
    Thanks for a simple but very effective tutorial. You've made my day. I almost freaked out when it didn't show up immediately so I read your post again, rebooted my browser and it worked a treat.

    Thanks heaps.
  • Hi Peter,

    Great to know that you found this useful. Thanks for taking time to provide a feed. Keep reading :)

blog comments powered by Disqus

Previous post: Freelance and Guest Writing Opportunities for those Tech Savvy [Blogging]

Next post: Send mails in Indian Languages using "Gmail"