|
You are here: Digitope.com > Pixelshop > In Depth > Creating Favicons
How to make a favicon for your website
A Favicon (short for Favorites Icon) is a website con that’s displayed in your Favorites menu and also in the address bar of your web browser.
The most simple Favicon is a 16 x 16, 16 color icon. However, all the sizes and formats of a Windows icon are supported.
This topic describes how to set an existing icon as a favicon. To learn how to create the actual icon, please see one of the following topics:
How to convert an Adobe Illustrator Image with Pixelshop
An example of the Yahoo! Favicon, shown in the Address bar and on the Favorites menu.
Adding a Favicon to your website
To add a Favicon to your website, first create an icon it with Pixelshop, and save it as ‘favicon.ico’. Then, copy this to the root of your website (i.e. ‘http://www.mywebsite.com/favicon.ico’).
Some browsers automatically look in this location for an icon, however, you should also reference the icon in your home page. To do this, you must add the following line in the HEAD section of the webpage:
<link rel="SHORTCUT ICON" href="http://www.mywebsite.com/favicon.ico">
Below is a sample webpage that uses a favicon:
<html>
<head>
<title>Webpage Title </title>
<link rel="SHORTCUT ICON" href="http://www.mywebsite.com/favicon.ico">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
</body>
</html>
That’s it! Now, when your site is visited, users will see your logo in the address bar. Additionally, if they bookmark your website, they’re be able to easily pick your website out by it’s unique icon.
Back to top
|
