Make Your Icon Appear in IE5

Create a custom icon to be displayed in your visitor's favorites list.


If you use Internet Explorer 5 or higher, you may have seen the little icons that appear next to bookmarked addresses. Likewise, if you copy the bookmarked link to your desktop, a larger version of that icon will appear. For an example of this icon trick, visit Leoville and choose Favorites, Add to Favorites. Then, select Leoville from the Favorites menu and you will see the tiny lion icon next to the URL. Remember that this will only work in Internet Explorer 5 or higher.

Anyone can create their own icon or "favicon." Here's how:

  1. Create an image that is 16 pixels by 16 pixels. Notice how small this is and how little can be represented. Use a couple of colors and a simple design for a more recognizable icon. A symbol or letter works best.

    If you don't have a graphics program, you can download Microangelo, an icon editor and creator. Read this article for more information, or visit to create your icon online using its Java icon generator. You design your image on a blown-up grid that you color square by square. Then minimize the image to see what it will look like. When you are done, the icon is emailed to you.

  2. Save the file as "favicon.ico," and upload it to the root directory of your website. This is the same place you would keep your index.html or default.html file.

You can also create special icons for different pages of your site. Let's say you have a special section on software. You could create a little CD or disk icon that appears only when that page is bookmarked. To reference this icon, place the following code between the <HEAD> and </HEAD> tags:

<LINK REL="SHORTCUT ICON" HREF="youricon.ico">

Use the full URL of the icon file if it does not live in the same directory as your HTML file.

Some Web hosting services might not support .ico files. If you're in doubt, be sure to ask your hosting service.

Home Information Page HTML Lessons Java Script Lessons