Mark your website URL with a favicon

Have you ever noticed that when you look at your browser’s favorites menu or the address bar, some entries have their own little icon next to their URL?

It’s called “Favicon” (a graphic file with an .ico extension) and it’s located in the root directory of the website. Every time you bookmark a site that has its own favicon.ico file, it is added to your browser and from then on it will be visible in the favorites menu and in the address bar.

In the beginning only large websites had a favicon, but now you can create one too and use it to bookmark your website. The first thing you have to do is create your favicon. To be displayed by browsers, it must be 16×16 pixels in size. To create one, you can use a graphics program called Icon Forge (you can download a free trial version from CNET):

http://download.com.com/3000-2195-10128559.html

You can create an icon from scratch or import a 16×16 ‘.gif’ or ‘.jpg’ file and save it as an ‘.ico’ file.

Then you will have to save your icon with the default name of ‘favicon.ico’ and upload it to the root directory of your website (where your index page is). Finally, after that, you must associate your icon to your web page. To do this, include the following HTML code immediately after your page’s HEAD tag:

link REL = “DIRECT ACCESS ICON” HREF = “http://www.yourwebsite.com/favicon.ico”

Once you’ve done that, that’s it. To give it a try, go to their website and bookmark your page. You should be able to see the favicon next to the bookmarked page title. Also, the next time you type your URL in the address bar, you will see your favicon to the left of the URL.

(Favicons work with Internet Explorer 5 or newer, and with recent versions of Netscape.)

——-

You may freely reprint this article. Just include the following resource box at the end: