Плагин ico для photoshop cs5. Как проще и быстрее всего сделать из картинки иконку в фотошопе
Доброго всем денечка, мои дорогие друзья! Вы знаете? Иногда так надоедают стандартные ярлыки, точнее иконки, что хочется чего-то новенького, дабы разнообразить свое пребывание за компьютером. Можно конечно , сменить фон рабочего стола, но сегодня я хотел бы вам рассказать как сделать иконку из картинки с помощью моего любимого фотошопа.
Многие ошибочно предполагают, что достаточно на ICO, и сразу изображение преобразуется в эту самую иконку. Ну-ну. Попробуйте сами и вам выдастся ощибка, когда вы попытаетесь заменить изображение ярлыка. В общем давайте лучше делать, чем трындеть) Погнали!
Сейчас я хочу сменить иконку для моего браузера гугл хром. Как лучше всего поступить в данной ситуации? Давайте по порядку.
Что же тогда делать? Как тогда нам сделать иконку? Да элементарно. В этом нам поможет один внешний плагин (дополнение), благодаря которому нужный нам формат станет доступным для сохранения. В общем давайте, повторяйте за мной.
Что мы только что сделали? Мы скачали файлы плагинов (для разных разрядностей), которые дополнительно устанавливают новый формат в фотошоп. Папка File Formats как раз служит для подключения новых форматов. Надеюсь, я понятно объясняю? А то мало ли)
Ну а теперь заходите снова в фотошоп, открывайте картинку из которой хотите сделать иконку. Теперь вы сможете сохранять файл с расширением ICO . Просто как обычно сохраните картиночку и теперь выберите нужное расширение из списка.
ВАЖНО! Если у вас большое изображение, то при сохранении вы не увидите формата ico в списке допустимых. Дело в том, что эта возможность недоступна, если ваша картинка превышает размер 256*256. Если это так, то просто до 64*64. Думаю, что больше вам не потребуется. После замены расширение будет доступно.
Ну а теперь дело за малым, осталось лишь заменить полученную штуку на ярлыке. Для этого нажмите правой кнопкой мышки на нужном ярлыке и выберите «Свойства» . После этого выберите «Сменить значок» и теперь ищите свежесохраненную иконку там, куда вы ее положили, нажав предварительно кнопку обзор.
Ну как? Не появилось у вас желания обновить ваши ярлычки? Можете поэкспериментировать и слегка преобразить ваш рабочий стол.
Ну а вообще, если вы хотите хорошо освоить фотошоп, то я очень рекомендую вам посмотреть прекрасные видеоуроки , благодаря которым вы научитесь владеть этим замечательным фоторедактором. Все уроки построены просто великолепны. Я сам его смотрел и узнал много новенького.
Ну вот пора и честь знать. На сегодня я заканчиваю. Надеюсь, что вам моя статья понравилась и я увижу вас и в других своих постах. И конечно же я рекомендую вам подписаться на обновления блога, дабы не пропустить чего-то интересного. Успехов вам! Пока-пока.
С уважением, Дмитрий Костин.
Из этого туториала Вы узнаете, как создать значок для вашего сайта при помощи Photoshop .
Как создать значок сайта.ico при помощи PhotoshopЗначок сайта - это небольшой, но значительный элемент продвижения вашего бренда на сайте. Вот пример, того, как он может выглядеть на вашем сайте:
Photoshop - это прекрасная программа для работы с изображениями, которая поможет Вам создать пользовательский значок сайта.
Значок сайта - это миниатюрный логотип (16×16 ), который Вы можете использовать на сайте. Если Вам удобнее работать с изображением большего размера, Вы можете работать над значком, размером 64×64 пикселя, а затем его уменьшить.
Используйте инструмент ‘Масштаб’, для того чтобы увеличить документ для редактирования:
Например, мы создадим значок сайта, который состоит из простого градиентного фона и двух букв ‘TM’ (Торговая марка).
Примените к вашему документу инструмент ‘Градиент’ (Gradient Tool). Вы можете использовать одно из доступных сочетаний цветов, или создать новое сочетание цветов:
Используйте инструмент ‘Горизонтальный текст’ (Horizontal Type), для того чтобы добавить ваш текст. Задайте шрифт, цвет и размер шрифта:
Используя инструмент ‘Трансформирование’ (Ctrl + T) , отрегулируйте расположение текста:
Соедините слои (Merge layers), как это показано на скриншоте ниже:
-
Вы успешно создали значок сайта. Он был сохранён как файл ‘favicon .png’ на вашем компьютере.
Однако, значок сайта нужно сохранить в формате .ICO . Этот формат файла позволяет сохранить несколько изображений разных размеров для масштабирования. По этому, теперь Вам нужно конвертировать созданный значок сайта.PNG в формат .ICO . Это последний шаг данного туториала.
Откройте в браузере любой сайт конвертирования изображений. Мы воспользуемся этим сайтом .
Перетяните ваш файл ‘favicon .png’ в область ‘Загрузить’ (как это показано на скриншоте). Конвертирование начнётся автоматически. Процесс займёт 1 — 2 секунды:.ico’ на вашем компьютере.
Создайте новый документ Photoshop. Откройте вкладку меню ‘Файл’ > ‘Новый’ (‘File’ > ‘New’):
Это конец данного туториала. Вы успешно создали пользовательский значок для вашего сайта, используя программное обеспечение Adobe Photoshop. Теперь Вы можете загрузить значок сайта на ваш сервер.
Вы можете также ознакомиться с детальным видео-туториалом ниже.
Иконка favicon.ico представляет собой крошечную картинку размером 16х16 пикселей, которая отображается рядом с адресом вашего сайта или блога в браузерах, в результатах поиска, в закладках и т.д. Обычно такую иконку делают из логотипа или фрагмента логотипа компании на фоне корпоративного цвета или любой другой символ, который дизайнер посчитает запоминающимся и подходящим для тематики сайта.
Казалось бы, простая задача по созданию иконки к сайту, нужно просто сохранить картинку размером 16x16 x32 в формате *.ico
Да не тут та было... как оказалось, далеко не все программы поддерживают формат *.ico
Я привык работать в Photoshop CS5 , но и тот даже в своих новых версиях никак не сделает поддержку нужного нам формата. Раз не делает производитель - сделаем сами
Вариант 1. Установка плагина ICO для Photoshop
1. Качаем сам плагин, который дает возможность сохранять файлы в формате ICO
Плагин работает во всех версиях фотошопа, до CS5 включительно. Остальные версии не проверял.
2. Устанавливаем плагин. Закрываем Photoshop, копируем распакованный плагин icoformat.8bi в папку установки плагинов. Если вы устанавливали Photoshop CS3 в папку по умолчанию, то путь будет такой:
C:\Program Files\Adobe\Adobe Photoshop CS3\Plug-Ins\File Formats\
Все. Теперь достаточно перезапустить Фотошоп и можно сохранять файлы в формате ICO. Для этого, после создания своей favicon, нажмите Ctrl+Shift+S или File(Файл)->Save As…(Сохранить как...) :
Вариант 2. Использование XnView
XnView — это кроссплатформенная программа для просмотра изображений, поддерживающая более 400 форматов файлов. Распространяется бесплатно для некоммерческого использования
Тут все просто.
1. Любым редактором создаем картинку 16x16 px в формате gif. Например, в том же Фотошопе или Paint
2. Открываем эту картинку в XnView
После создания иконки, загружаем ее на сайт в корневой каталог с именем favicon.ico - именно такое имя нужно для наибольшей совместимости (некоторые браузеры проверяют наличие этого файла в корне сайта http://site.ru/favicon.ico )
Для отображения иконки, добавляем следующий код в секцию ... (лучше вводить полный путь к иконке):
<link rel ="shortcut icon" href ="http://domain.com/favicon.ico" type ="image/x-icon" />Комментарии (11)
Здравствуйте полезная статья я долго ломала голову как перевести иконку в нужный формат,но у меня вопрос с использованием программы XnView у меня картинка из размера 256x256 после смены формата становится маленькая хотя размер остаётся тот же,подскажите возможно ли это как то исправить?
Вообще перед конвертированием надо ресайзить картинку в нужный размер - 16x16px.
Если Вы хотите более качественные иконки, используйте формат PNG.
Ну что то у меня не чего не получается((
Залейте картинку на какой-нибудь sendfile.su например и давайте я попробую преобразовть и описать как у меня это получилось ...
Вот одна из тех которая не хочет преобразовываться http://sendfile.su/515788
Фавикон - это маленькое графическое изображение (картинка) в формате ico 16×16, которая отображается в адресной строке браузера напротив адреса сайта. При занесении такого сайта в избранное, фавикон также будет виден рядом с адресом сайта. В поисковой системе Яндекс, при выдачи тоже будет отображен фавикон сайтов, если конечно у этих сайтов он есть.
Вообще, по моему мнению фавикон для сайта вещь значимая и необходимая. Во первых, если у сайта красиво сделанный фавикон, то вероятность того, что человек зайдет на сайт с красивым и привлекающим внимание фавиконом, гораздо больше, чем у сайта без него.
Во вторых, людям легче отыскать именно Ваш сайт в избранном своего браузера или в поисковой выдаче Яндекса, по фавикону который сразу бросается в глаза.
Чтобы сделать фавикон для сайта существует два способа:
1.
Создать фавикон самому с помощью графических редакторов, например Фотошоп. Фотошоп сам не может сохранять файлы в формате ico
. Чтобы помочь горячо любимому всеми графическому редактору сохранить файлы в формате ico, надо установить специальный плагин. Этот плагин имеет очень маленький вес и очень просто устанавливается. Работает с версиями Photoshop CS2 и CS3
. Насчет других версий, будет ли работать этот плагин с ними, не знаю, не проверял.
Скачать - для сохранения файлов в формате ico.
После того, как Вы скачали плагин, его надо распаковать и закинуть в папку с плагинами Фотошопа. По умолчанию путь до папки должен быть следующим: C:\Program Files\Adobe\Adobe Photoshop CS2\Plug-Ins\File Formats . Теперь перезапускаем Фотошоп (если программа была запущена) и можем сохранять файлы в формате ico. Делаете изображение и выбираете - Файл -> Сохранить как -> Windows Icon (*.ICO)favicon.
Когда Вы сделаете фавикон в Фотошопе, его достаточно будет просто закинуть на сервер, в корневую папку Вашего сайта (обычно public_html ). И прописать в коде страниц сайта между тэгами
:1 2 | <link rel = "icon" href = "/favicon.ico" type = "mini_imgge/x-icon" > <link rel = "shortcut icon" href = "/favicon.ico" type = "mini_imgge/x-icon" > |
Хотя и без этого кода фавикон будет отображаться в браузере. У меня на некоторых сайтах этот код не прописан в страницах сайта. В корневой папке на сервере лежит только фавикон и прекрасно отображается. Но на всякий случай можно и прописать этот код.
2. Этот способ более прост и может сэкономить Ваше время. Существуют специальные сайты для изготовления фавиконок, например этот: .
Заходите на сайт для изготовления фавиконок. Загружаете картинку любого формата и размера, с Вашего компьютера. Обо всём остальном позаботится выше стоящий сайт. Сервис сам уменьшит и преобразует картинку в формат ico . Для Вас будет предоставлена ссылка для закачки фавикона и код который надо будет прописать в страницы сайта. Вам останется лишь закинуть картину в корень сервера и прописать код. И теперь люди заходящие на Ваш сайт, будут видеть красивый и оригинальный фавикон .