Фавиконки — как правильно подключать?
Фавиконка (favicon) — это маленькая квадратная картинка, индивидуальная для каждого сайта, которая отображается, во вкладках браузеров и в выдаче яндекса. Расскажу, как ими правильно пользоваться)
По умолчанию такая картинка должна называться favicon.ico и располагаться в корне сайта. Если это условие выполнено, то в принципе можно ничего дополнительно не делать. Однако есть возможность явно задать фавиконку с помощью тега link. Прописывается в секции <head> вёрстки сайта:
<link rel="icon"
type="image/png"
href="http://example.com/myicon.png" />
Путь может быть как абсолютным (с указанием домена), так и относительным (просто путь к файлу). Самое главное, что такой способ позволяет расположить иконку в удобной для вас директории, а также назвать её так, как будет удобнее.
Итак, выше рассмотрены два варианта подключения иконок. Я советую пользоваться гибридным: он наиболее эффективен. Для этого нужно назвать файл favicon.ico и поместить его в корень сайта, но при этом также и прописать путь к нему в вёрстке:
<link rel="icon"
type="image/x-icon"
href="http://example.com/favicon.ico" />
Для чего это нужно: некоторые онлайн-сервисы могут не воспринимать тег с указанием иконки, вместо этого они будут пытаться найти её по стандартному пути. При этом будет хорошим тоном явно указать иконку в вёрстке, так как не исключено наличие парсеров, где иконка запрашивается именно через тег.
С помощью тега вы также сможете делать разные финты в строчке с вкладками в браузере. Например, выводить цифру с количеством новых уведомлений и тем самым привлекать внимание пользователя к вкладке именно с вашим сайтом. Или менять иконку, если на сайте пользователю поступило непрочитанное сообщение. Ставить разные иконки в зависимости от раздела сайта, на котором сейчас находится посетитель. Примеры подобных финтов можно посмотреть у яндекса и vk.
