If you’re anything like me, your web browser always has at least a half dozen tabs open. It should get confusing as you switch back and forth between all those tabs, but it doesn’t. Why? Because of FavIcons – those little images at the top of your Internet browser next to the website URL.
FavIcons are great for brand awareness and brand recognition. In a sea of open tabs, they allow users to recognize your website at a glance. So what exactly is a FavIcon? FavIcon stands for favorites icon and is a website or bookmark icon. A FavIcon is 16 pixels x 16 pixels and displays at the top of your Internet browser next to the website url.
In this example, I am going to create a FavIcon using the Hunt Creative Group logo.
Step 1: Get your logo.
The logo can be in a number of formats: .jpg, .gif, or.png.
[fancy_images width=”32 px” height=”32 px”]
Step 2: Create the FavIcon.
Go to Digital-Pic. Browse and find your logo. Then hit download FavIcon and save the FavIcon to your computer.
[fancy_images width=”600 px” height=”321 px”]
Step 3: Upload your FavIcon to your website and write down the location.
Step 4: Putting the FavIcon in the html code.
Put this line of code in the
<head> of your html file on the page or pages you wish for it to appear.
<link rel=”shortcut icon” type=”image/x-icon” href=”File Location/your favicon name.ico“>
If you are a WordPress user, you can go to the Appearance tab and click the Editor link. Find the Header template and look for the <head> tag.
Paste this <link rel=”shortcut icon” type=”image/x-icon” href=”File Location/your favicon name.ico“> before the head tag is closed </head>.
Easy, right? Four simple steps to help differentiate your website.