A favicon, short for Favorite Icon, is a small icon or graphic that appears in a web browser's address bar and bookmarks to identify a web page. Typical favicons are representative of the logo or theme of the particular web page and help users easily recognize it in the list of open tabs or bookmarks. Typically, favicons are square and available in various formats such as ICO, PNG, GIF or JPEG.
How favicons work
The website owner creates a favicon and stores it in the root directory of the website or in the folder for resources such as images and scripts. When the web page loads, the browser retrieves this icon and displays it in the address bar and other relevant areas. The favicon is often inserted into the HTML code of a document in the form of a code snippet, usually in the area of the web page. An example of including a favicon in HTML code is:
This code points the browser to the favicon file, in this case a PNG file located in the root directory of the web page.
Importance of favicons
- Recognition value: A well-designed favicon complements the branding of a web page and helps users quickly recognize the associated web page in a list of bookmarks or open tabs.
- User Experience: By using a favicon, website owners can create a consistent and professional experience for their website visitors. It shows a certain level of detail and increases trust in the site.
- SEO Advantages: Although the favicon itself has no direct impact on search engine rankings, a user-friendly website that includes a favicon can contribute to a better user experience overall, which can ultimately have a positive impact on rankings.
Create a favicon
To create a favicon for a website, an image file (such as the logo) can be made into a square format with a resolution of 16×16, 32×32 or 64×64 pixels. Meanwhile, there are also numerous online tools and generators that help create a favicon in different formats and sizes to make it accessible to different browsers and devices.