Favicon – это, по большому счету, обычный графический файл размером 16 на 16 пикселей и имеющий расширение .ico (favicon.ico). Получить данную иконку можно из любого стандартного формата (jpg, png, gif) путем обычного переименования, либо на специализированных online сервисах. Favicon (фавикон) отображается в закладке браузера, слева от названия сайта.
Секреты: если вы хотите чтобы фавикон наследовал фон закладки браузера, вам необходимо подготовить исходный файл на прозрачном фоне в формате png или gif. Это позволяет сделать красивые закругленные края или эффект объема. Если иконка будет представлять собой заливку цвета, то достаточно будет jpg. В нашем случае для сайта websmart.by используется заливка черного цвета.
Некоторый поисковые системы (например, Яндекс и Tut.by) могут использовать favicon для оформления поисковой выдачи. Согласитесь, выглядит красивее, чем обычная текстовая выдача.
Применяться favicon он может для любых типов сайтов: одностраничный, html без движка, с движком (joomla,wordpress, bitrix) и др.
Однако создать файла favicon – это только полдела, необходимо вставить специальный тег в код сайта, чтобы браузеры и поисковики его правильного воспринимали.
Некоторые CMS позволяют вставлять favicon при помощи плагинов или настроек шаблонов. Если вам с этим трудно разобраться, то есть универсальные методы по внедрению иконки прямо в исходный код. Располагаться специальный тег должен в пределах тегов <head>…</head>.
<head>
<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon">
</head>
Иконка на хостинге может находится где угодно. С помощью пути href="/…" Вы можете подключить ее из любой папки вашего сайта.
Помимо этого сейчас не обязательно сохранять файл в расширение .ico, современные браузеры будут поддерживать файлы .gif и .png. Только не забывайте при вставке кода в тегах изменить расширение файла на загружаемое.