Exogens
О компании Контакты Клиенты Новости Форум

Иконки для сайта: favicon.ico & apple-touch-icon.png

2013.01.23
Favicon – сокращенно от английского FAVorites ICON — «значок для избранного». Это маленький значок, его еще многие называют иконкой сайта, отображается браузером в адресной строке перед адресом страницы, рядом с закладкой, во вкладках, в результатах поисковых систем, в том числе в контекстной рекламе, и пр.

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

Традиционно используются значки размером 16х16 в формате ICO. Для автоматического распознавания большинством браузеров такие значки следует помещать в корень сайта под именем favicon.ico. Сделать подобный значок можно самостоятельно в каком-либо специализированном редакторе, либо в Adobe Photoshop с установленным форматом ICO, либо воспользовавшись одним из многочисленных онлайн-сервисов, например favicon.ru. Сервис favicon.ru позволяет не только нарисовать значок, но и сделать его из любой картинки. Но на самом деле чтобы сделать хороший значок, надо рисовать и надо очень хорошо постараться, чтобы все уместить в 16х16 точек.

Но не все так просто. Помимо всего прочего еще есть Apple и iOS. Для них придется постараться, потому что у них все особенное, даже значки для сайтов. И даже если на сайте наличие таких значков не объявлено, то iКомпьютеры и прочая iТехника все равно пытается их найти, и при определенных настройках сервера или CMS в логах создается большое количество ненужных записей. К тому же обычно хочется, чтобы сайт выглядел одинаково презентабельно и полноценно везде.

Значки для iOS должны быть выполнены в формате PNG размером 57х57 точек. Варианта два:

Сначала запрашивается файл apple-touch-icon-precomposed.png, поэтому его и стоит готовить в первую очередь. На сайте Apple рекомендуют использовать подобную конструкцию для обозначения наличия подобных значков сайта:

<link rel="apple-touch-icon" href="touch-icon-iphone.png" />
<link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" />
<link rel="apple-touch-icon" sizes="114x114" href="touch-icon-iphone-retina.png" />
<link rel="apple-touch-icon" sizes="144x144" href="touch-icon-ipad-retina.png" />


На самом деле «рекомендовано» – не значит «надо». Вот что нашлось за 15 минут поисков:

Поэтому на данный момент рекомендуется остановиться на двух типах значков, которые можно сохраняться в корень сайта и даже не прописывать их в HTML-коде:


Следующий пост: Технический сбой (#85, 2013.04.01)
Предыдущий пост: Тренинг Философия женственности (#83, 2012.02.26)

Пост #84. Постоянная ссылка на пост: https://exogens.ru/blog/post/ikonki-dlya-sajta-favicon-ico-apple-touch-icon-png/

Закрыть

Отправка сообщения

Ваше имя
Компания
Контактный телефон
Электронная почта
Текст сообщения
Код подтверждения6 x 9=

Расскажите о нас!

Мы поддержим

Техподдержка | Контакты | Форум
О компании | Отзывы | Блог
Карта сайта | На главную

Мы предлагаем создание сайтов в Новосибирске под ключ на нашей CMS Ruen, их обслуживание и сопутствующие рекламные услуги.

Сайт работает на CMS RUEN

www.webmoney.ru

Блог

26Июнь
2017
Случайный эксперимент с аудиторией сайтов
31Март
2017
Показываем объявления Яндекс Директ
15Июнь
2016
Правильный адрес сайта
31Май
2016
Обновление нашего бесплатного инструмента
12Май
2016
Эксперимент по статистике сайта
18Март
2016
Создание и разработка сайтов
1Март
2016
Вход рубль, выход – два
18Февраль
2016
Мобильная версия по Яндексу vs. Pluso.ru
© Exogens, 2003-2018ИП Богданович К.П.   ИНН 540445113470   ОГРИП 305540427600039   WM аттестован   Политика конфиденциальности