(416) 421-3178
In this article, we describe what a favicon is, and we teach you how to create a favicon and how to add a favicon to your website.
What is a Favicon?
A favicon is a web development term that is a combination of the words “favorites” and “icon.” Webmasters add a custom favicon image to their websites that will display in the favorites menu and address line of a visitor’s browser. Google Chrome, Internet Explorer, Mozilla Firefox, Safari and most browsers allow for the display of these tiny, but unique, images.
How is a Favicon Used?
The purpose of the favicon is to further identify and brand the website to the site visitor. It serves as an image-based reminder or mini-logo of the site so the visitor can quickly return to the site through their favorites menu or browser history. A favicon is also another way for web developers to customize the look and feel of their website through the visitor’s browser. Most favicon images reflect the colors or appearance of the site logo, theme or subject matter.
How is a Favicon Created?
It is easy to create a favicon. All you need is a graphics program, such as Paint or Adobe PhotoShop. A favicon is an image that is limited to exactly 16 pixels by 16 pixels. The file extension for a favicon is .ico, an extension that you won’t see as a standard option with most graphics creation software. In order to get the .ico extension that is required for display, you need to create the image first as a .gif, .bmp or .jpg file and then rename it on your computer as “favicon.ico” (make sure it uses the .ico extension).
How is a Favicon Added?
To add a favicon to your web page, all you need to do is add the following snippet of code in between the two Head tags on your website and upload the favicon image to your server. For example:
<head>
...
<link rel="shortcut icon" href="http://example.com/favicon.ico" />
...
</head>
That’s it, it’s that simple.