Creating a Favicon

by on Jan 7, 2009

There are probably still many of you who do not know what that icon is next to the URL in the address bar of your browser for many popular sites, and like the one we have here on drivelocity.com.

Follow these simple instructions to create one for your web site:

  1. Create a 16×16 pixel image
  2. Save it as “favicon.gif”
  3. Upload it to your site’s root directory
  4. Rename it “favicon.ico”
  5. Add the following code to your site’s header (before </head>)

<link rel=”shortcut icon” href=”favicon.ico” ></link>

Please note that Internet Explorer is not as reliable about displaying the Favicon as Firefox is… If using IE, you may need to save your site to your Favorites for it to show up.

Here are some resources that can help you create your own Favicon and test to see if it is valid.

  • http://www.blueunplugged.com/c.aspx?c=47019 brooks

    Thanks buddy for putting in the simplest way to have a favicon in website or blog.

  • http://coyotemercury.com/blog1 James

    I’ve been wondering how to do this. I’ll have to give a go.

  • http://drivelocity.com drivelocity

    Glad I could help! Thanks for the comments brooks & James! :)

    Incidentally, I came across the following site that has a gallery of 15,000+ Favicons…

    http://blog.econsultant.com/favicon-gallery-index

  • http://coyotemercury.com/blog1/2009/01/08/meanwhile-on-other-blogs/ Meanwhile on Other Blogs… | Coyote Mercury

    [...] Today, learned from drivelocity how to put a favicon on my site. [...]

  • http://www.sonicshack.com/ design your own t shirt

    firstly i was shocked that what is this?? then i come to know that its a new favicon of google.