Favicon Ico

Favicon Ico

What is Favicon.ico

What is Favicon.ico and how to create a Favicon Icon for your website? Many web browsers have a facility where, if someone bookmarks your website (ie puts it in their “Favorites” menu), it associates a particular icon with your website in the bookmark.

It tries to obtain that icon by first requesting for “favicon.ico” from the directory of your web page. If it cannot find such a file, it will try to obtain it from the root directory of your website, failing which, it will simply use a default icon for the bookmark.

Favorites Menu

On the other hand, the favicon.ico file is available, the icon will also be displayed beside your website name in the “Favorites” menu, the location bar in IE, and if the user opens up the “Favorites” folder, it will be the icon used for the link to your site.

Most, if not all, modern browsers also have the ability to use the favicon.ico file. In fact, many of them also accept the file in other graphics formats, such as the PNG format. These browsers display the “favicon.ico” in the location bar of the browser (the part that shows your website’s address or URL).

A nice favicon.ico help people to find your brand and bookmark. Make sure you also have the favicon available for mobile devices.

Helping the Browser Locate the favicon.ico file

If you have placed your favicon.ico file in a location other than the current web directory (relative to your web page) or the root directory, you have to help your visitors’ browser locate the favicon file by specifying it with a tag like the following in the section of your web page.

Look at this example, specifically on line 8.

How to Create a "Favicon.ico" File

  1. Create an image 16X16 pixels in size.

    Yes, it is really small and you can’t really draw much in it. You should also restrict yourself to the standard Windows 16 colours, although I suspect that 256 colours will work fine.

    If you like, you can also create a 32X32 pixel icon, which will be scaled to size for the Favorites menu and the location bar. You can even put both 16X16 and 32X32 pixel icons into the same icon file. Windows will use the former for its menus and the latter when the user opens up a folder that is set to display large icons. It’s probably not really necessary to do this if you can’t be bothered. 

  2. Save the image as an ICO file (named “favicon.ico”, of course).
  3. Upload it to your website.

    You don’t need to upload one to every directory of your site if you don’t want to waste space — simply put it in your root directory and the web browsers that support favicons will apparently locate it eventually. You can also upload it into your images directory, but you will need to modify your web pages if you do. See later in this article for more information on this.

Affordable & Effective

We offer affordable SEO services that are fast and effective.

Need some professional
SEO help?

Contact our Customer Service representative to make an appointment and to answer all your questions!

SEO & Online Marketing blog

Budget-Friendly SEO Tips for Independent Graphic Designers

Budget-Friendly SEO Tips for Independent Graphic Designers

https://pixabay.com/vectors/seo-online-analysis-1327870/ If you are an independent graphic designer looking to draw more eyeballs to your dynamic creations online without stretching…
Services to Expect From an SEO Partner

Services to Expect From an SEO Partner

It’s high time for business leaders to accept that they can no longer manage their own company’s SEO in house.…
Mastering Digital Marketing: 5 Steps Students Need to Take

Mastering Digital Marketing: 5 Steps Students Need to Take

https://unsplash.com/photos/gxD8hCmi0IQ In the era of digitalization, a strong understanding and mastery of digital marketing is becoming a vital skill set,…