Home   About   Blog Post Archive   Link To Me   Contact Me
Learn How To Easily Create And Install Favicons To Websites
November 26, 2012

Learn How To Easily Create And Install Favicons To Websites
Image courtesy of FreeDigitalPhotos.net

A favicon is a small pic that shows up in a browser's address bar or next to a page's title on the tab for instance. A good pic to use as a favicon to one's website is a logo or pic associated with the specific website, I normally use my websites profile pics as favicons. For this website I have used the wizard from the banner as a favicon.

To create a favicon you need to convert the pic you want to use as a favicon into a 16x16 pixels .ico file. Before I knew how to convert a .jpg image into a .ico file I just tried to change the .jpg to .ico in Photoshop, which did not work. I then Googled a bit and found out that I had to use a special program or a favicon generator to be able to create a proper .ico file. Luckily in my search I came across two great websites which easily convert .jpg, and similar files, into .ico files. All that needs to be done to create a .ico file on those websites is to upload the image you want to use as a favicon and then press the "generate" button to create the .ico file - piece of cake. The websites I am talking about here are:

Iconverticons.com and Favicon.co.uk

After the .ico file is generated it needs to be uploaded to the web server and then installed in the website's HTML code between the <head></head> tags. The code lines I use to install favicons are:

<link rel="icon" href="http://mysite.com/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="http://www.mysite.com/favicon.ico" type="image/x-icon">

Of course "mysite.com" must be replaced with your website's URL.

To find your favicon's URL after it has been uploaded to the web server, simply replace "mysite.com" with your website's address and the favicon should appear. If it does not, double check that the name of the uploaded .ico file is the same as you have inserted in the HTML code and typed into the web browser's address bar. After the proper URL has been added to your website's HTML code and uploaded your favicon should appear, note though that sometimes it can take a few hours or even days before the favicon appear. But usually it shows up pretty quickly.

Good Luck. And please let me know in the comment section below how it goes or if you have any thoughts or questions. Thank you for visiting! :-)

Please feel free to like and share this post:
Read more about: Read more about:
How To Create RSS Feeds How To Create Forms Without Knowing PHP
How To Create RSS Feeds How To Create Forms Without Knowing PHP
Top of page