Фавикон - это маленькая иконка рядом с названием сайта (точнее title) в браузере.

Вот, например, сайт http://cancerchallenge.ru/ про онкологию. Мы видим



Как там оказалась медицинская картинка, как она туда попала? Это такой специальный файл favicon.ico для хранения иконки сайта.
Что бы браузер ее показал, необходимо:

1. Формат файла ICO/png/gif
да - там может быть и анимированная картинка gif

2. Картинка должна быть физически на сайте:

2.1 Расположение в корне сайта (в 90% случаев это понимают браузеры и поисковые машины для файла favicon.ico)

2.2 Указание фавикона через настройки темы в CMS

2.3 Явное указание расположения файла фавикона (или не корневая директория или не ICO)
      внутри тэгов head вида 

- для ico

<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon">

- для png/gif

<link rel="shortcut icon" href="/images/favicon.png" type="image/png">
<link rel="shortcut icon" href="/images/favicon.gif" type="image/gif">

Конечно, браузеры немного по разному видят эту иконку

Браузер ICO PNG GIF Анимированный GIF JPEG APNG SVG
Google Chrome Да 4.0 4.0 Нет 4.0 Нет Нет
Internet Explorer 5.0 11.0 11.0 Нет Нет Нет Нет
Firefox 1.0 1.0 1.0 Да Да 3.0 Нет
Opera 7.0 7.0 7.0 7.0 7.0 9.5 9.6
Safari Да 4.0 4.0 Нет 4.0 Нет Нет


Можно указать несколько изображений в разных форматах — например, строку с rel="shortcut icon" и значком в формате ICO для Internet Explorer, и строку с rel="icon" и значком в формате GIF или PNG для остальных браузеров.

Базовый размер фавикона - 16х16 пиксель.
Но формат ico поддерживает хранение нескольких изображений. Зачем?
Что бы можно было сохранять ссылку на сайт себе на компьютер!

Если делать совсем правильно - в файле ico должно храниться 3 картинки:

формат 16х16 - для отображения иконки в браузере
формат 32*32 - для сохранения ссылки на сайт в панели задач
формат 48*48 - для сохранения ссылки на сайт на рабочем столе

Вот более подробно http://habrahabr.ru/post/260777/

Необходимо нарисовать изображение размером 16х16 пикселов и сохранить его в формате ICO в корне сайта под именем favicon.ico.

Adobe Photoshop не понимает формат ICO и не сохраняет в нем рисунки, так что для этой цели требуется дополнительный плагин.

Для работы плагина файл необходимо распаковать и сохранить в папке Plug-Ins\File Formats. По умолчанию программа Photoshop CS под Windows устанавливается в папке c:\Program Files\Adobe\Photoshop CS. Тогда полный путь для файла плагина будет c:\Program Files\Adobe\Photoshop CS\Plug-Ins\File Formats.

Размещение плагина для сохранения файлов в формате ICO

Размещение плагина для сохранения файлов в формате ICO

После добавления плагина, при сохранении рисунка в списке доступных форматов появляется новый пункт «Windows Icon».

Тип файла для сохранения иконки

Тип файла для сохранения иконки

Остается сделать желаемую иконку 16х16 пикселов и сохранить ее под именем favicon.ico в корне сайта.

  • Для чего нужен сайт в интернете (4039)

     Создание сайта (как для фирмы, так и для торговой марки) представляет одно из направлений рекламной политики: - легко запоминающееся имя вида www.имя.ru - удобные ящики электронной почты вида название@имя.ru - размещение на сайте каталога продукции- информация о видах профессионального обучения- независимость...

  • Сервер доменных имен DNS (1974)

    DNS – что это за «зверь» такой? DNS – это Domain Name Server, т.е сервер доменных имен. На этом сервере лежат служебные записи, в которых указано:- на каком сервере лежат файлы сайта (хостинг) - какой используется почтовый сервер- другие полезные настройки для работы сайта В целом обеспечение технической работы сайта состоит из 4-х частей: 1. Регистратор доменного имени, т.е....

  • Выбор хостинга (1199)

    Хостинг - это такое место, где живет Ваш сайт (точнее, все Ваши файлы, из которых собран сайт). Хостинг бывает платным и бесплатным. Бесплатное место под сайт - это хорошо, но есть некоторые проблемы: - на бесплатном хостинге могут начать некоторую перестройку и Ваш сайт на время станет недоступным - на Вашем сайте будет размещаться...

  • Файл favicon.ico (1000)

    Фавикон - это маленькая иконка рядом с названием сайта (точнее title) в браузере.Вот, например, сайт http://cancerchallenge.ru/ про онкологию. Мы видимКак там оказалась медицинская картинка, как она туда попала? Это такой специальный файл favicon.ico для хранения иконки сайта.Что бы браузер ее показал, необходимо:1. Формат файла ICO/png/gifда - там может быть...

  • Как создать домен 3-го уровня (907)

    Что такое домен третьего уровня?Домен первого уровня .ru -  национальный домен верхнего уровня для России. Домен второго уровня seotable.ru - открывается наш сайтДомен третьего уровня subdomen.seotable.ru - открывается мини-сайт на PHP, смотреть здесьДомен третьего уровня может быть использован...

  • Основные метатэги (695)

    Метатеги (англ. meta tags) — теги, предназначенные для предоставления структурированных метаданных о веб-странице. Как правило, указываются в заголовке, внутри структуры <head></head>Элемент meta принимает как минимум четыре атрибута: content, http-equiv, name и scheme. Из них обязателен только атрибут content и...