HTML Tutorial





Español Français 中文 Deutsch Portuguese Japanese nederlands
   
 
HTML Basic
Introduction
How To
HTML Tags
html, head, body
Text Manipulation
IMAGES
Special Effects
Using Tables
Forms
Other Topics
 

ADVANCED HTML
Introduction
Media
Meta Tag
Frame tags
Fieldset
Tooltip
DTD
Image tags
Subscript & Superscript
Bullet styles
Canvas
Other tags
Ask Your Doubts
More about HTML
Feedback
 

Address Bar Icon in HTML page


Tutorials Html

Topic

How to put an address bar icon on my website?
What is favicon and how can I add it?



Explanation

Favicon: Favorites Icon

Create a image with size 16X16 pixels and of format .ico, some browser can use .jpg or .gif formats too. Preferably create a .ico image.

We have used a gif [] as a favicon for this page.

Upload the image file in to your directory [preferably root dir].

Use the following html code inside the <head> tag of your web page.

Example 1: Using complete path
<head>
<link rel="shortcut icon" href="http://www.your-page-name.com/favicon.ico">
</head>
The link tag does the magic. Give the complete path of the uploaded image in href attribute.

Example 2: Using the path from the root dir
<head>
<link rel="shortcut icon" href="/images/h22.gif">
</head>
Here we use the path beginning from the root dir. i.e if the image or icon is present under xcvxcvxcv.com/images/... the path should begin from /images/....

The address bar image also called as favicon may not work properly in IE browsers. Test it with a browser like mozilla or firefox. Create your .jpg/.gif files, it can be converted to .ico using some free online utilities.
 



Other Links

web hosting