How to add Shortcut Icon to a Web Page

December 05, 2011 // In: HTML

You can use Shortcut icons to Display your logo or some other graphics on the Internet Browser’s Favorite Menu (Bookmark Menu), Address bar, and Tab bars.
It has no specific requirement. You just have a small icon (.ico).

The method to add shortcut icon to 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.
Code:

<link rel=”shortcut icon” href=”http://www.yourwebsite.com/icon.ico/>

You can set the link of your icon inĀ  href attribute..
Example: Facebook.com

<link rel=”shortcut icon” href=”http://static.ak.fbcdn.net/rsrc.php/yi/r/q9U99v3_saj.ico/>

You can convert your logo, graphics image to icon by using any Image to Icon convertor. Online convertors are also available.
Here are two online convertors..

http://www.prodraw.net/favicon/index.php
http://www.rw-designer.com/image-to-icon

Simple Login Page using CSS and Jquery