Discover the Importance of the Favicon and Check Its Availability on Your Website

page_watches 211575 page_stars
img-border What is a favicon

The classic icon is an ICO file of 16 × 16, with 16 or 24-bit color and transparency support and much later, it appeared in a 32 × 32 size, but older browsers still reduce it to 16 × 16.
Why do you need it now? Today, it is an important component of the website interface, which also plays an important role in advanced web applications.

 

What Is The Reason?

 

Obviously, it is much easier to look for the bookmark you need, because it is easier to look for a familiar icon than to read all of the website names. Thus, it has to improve the user experience. This is the main reason to use it. Today, you can find this popular component in all popular modern websites and browsers in its browsing tabs. Global companies have recognizable (popular) icons, which help them stand out from the crowd of other web resources (those are good favicon examples to look at). Without a doubt, it is a useful tool for sites of all kinds. It was created for a fast visual search of the necessary website among thousands of bookmarks on the Internet, which helps your target audience find you faster and simpler.

img-border
Displaying favicons in the browserimg-close

The website without personally-identifiable icon will go with the generic symbol of a browser, which means that it is a must-have for you if you care about your web resource branding.

 

How To Create A Website Favicon?

 

You can do it on your own or use help online. It is not necessary to use any special online generators to create one, although it is quite convenient and simple. Here are some examples of websites that can help:

As you see, you even do not need a graphic designer to make it. However, if you are planning to launch a global site and going to have worldwide branding, then probably you should better turn to a professional designer in order to create something unique and matching your brand. Nevertheless, if you are going to make it yourself, it can take about 10 minutes for a simple one – you only need to upload your website logo to one of the sites mentioned before and just download the ready file. It is just as easy!
Also, try these inspiring websites to find some exciting favicon ideas:

 

How To Add It To The Site?

 

Once you have a ready file, it won’t be too much of a deal to place it on the server. You will need first to get the access to text editing tool and the root folder on your website in order to be able to adjust the HTML code of your website. Below is a quick guide:
1. Upload the relevant file to your server. Then write your browser address bar to your FTP server. Press enter button, log in, and just upload the file to the root folder.
2. Now you should change HTML page of your website. Find and download “header.php” or “index.html” file from the server. If your site made with HTML plain, you should insert the code in the head area of the “index.html” file:

<link rel="shortcut icon" type="image/x-icon" href="http://yourwebsite.com/favicon.ico">

If you are working with WordPress, insert the code in the head area of the “header.php” file:

<link rel="shortcut icon" type="image/x-icon" href="<?php bloginfo('url') ?>/favicon.ico">

That is it! You will be surprised by how easy it really is.

 

Creating Icon In Photoshop

 

Photoshop is a great program for working with images! It is a useful tool that will help you out in many different situations and even allow you to create a custom website icon. If you are a designer, of course, it is the best variant to use Photoshop program, but if not we would recommend to use websites we mentioned before and save some time. The problem is that Photoshop does not support “ico” files. Therefore, you need to download and install its plugin from Telegraphics.

In selection menu, folder FILE, you should create a new file, with canvas 64×64 pixels (it is easier to work with the bigger size), paste your logo into the document, and make all the necessary changes.

After it, select IMAGE folder, go to IMAGE SIZE and change it to 16×16 pixels, and do not forget to make sure your icon does not blur by clicking on RESAMPLE IMAGE and BICUBIC SHARPER. When you are happy with the results, open FILE folder and press SAVE AS.

 

Conclusion

 

This component is a kind of visiting card, so it should be created in the same style as the site – the more the site and the icon have in common, the better. It has to be associated with the site – this is its main function. In addition, the icon should be relevant and clear: the user should immediately understand what is drawn on it, and it also has to be memorable.

Thus, a well-made icon will make your site look more professional. If you are serious about creating a personal brand, then you need to take a very serious approach to creating a favicon.

1 Star2 Stars3 Stars4 Stars5 Stars (12 votes, average: 5.00 out of 5)
Loading...

Interesting now

Google Cache: Practical Guide Of Its Usage

If you have heard about Google Cache but still don`t know to use it efficiently, this guide is totally for you. Here you will find a practical guide on how to view cached pages using Google Cache and

How to Conduct SEO Content Analysis Properly?

Every text on the web is created for some purpose. An effective text is the one that performs the necessary tasks. To achieve your goals, we recommend performing SEO content analysis at the several

E-commerce SEO: Best Practices for Your Store

E-commerce retailers are generally skeptical when they are told that they can double sales and traffic to their site by applying SEO best practices.

How to Use Meta Robots Tag Correctly?

Meta robots tags are used to pass instructions to search engines on how they should index or crawl sections of a website. This article gives an overview of the different values that can be used in a

What Is JSON-LD Markup and Why Is It Better than Schema Markup?

If you understand how to use schema.org, but do not dare to mark pages up because of the complexity of the process, this article is for you. There is an effective and easy-to-use alternative - the

Causes of Duplicate Content and How to Solve the Problem

All search engines, including Google, have problems with duplicate content. When the same content is shown at numerous locations on the internet, a search engine can’t determine which URL should be

Show more

sent-mail

The password link was sent to you by email

The password changed