Creating the Icon

Creating the Icon

1. Due to the constraints of web browsers, the website icon you choose to use must be a square and be exactly 16 pixels by 16 pixels. If the image you want to use as your icon is a different shape or a larger size, you can use an imaging program like Adobe Photoshop, Microsoft Paint or Apple Preview to crop and shrink it. Once you have created an appropriately sized icon, name the file "favicon" and save it as a .GIF or .PNG file.

Converting the Icon

2. Before you can change your website's icon to the image you have created, you must convert the .GIF or .PNG file to a .ICO file, which is a special file format for web icons. The easiest way to convert a web icon is to use the FavIcon Generator tool (see "Additional Resources," below). Simply use the online tool to navigate to your .GIF or .PNG image and then click on the "Create Icon" button. Save the .ICO file to your hard drive and then upload it to your active web server. Make sure that the file is named favicon.ico and is stored in the root level of your server

Setting the Website Icon

3. Once the favicon.ico file has been saved onto your web server, you can edit the pages of your website to set the image as your site's official icon. To do so, open one of your site's pages in a web-editing application like Adobe Dreamweaver, and insert your cursor inside of the "" tags at the top of your HTML code. Then type "" and save the code. The webpage will now be directed to use the new icon you have created, and it will be displayed in web browsers when others visit your site.