Recently I received this response from a client. He is right, favicon is a ridiculous word. But it is an important little detail you need for your website so let’s figure out what it is.
A favicon is little square image associated with your website. It helps users identify your website from the mirade of browser tabs they have open and should be consistent with your company’s brand. Web browsers display these images to the left of the address bar. Visitors also see the image when adding your site to their favorites list on desktop and mobile. Without a favicon attached to your website, visitors see a generic browser icon when interacting with your site.
Example of three popular website favicons
Why is it called a favicon?
Now that you know what it is, let’s get back to the idea that this little icon has a ridiculous name. I did a little research and found that favicon is a portamentau, or a blend of words that makes a new word. Favicon comes from a blend of the words “favorites” and “icon” and came into existence when Microsoft’s Internet Explorer 5 added the ability to show icons in it’s favorites lists.
How do I get one?
Don’t overlook the importance of this detail. Visit your website to see if you have a favicon in the browser tab that clearly represents your brand. If not, creating one is easy using one of the many online generators. A couple of my favorite generators are: Favicon-Generator.org or FaviconGenerator.com.
Once you have generated the file you need to attach it to your website so browsers can locate it when a visitor views your website.
WordPress 4.3 or higher
Set the Site Icon in Appearances -> Customize and click on the Site Identity tab. Upload your favicon using the select file button.
HTML website
Upload your icon file to the root of your web server. Most modern browsers are smart enough to find the favicon if you have followed these three simple rules:
- The icon is 16 x 16 pixels.
- It’s name is “favicon.ico”.
- It exists in the root folder of your website.
Details matter!
In a world where people spend seconds deciding which company to work with, looking professional by paying attention to the little details sets your site apart from the rest. Get yourself a ridiculous little favicon today!