Сегодня мы рассмотрим как создать иконку для нашей странички. Для этого откроем
Пуcк -> Все программы -> Стандартные-> Paint. Далее выбираем Рисунок -> Атрибуты и установим значения ширина: 16, высота: 16, Единицы измерения: точки, Палитра: цветная и жмем OK. С данной картинкой отображаемой в стандартном масштабе работать довольно сложно, поэтому изменим масштаб. Для этого выберите Вид -> Масштаб -> Другой -> 800 -> OK. Еще для удобства следует показать сетку (разметку картинки) сделать это можно сочетанием клавиш Ctrl+G или нажав Вид -> Масштаб -> Показать сетку.
Далее вам необходимо используя инструменты, палитру и разнообразные функции (от копирования и до разворота, отражения, искривления) программы создать тот необычайный шедевр, который Вы с достоинством покажете каждому посетителю Вашей странички.
У меня получилось примерно следующее:
После того как вы нарисовали картинку ее необходимо сохранить, для этого Файл -> Сохранить как. Далее выбираем место для сохранения, а в имя файла пишем favicon.ico и жмем Сохранить. После этого Вам необходимо закачать картинку в корневой каталог сайта и прописать ее между тегами и , примерно так:
Как из имеющейся картинки сделать favicon.ico
и как сделать ее фон прозрачным
Часто бывает, что необходимая картинка уже есть, поэтому следует помнить, что из нее можно сделать иконку, правда у нее должны быть определенные параметры такие как: не очень большой размер (так как при большом уменьшении картинка полностью потеряет вид) и подходящий формат картинки, поддерживаемый сайтом с помощью которого мы переделаем картинку в иконку.
Заходим на сайт http://www.favicon.ru далее жмем Обзор или вписываем адрес картинки в Интернете, если необходимо создать иконки для ссылок сохраненных на компьютер то ставим галочки значок 32x32px для десктопа и значок 48x48px для десктопа и жмем Создать favicon.ico! Далее Вы увидите страницу вверху которой расположен пример отображения Вашей иконки, а ниже Вы сможете выбрать необходимую для Вас функцию: Обрезать картинку, Редактировать иконку и Скачать favicon.ico. Если созданная Вами иконка отображаемая в примере полностью Вас устраивает смело жмите Скачать favicon.ico и сохраняйте ее. Если же нет то либо загрузите другую картинку, либо отредактируйте данную.
Далее вдоволь насмотревшись на свои достижения Вы можете заметить, что обычная иконка созданная в Paint имеет кроме себя еще и фон (чаще всего белый), так вот для того, что бы от него избавиться Вам необходимо либо:
1) Создать картинку в редакторе, который поддерживает прозрачность (transparent) в картинках, такими являются Corel Draw, Photoshop, Jasc Paint Shop Pro и другие платные и бесплатные редакторы картинок. Вам необходимо выбрать формат картинки, который поддерживает прозрачность (чаще всего gif) и в его настройках Вы найдете параметр типа Цвет фона в котором можно выбрать прозрачность (transparent) далее все тоже, что и в Paint. Еще бывают встроенные оптимизаторы форматов такие как в Jasc Paint Shop Pro в котором можно используя инструмент пипетка указать любой цвет, который необходимо сделать прозрачным. Два совета: первое если Вы заменяете допустим красный фон на прозрачность (transparent), то скорее всего отображаясь на белом фоне картинка все же будет иметь еле заметные очертания красного цвета, так что старайтесь продумывать какой фон будет окружать картинку; и второе помните, что заменить на прозрачность (transparent) можно, только один цвет и не более (причем размер картинки увеличиться, так как добавляя прозрачность (transparent) в картинку программа добавляет ей дополнительный канал отвечающий за прозрачность).
2) Отредактировать имеющуюся картинку можно на том же http://www.favicon.ru для этого после загрузки картинки выберите Редактировать иконку в меню Палитра выберите самый верхний, левый цвет (прозрачный) и зарисуйте им необходимые Вам места. Далее жмите Сохранить изменения, а потом Create favicon! А затем сохраните получившийся шедевр.
Дополнительные материалы:
http://favicon.ru/faq/ http://devaka.ru/articles/favicon-in-seo