It seems that more web designers than not have given up on trying to make the favicon work for them. After more attempts than I can count, I have finally found the correct process and code to ensure that my favicon will appear consistently across browsers, and will not disappear intermittently from Internet Explorer.
Following is a quick tutorial that will simplify using a favicon on your sites.
1. Create the image you want to use for your favicon. This should be a square image that is larger than 16px square and can be a jpg, gif, png or bmp.
2. Use a favicon generator like this one offered at dynamicdrive.com to convert your favicon into the favicon.ico format you will need.
3. Insert the following code into the head area of your html.
<link rel=”icon” type=”image/gif” href=”/yourdir/filename.gif” /> <!–[if IE]> <link
rel=”shortcut icon” href=”/favicon.ico” type=”image/vnd.microsoft.icon” /> <![endif]–>
4. Replace /yourdir/filename.gif with the location of your original favicon (before conversion).
5. Save the favicon.ico that was created in the favicon generator to your root directory. This is very important; If it is not placed in the root directory, it will not work in all browsers.
And that is all there is to it. Good luck with your favicon.
Latest posts by Jennifer Smith (see all)
- Reinvent Your Photographs with the Pixel Is Data App - May 18, 2013
- Has the Digital Age Created a New Demand for Tangible Marketing? - May 14, 2013
- What Can Your Business Do With Vine? - April 2, 2013