Learn Dreamweaver

Favicon HTML Code

by monstertutor

Branding plays a vital role in web design. Using favicon helps to established a good feel and brand of your website.

What is favicon?

html code to create favicon

A favicon literally means favorite icon. This icon is saved on your computer when you add websites to your favorites or bookmark. Nowadays, this also serves as the identity of a website in the smallest version.

Where can I get a favicon?

There are various favicon generator out there. I use www.html-kit.com/favicon/. It works perfectly by uploading an image or a graphic.

HTML Code for Favicon

Place the HTML code inside the <head></head> tag.

.ico favicon

<link rel="shortcut icon" href="favicon.ico" />

.gif favicon

<link rel="icon" type="image/gif" href="animated_favicon1.gif">

combination of .ico and .gif

<link rel="shortcut icon" href="favicon.ico">
<link rel="icon" type="image/gif" href="animated_favicon1.gif">

Common Problems

  • The URL of the .ico or .gif is wrong
  • The favicon have different file name
  • They are working on a wrong page
  • They do not refresh/clear cache the web page

Note: Favicon don’t work on IE 6. It works when you bookmark the site.

Related posts:

Use Jquery to Change CSS Class
Remove Form Header on Wufoo Form
CSS Styling element inside an iframe using javascript
How to enable HTML5 tags for Internet Explorer

Recommended Web Design Books!


Category: HTML
Tags: coding, favicon, tools


Special Offer! $8.99 .COMs or .Nets now at GoDaddy!