Как да направим и качим Favicon на сайт

Favicon съкратено от (Favorite icon) е малко изображение, най-често с размер 16x16 пиксела, което се добавя в уеб сайт и се показва в адресната лента, върху табовете, в списъка с отметки и в историята на браузъра.

Уеб дизайнерите могат да направят такава икона (Favicon), която да качат на уеб сайт по различни начини, след което тя ще бъде визуализирана от графичните уеб браузъри.

Какво е това Favicon?

Историята на Favicon е още през далечната 1999 г., когато Microsoft пуска Internet Explorer 5, който поддържа Favicon икона за първи път.

Първоначално иконата Favicon е файл с име favicon.ico, който се поставя в главната директория на сайт (например https://u-bg.blogspot.com/favicon.iso).

Всички модерни браузъри имат способността да визуализират файла favicon.ico. Повечето от тях поддържат и favicon в други графични формати, като PNG например.

Как да направим Favicon?

Favicon.cc е един страхотен сайт, с чиято помощ можете да създадете Favicon за вашия сайт. За да започнете трябва да кликнете на Import Image и изберете подходящо изображение, желателно е да e квадратно.

Изберете подходяща картинка с добре подбрани елементи и цветове, като имате предвид, че когато завършите проекта си полученият Favicon ще е с размери едва 16 x16 пиксела.

Как да направим Favicon?

Не се притеснявайте да експериментирате, платформата Favico.cc е безплатна и без ограничения. Ако не можете да направите изображението квадратно това не е проблем защото още с качването на платформата имате опция да се запази съотношението на страните и излишното да се изреже или снимката да се свие без да се изрязва.

Поддържаните формати са ICO, JPG, JPEG, GIF, PNG, BMP, а максималния размер за файл е 5 MB. Когато изображението е качено ще ви се отвори страницата с инструменти за допълнителни корекции. В горната част е полето за редакция на изображението, а по-долу в малкия прозорец Previewвиждате Favicon в реалния си размер.

В дясно е палитрата за избор на цвят и инструментите, с които да редактирате вашия проект. С инструмента Transparentправите квадратчето, което докоснете прозрачно. С инструмента Pick existing colorможете да вземете съществуващ цвят, а с Moveда преместите избраното квадратче на място по желание.

Когато приключите с редакцията, в прозореца „Preview“ кликнете върху линка Download Faviconза да свалите вашия Favicon.

Сайта Favicon.cc разполага и с база данни, в която потребителите са качили огромен брой разнообразни Favicon. Можете да изберете готов Favicon от менюто в ляво, като кликнете на Latest Favicons“, „Top Rated Faviconsили да потърсите в полето Search“.

Как да качим Favicon на сайт?

Обикновено Favicon трябва да е с име favicon.ico и се поставя в основната директория на вашия сайт (например https://u-bg.blogspot.bg/favicon.ico). Това означава че за един сайт може да има само един Favicon.

След като качите файла favicon.ico в основната директория на сайта, вашия браузър трябва да започне веднага да го показва в адресната лента, табовете, отметките и др.

Как да качим Favicon на сайт?

Ако избраният Favicon не ви харесва или поради някаква причина го смените, трябва да изтриете кеша на браузъра и да презаредите страницата за да се визуализира новия.

Ако вашия Favicon не се показва в браузъра има и друг начин да го добавите. Качете избрания Favion където и да е, например в папка images/favicon.ico. След което добавете следния код в страницата, която искате да се визуализира между <head> таговете:

<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon" />

Този подход е много подходящ ако искате избрания Favicon да се показва само за избрана страница от сайта. Ако използвате тази възможност не забравяйте да добавите резервен Favicon в основната директория на вашия уеб сайт, като резервен вариант за ситуации, когато разглеждате съдържание, което не съдържа HTML код, като PDF файл например.

Добавянето на Favicon икона е толкова лесно и бързо, че нямате извинение да не го направите. Favicon-ните са важни за утвърждаването на вашия уеб сайт, разпознаването на вашата марка и дори в процеса по SEO оптимизация.

Надяваме се че тази статия е изяснила мистерията за тези малки и специфични икони и ви е помогнала да създадете и добавите свой Favicon на вашия уеб сайт. Ако сте срещнали сайт със забавен, интересен или много стилен Favicon можете да споделите вашия коментар под статията.

Публикуване на коментар

0 Коментари