Favicon: How To Create A Favicon.ico
![]()
Personalise your site by creating your very own icon, removing the standard browser icon such as the I.E or Firefox logo. This will change the icon not only on the browser tabs but when a user adds your site to their favourites.
Step 1 – Design your icon
Simply design and image that you want to use (standard is 16 x 16 px).
Step 2 – Convert your image to a .ico file
Once you have created this icon simply convert this to an icon. There are a number of ways to do this. Download/Purchase software to create .ico files alternatively visit http://www.html-kit.com/favicon/ and create your own free icon by simply uploading your image and downloading.
Step 3 – Upload your logo
Once this has been done and you will need to put your favourite icon in the root of your website. e.g. www.mysite.com/favicon.ico make sure you keep the file name as “favicon.ico”.
Step 4 – Add the following code
In your webpage document simply add the following code anywhere within the <head> tags.
<link rel="shortcut icon" href="favicon.ico" mce_href="favicon.ico" />
or if you need it to work on a number of pages within folders simply link to the file direct.
<link rel="shortcut icon" href="http://www.zenduo.co.uk/favicon.ico" />
And its as simple as that!
Tags: tips and tricks, website design
This entry was posted on Wednesday, February 25th, 2009 at 8:26 pm and is filed under website design, Website Design Tools. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.