Create A FavIcon
April 4, 2011 | Category: Tutorials | Tags: Photoshop | Leave A Comment
Have you ever seen the little icons appearing in the address bar at the top of your browser? Maybe you’ve seen it in your Favorites? Would you like to learn how to create one?
STEP ONE
First thing to do is design yourself an icon. The icon’s size must be 16×16 pixels. Since we’re working with such a small image, I like to zoom in to 1000% so I can see what I’m working with. I used the Pencil tool at 1px in size and created an icon that resembles my logo.
STEP TWO
Now save your icon by naming it favicon and make sure the format is set to .ico as seen below:
STEP THREE
The final step is to add the following in the head section of all your pages:
1 | <link rel="shortcut icon" type="image/ico" href="favicon.ico" /> |
Make sure the href defines the correct address to where you saved the image. So if you saved it in an images folder it would be:
1 | <link rel="shortcut icon" type="image/ico" href="images/favicon.ico" /> |
Did you like this?
Subscribe to our 
RSS Feed, join us on 
Facebook, follow us on 
Twitter or simply recommend us to friends!
You might also be interested in:
Resizing an image to a larger size isn't hard but ...
Sometimes the current size of an image isn't exact...
You've probably read through so many tutorials and...
