Часы работы: 9.30 - 20.00
Все интересующие вопросы Вы можете задать по телефонам
Бриф на разработку сайта
+38 (044) 228-59-83
+38 (093) 541-76-76
создание сайтов

Зачем нужен Фавикон?

Зачем нужен Фавикон?
25 мая 2015 г.

Иногда даже самые маленькие детали на нашем сайте могут играть очень большую роль в дизайне и юзабилити. И как раз о такой маленькой детальке мы сегодня с вами и поговорим...
Что такое фавикон?


Favicon (от английского favorite icon - избранный значок) - это маленькая картинка, которая ассоциируется с определенным вебсайтом или страницей.
Она располагается в верхней вкладке браузера напротив названия сайта, который вы открыли. А также эта картинка отображается в закладках, если вы добавили сайт в избранное.


Зачем его нужно использовать?
Этот маленький значок, который, казалось бы, используется на сайтах в основном "для красоты" или чтобы просто не было пустого места в квадратике напротив названия сайта в браузере...


На самом деле он является одним из ключевых факторов формирования бренда вашего сайта. Фавикон должен отражать суть сайта и в то же время он должен быть запоминающимся и индивидуальным.


Фавикон должен экономить время вашего посетителя. Вы спросите: каким же образом он может экономить время?


Дело в том, что многие пользователи, пользуясь интернетом, часто открывают много вкладок одновременно. И когда на вкладках нет значка, а просто пустой квадратик, то очень велика вероятность того, что он никак не отличит ваш сайт и просто-напросто закроет его.


Поэтому всегда делайте так, чтобы вашему посетителю было удобно, чтобы ваш посетитель, даже если у него открыто много разных вкладок в браузере или же если у него много сайтов находится в закладках, чтобы он всегда легко мог найти ваш сайт среди "толпы" других сайтов.


Еще такой момент - когда человек ищет информацию в поисковике - он с большей вероятностью кликнет на ваш сайт, если там будет стоять фавикон, чем на сайт вашего конкурента без фавикона.


Визуальное восприятие играет огромную роль для человека. Когда мы заходим на какую-то вебстраницу, наш взгляд падает прежде всего на картинку, а потом уже на текст, который ее окружает.
То же самое, когда я, например, просматриваю закладки, чтобы найти нужный мне ресурс, мой взгляд прежде всего скользит по фавиконкам, и часто только этого бывает достаточно, чтобы найти то, что я искала. Реже - после того, как я найду нужную мне картинку, я присматриваюсь, что же там написано с ней рядом.
Таким образом, время моего поиска заметно сокращается.
На картинках, которые я разместила в этой статье, вы можете видеть наглядные примеры того, о чем я здесь пишу.
Если на вашем сайте нет фавикона, браузер просто будет показывать пустой квадратик. Если у вас в закладках есть достаточно много таких "безфавиконовых" сайтов, то поиск нужного вам ресурса может стать достаточно утомительной задачей - вам придется просмотреть их все, чтобы найти нужный сайт.


Где мне его взять?


Фавикон обычно - это картинка размером 16х16 пикселей с расширением .ico или .png
Вы можете сами нарисовать его и потом просто перевести в нужный формат с помощью специальных сервисов или использовать фотошоп.
Либо вы можете найти подходящую картинку на одном из сайтов с бесплатными иконками.
Здесь нужно учитывать пару моментов: чтобы ваш фавикон не был слишком пестрым и чтобы картинка смотрелась целостно (не состояла из каких-то отдельных частей, лучше, чтобы это был один объект) чтобы даже в таком маленьком размере было понятно, что там нарисовано.


Как поставить фавикон на сайт?
 

Если же у вас, к примеру, статический сайт, построенный на html, вам нужно залить картинку в папку с другими изображениями сайта, а затем добавить в ваши html документы такую строчку, расположив ее в теге head:


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


Это уже в зависимости от того, какой формат вы используете.
Если у вас сайт на MaxSite CMS - тут еще проще. Вам просто нужно добавить нужную картинку в папку images/favicons используемого вами шаблона. Только это должен быть формат png.
 

Выводы:
Выгоднее все-таки использовать фавикон, как в эстетических целях (маленькая аккуратная картинка радует глаз), так и в практических целях (и посетителям и вам самим будет намного удобнее с ним).