Favicon ikonka strony

Favicon to ta mała ikonka powiązana z witryną, wyświetlana na kartach przeglądarki, w zakładkach, w historii przeglądania, a coraz częściej także w wynikach wyszukiwania. Korzystnie jest dodać ikonkę bo to pozwala pokazać swoją markę, pozwala użytkownikom skojarzyć stronę z Tobą. Powiem więc prosto jak to zrobić.

Przygotuj obrazek w formacie kwadratu koniecznie! Przygotuj go w formacie wektorowym i oto dlaczego. Choć to na ekranie ma być wyświetlane więc pikselowo to ponieważ rożne przeglądarki potrzebują różnych wymiarów, a czytają wektorowy format SVG, to najlepiej skorzystać z tego formatu i wtedy same go przeskalują. Darmowy program do grafiki wektorowej Inkscape generuje dobre pliki SVG, moim zdaniem lepsze do przeglądarki niż duże, płatne programy graficzne.
To mamy nasz plik favicon.svg, ale to nie wszystko. Dobrze teraz go zapisać w formacie ICO, w formacie który pierwotnie wymyślono dla ikonek i może być dalej żądany przez starsze przeglądarki. Ta ikonka powinna mieć wymiary 48 x 48 pikseli i nazywać się favicon.ico. Są jeszcze specyficzni użytkownicy komputerów od Apple, dla nich potrzebny jeszcze jeden plik apple-touch-icon.png czyli w formacie PNG i w wielkości 180 x 180 pikseli
Gdy z grafiką zrobione, wrzucamy to do katalogu głównego. Można do jakiegoś katalogu na przykład. /images, ale niekiedy przeglądarki same szukają w katalogu głównym pliku favicon, więc ułatwmy im to. Teraz w kodzie strony w sekcji HEAD dodajemy taki kod:

I możemy się już cieszyć ikonką na swojej stronie internetowej.