How to make favicon with your own hands?
Favicon A site without a favicon, like a ship without a flag. Favicon is an integral part of a site’s brand, its image and identification. By the way, look at the search results of some search engine (for example, Yandex). You will definitely find favicon next to the titles of the pages and documents found. Those. favicon, it is also a factor that increases the clickability of your site in search results. Therefore, without favicon anywhere!
How to make a favicon? The process can be conditionally divided into 2 stages:
Making a favicon or finding a finished one;
Installing it on the site.
To the first task, as was indicated, there can be several approaches. If for some reason you do not want to make favicon yourself, you are too lazy, have no time or do not know how, but have no desire to try and experiment, it can be found on one of the ready-made favicon library sites. The main drawback of this option is that it is unlikely that your icon will be original. Most likely it is already being used on dozens, or even hundreds or thousands of sites. Therefore, in this case, the urgent question is: “Do I need such a favicon at all?” For me, this element must be unique, even if it is as simple as “3 kopecks”.
Therefore, I better refused this option and made the favicon with my own hands. Let’s dwell on this process in more detail. In the course of work, you can use:
You can start making a favicon in the desktop program or using a special service. In the first case, it is not necessary to resort to the help of a desktop application (for example, Photoshop), you can use a free online raster graphics editor. All you need to do is create a 16×16 pixel document and portray something on this “canvas”. Fill the background, try to draw something with a “pencil” or put some character or letter.
The screenshot shows an example of a “masterpiece”, which I began to depict using the Pixlr service:
Pixlr creating favion
The result can be saved in the “.gif” or “.png” format.
ONLINE SERVICE FAVICON.CC
For me, using a graphical editor as a tool is the most organic option, but it is not the only one, because there are special web projects with which you can draw favicons. An example is the site Favicon.cc, which allows you to create an icon by pixels:
This is just one example, in fact there are a lot of sites – favicon online creation services – free, with different functionality and for every taste.
ONLINE FAVICON GENERATORS
Another solution to the problem is web services that automatically generate a picture. For example, the project Logaster.
Since the site was originally focused on the development of logos, you will first have to start with it. Then a special tool will pick up different favicon options for your case. The editor allows you to change the appearance of picture objects, texts and design. Read more about this in the article about creating a favicon in Logaster. Note is useful for beginners, if it is difficult to understand right away.
Whichever option you choose, creating a favicon is not very difficult and interesting. Installation also does not cause problems. After you save the finished icon on your computer, you can convert it to the “.ico” format, or use the “.gif” or “.png” files. There will be no fundamental difference, almost any option can be further animated if desired. The last thing left is to fill in the favicon in the “root” of the site (with the name favicon) and add a code fragment to the head section:
<link rel = “shortcut icon” href = “Icon_path / favicon.ico” type = “image / ico” />
<link rel = “icon” href = “Icon_path / favicon.ico” type = “image / x-icon” />
(If you have a favicon of a format other than “.ico”, you need to specify the desired file type)
On this process, the creation and installation of the favicon can be considered complete. If you need some additional information on the icons, then you can look at my article 2 years ago in another blog – all about favicon.ico icons – most of the data there is still relevant.
P.S. The guard. We read and watch about retro-style Web design – an interesting article!
An important step in the promotion is the search engine optimization of a site or blog.
Useful online handmade magazine – all that is done by yourself.