Как создать иконку в адресной строке - favicon.ico

Наверняка вы не раз замечали что у некоторых сайтов в адресной строке есть маленькая картинка. Она так же отображается в “Избранном” и в результатах поиска некоторых поисковых систем, например Яндекса.

Это пиктограмма, или иконка, сайта - favicon.ico

Favicon (сокр. от англ. FAVorites ICON — «значок для избранного», от названия папки с закладками в MSIE) — значок веб-сайта или веб-страницы. Отображается браузером в адресной строке перед URL страницы, а также в качестве картинки рядом с закладкой, в вкладках и в других элементах интерфейса. (Википендия)

Если у сайта нет своей иконки-пиктограммы, вместо нее отображается стандартный значок.

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

  • создайте файл картинки размером 16х16 пикселей, 256 цветов или TrueColor. Можно создать и картинку большего размера, главное чтобы она была квадратной, иначе при сжатии изображение деформируется.
  • сохраните ее в специальном формате .ico, например, воспользовавшись сервисом favicon.ru. Не пытайтесь создать иконку простым переименованием файла - из этого ничего не получится.
  • выложите ее в корневую директорию своего сайта
  • (этот пункт не обязателен) добавьте следующие строчки в код каждой страницы вашего сайта в head’e (обратите внимание на путь к картинке):
<link rel=”icon” href=”favicon.ico” type=”image/x-icon”>
<link rel=”shortcut icon” href=”favicon.ico” type=”image/x-icon”>

Браузер Internet Explorer отображает пиктограмму сайта только в закладках Избранное.

Можно создать и анимированую иконку -  favicon.gif, но ее будут отображать не все браузеры, и в результатах выдачи поисковиков она появляться не будет.

Теперь у вашего сайта будет своя уникальная пиктограмма, что сделает вам проект более стильным и профессиональным

Popularity: 3% [?]

Метки: , , ,

Оставить комментарий или два