1. Прежде всего нужно эту иконку нарисовать в Photoshop. Для начала необходимо скачать специальный бесплатный плагин для редактора Photoshop, который позволит открывать и сохранять картинки в формате ICO. Этот плагин называется ICOFormat и доступен для скачивания здесь. Распаковать архив и сохранить файл ICOFormat.8bi из архива в папку File Formats, которая находится внутри папки с плагинами Plug-Ins. Как правило, эта папка располагается по адресу: C:\Program Files\Adobe\Photoshop 7.0\Plug-Ins\, но может быть все по-другому. Теперь запустить редактор Photoshop. Иконка сайта имеет размеры 16х16 пикселей. Многим сложно что-либо рисовать в таком ничтожно малом квадрате. Конечно, можно увеличить первоначальное изображение до более-менее нормальных размеров. Однако при уменьшении готовой картинки все мелкие детали пропадут.
Создать пустое изображение с белым фоном и размером 16х16 пикселей и иметь 16 цветов (простые формы, минимум деталей). Увеличить изображение в навигаторе или инструментом Zoom до максимума. Теперь нужно сохранить получившуюся картинку как favicon.ico (сокращение от слов Favorite Icon) на диске. В меню File (Файл) выберем команду Save as (Сохранить как) и увидим, что среди списка доступных форматов появился дополнительный формат ICO:
IE - не отображает фавиконы, с палитрой больше чем 16 цветов.
В крайнем случае, можно просто написать первую букву из названия сайта и заключить ее в рамку, более-менее художественно оформив, или же взять уже готовый рисунок. Обрезать его (в Photoshop это называется "кадрирование"), удерживая клавишу Shift. Задать размер изображения 32 на 32 или 16 на 16 пикселей - если выглядит прилично - сохранить в формате .bmp. Затем запустить редактор иконок. Например, iconsuchi 1.20 beta2 . Он не требует установки. Открыть сохранённый файл и снова сохранить его, но уже как favicon.ico. Вес иконки не должен превышать 1,046 кб. Готово.
2. Необходимо залить себе иконку на сервер в корневой каталог сайта (рядом с index.htm), и с этих пор Internet Explorer посетителя сам найдет эту иконку в случае попадания сайта в "Избранное".
Хотелось бы заметить, что не все сервера изначально "понимают" эту иконку. Для того, чтобы не возникало проблем, нужно убедиться, что настройки сервера позволяют пользоваться favicon.ico.
Если возникают проблемы, иконку можно подгрузить и принудительно. Для этого (как правило, между тегами <head> и </head>) следует вставить следующий код, который явным образом укажет браузеру на иконку:
<LINK REL="SHORTCUT ICON" HREF="http:/your_site.ru/favicon.ico">
И теперь иконка будет находиться в папке "Избранное" напротив названия сайта у пользователей, которые, соответственно, добавят сайт себе на заметку в "Избранное" и, возможно, забыли бы о нем. Но теперь не забудут. Иконка эффектно отличается на фоне стандартных картинок Internet Explorer`а и это еще один повод напомнить пользователю о своем сайте...
Кстати, совсем не обязательно изобретать велосипед. Есть один англоязычный сервис, позволяющий обойтись без Фотошопа. Существует уже давно.
Дать ему файл с расширением gif, он возвращает favicon.ico в архиве и ещё предлагает предпросмотр готовой иконки.
Тоже самое можно сделать на сайте favicon.ru
Дополнение к совету: пользователь и сам может назначать значки у себя в Избранном. При большом количестве закладок нестандартные значки позволят немного упорядочить список сайтов.
1. Открыть меню Избранное.
2. Выбрать нужную закладку и правой кнопкой открыть Свойства.
3. В появившемся окне нажать кнопку Сменить значок и выбрать любой по вкусу.
Источники:
- bestfree.ru - краткое описание создания иконки своего сайта в три приёма;
- yelagin.spb.ru - программы для создания иконки, браузеры, поддерживающие ее отображение и подробное описание создания иконки.