Thursday, May 7, 2009

How to Add a Shortcut Icon to a Web Page

Have you ever noticed that when you visit some web site, there is an icon small (little) image that shows (appears) at the top of your browser?

If you have, today you are going to learn how to install an icon picture for your web site, so when users visit your website, you can put your logo. Even better when a visitor bookmarks your url, the browser automatically saves in their favorites to identify your site.

How To Put An Icon On Your Browser URL Address Bar favicon.ico

post picture

Here is how to do this :

Creating Icons in the Correct Size and Format

A shortcut icon for Internet Explorer must be square in size, and at least 16 x 16 pixels. Consider creating both a 16 x 16-pixel icon as well as a 32 x 32-pixel icon (and larger, bandwidth permitting), since on high-DPI displays, Internet Explorer may stretch the icon to fit the available space.

To create the icon, use an icon editor, such as the one included in Microsoft Visual Studio, and save the icon in the .ico file format. Internet Explorer will ignore icons that are not in .ico format, and will instead display the default Internet Explorer shortcut icon.
Associating the Shortcut Icon with Your Web Page

After creating the icon, you must associate it with your Web page. There are two methods for doing this.

The first method is to save the icon with the default file name of favicon.ico to the root directory of your domain—for example, The first time a user visits your Web page, Internet Explorer automatically searches for this file and places the icon in the address bar, next to all favorites linking to your site, and on page tabs. In Internet Explorer 5 and Internet Explorer 6, the icon will appears only after a user adds the site to the Favorites menu.

The second method for associating a shortcut icon with your Web page is to add a line of HTML code to the page's head element. The line of code includes a link tag that specifies the location and name of the icon file. You can include this link tag on a per-page basis. First, save the icon with a file name other than favicon.ico, and then add the following code to the head element of your page.

<link rel="SHORTCUT ICON" href=""/>
<title>My Title</title>

Related Posts by Categories

Widget by Hoctro | Jack Book


Post a Comment


©2009 daily news | by TNB