Мультиразмерные favicon


Важный элемент дизайна любого интернет-проекта, его визитная карточка – фавыконка сайта (англ. favicon, сокращение от FAVorites ICON – «значок для избранного»). Она выделяет ваш сайт среди множества других, делает его обаз ярче и заметнее в результатах поиска, в закладках и на вкладке браузера, среди других открытых Интернет-страниц. Посетители запомнят ваш сайт и станут узнавать среди множества других ресурсов.

Как известно, операционная система, будь то Windows, Mac OS или iOS, может автоматически выбирать из пакета мультиразмерной фавыконки значки, наиболее подходящие, по размеру и глубине цвета, индивидуально для каждого приложения. Обычный, стандартный набор размеров фавикон: 16x16, 32x32, 48x48 пикселей. Самая маленькая – показывается в адресной строке браузера (перед URL открытой страницы), в менеджере файлов, в поисковиках (рядом с адресом сайта), а большие – нужны для десктопа (размещение пиктограмм на рабочем столе, в различных приложениях и элементах управления). Желательно, при этом, не выходить за пределы оптимального "общего веса" файла (в килобайтах), для быстрой загрузки Интернет-страницы, особенно, в мобильных устройствах с беспроводной связью (в телефонах, смартфонах, айфонах и планшетниках). Анимированные фавыконки – создаются в gif-формате. При изготовлении уменьшенных картинок, обычно, требуется их попиксельное редактирование в графическом редакторе и точная отрисовка вручную.

До недавнего времени, фавыконки-ярлычки делали в виде единственной картинки, размером 16x16 (это было связано с ограничениями в старых браузерах IE), что уменьшало детальность, визуальную информативность изображения.

Теперь, современная мультиразмерная иконка сайта (multiple icons), в виде пакетного файла favicon.ico – содержит в себе пакет из нескольких вариантов изображения логотипа. При создании фавыкон, за основу берётся самое крупное изображение с максимальной детальностью графических элементов картинки. Создаваемые из него миниатюрные варианты значка иконки перерисовываются для лучшего их зрительного восприятия, при малых размерах, и помещаются в пакетный файл (с помощью специальной программы). Операционная система, при открытии Интернет-сайта – автоматически выбирает картинки из пакета favicon.ico необходимые, для каждого конкретного приложения. Способы загрузки и настройки метатегов в html-коде www-страниц – зависят от типа движка CMS (Joomla, WordPress, UMI, MODx, Ucoz и другие). Если файл имеет стандартное название, то и без добавления в хидер тегов "shortcut icon", система найдёт и считает фавыкон в корневом каталоге сайта (если он там размещён).

Если после обновления значка на сайте, новая иконка так и не появилась в браузере, в этом случае – нужно почистить кэш и перезагрузить страницу.

Ваша иконка появится в поисковике Яндекса только после того, как её найдёт специальный индексирующий робот (сокр. "бот") поисковой системы Яндекса и поместит в базу значков, которая периодически обновляется. Адрес "по умолчанию" – в корневом каталоге сайта, например
http://www.web-site.ru/favicon.ico

Если фавыконка произвольной формы (не квадратная), то устанавливается прозрачный фон.
favicon.ico - мультиразмерная  иконка сайта (multiple icons), с размерами картинки - 16, 32 и 48
Открыв страничку с примером мультиразмерной портретной favicon, вы можете сохранить эту страницу в закладки браузера, разместить пиктограмму на Рабочем столе и поставить в Проводнике. Вы увидите, что появятся картинки разных размеров (различить их можно по детальности отрисовки, пропорциям и цветовой гамме, как это и показано на рисунке). Все они находятся в одном пакетном файле, с именем и расширением - favicon.ico (скачать, тестировать), из которого их извлекает операционная система. На существующих, сейчас, бесплатных онлайн-сервисах по созданию, генерации иконок, конвертации ico из исходных изображений, обычно, нет возможности сделать пакетный фавыкон и отредактировать иконку по пикселям, с сохранением файла в нужной цветовой палитре.





© A290.RU