photolessons: Как создать favicon в Photoshop

{xtypo_quote}Как создать favicon в Photoshop{/xtypo_quote} {xtypo_dropcap}П{/xtypo_dropcap}ри посещении любого сайта вы можете заметить специальную иконку, расположенную слева от URL страницы. При добавлении в избранное она автоматически появляется рядом с выбранной страницей. Как создать favicon иконку в программе Adobe Photoshop и пойдет речь в данной статье...

Для того, чтобы создать иконку для web сайта нам понадобится плагин для Photoshop, который позволит сохранить полученное изображение в ico формат.

Скачиваем плагин и устанавливаем его, следуя приведенным ниже инструкциям: {xtypo_list}

Распаковываем папку
Перекидывам файл (ICOFormat или ICOFormat64 - зависит от версии Photoshop (32/64)) с расширением .8bi в папку X:\Program Files\Adobe\Photoshop \Plug-Ins\File Formats (где X - это имя диска, где установлена программа)
Перегружаем программу Adobe Photoshop

{/xtypo_list}

После того, как вы совершили вышеуказанные действия, у вас должно появиться еще 2 расширения для сохранения файлов в программе: ICO, CUR. Можно прочитать про эти форматы в википедии.

Итак, открываем программу Adobe Photoshop и создаем документ 64x64 пикселя. Рабочий размер может быть любым, самое главное запомнить, что выходной файл должен быть с размерами 16x16 пикселей.

Теперь рисуем или создаем свой собственный логотип, или загружаем в документ, выбрав предварительно иконку с другого сайта - это ваше личное дело, как использовать ресурсы. ;)

Далее уменьшаем изображение, переходим в меню {tip Adobe Photoshop::Изображение-размер изображения}Image-Image Size{/tip} и ставим значения 16x16 пикселей.

Затем выбираем пункт {tip Adobe Photoshop::Сохранить как}Save as{/tip} и в меню формат находим значение *.ICO, переименовываем наш исходный файл в favicon, сохраняем.

Идем дальше...

Теперь необходимо поместить готовый файл favicon.ico в папку на сервере, где расположен ваш сайт. А именно в то место, где находится основной файл (index.html/index.php).

Если вы сделали все правильно, то большинство браузеров автоматически найдут данную иконку и покажут ее слева от URL страницы. Однако, советую указать адрес favicon.ico вручную непосредственно в HTML коде между тегами <head></head>.

{code class="brush: xml;"}

{/code}

Очищаем кэш браузера и нажимаем F5, чтобы изменения вступили в силу.

{tab=Форум}{xtypo_button2}обсудить{/xtypo_button2}{tab=Расширение}{xtypo_button1}плагин{/xtypo_button1}{/tabs}

photolessons

воскресенье, 28 октября 2012 г.

Как создать favicon в Photoshop

Комментариев нет:

Отправить комментарий

воскресенье, 28 октября 2012 г.

Как создать favicon в Photoshop

Комментариев нет:

Отправить комментарий

воскресенье, 28 октября 2012 г.