Можно ли переименовывать иконку из формата bmp в формат ico?
10.06.09 Веб-дизайн
В комментариях к своим статьям Как сделать иконку favicon.ico для своего сайта и Как сохранить иконку сайта favicon в Photoshop я столкнулся с распространенным заблуждением, что иконки для сайтов favicon необязательно сохранять в формате ICO. Достаточно сохранить иконку 16×16 в формате BMP, а затем просто изменить расширение изображения с BMP на ICO. И нет мол никакой разницы.
О том, что форматы ICO и BMP совершенно разные и отличаются не только расширением, я уже писал. Никто не запрещает погулить или почитать Википедию, чтобы в этом убедиться. Но бог с ней, с теорией. Давайте проверим на практике можно ли менять расширение картинки с BMP на ICO.
Прежде всего я решил сделать новую иконку favicon.ico и сохранить ее в форматах BMP и ICO с помощью Photoshop. Я качестве изображения для иконки сайта я использовал черно-белый рисунок мультяшного персонажа Doodlez:
После этого я скопировал вариант иконки, сохраненной в формате BMP и сменил его расширение с BMP на ICO. В именах файлов указан реальный формат изображения. Получилось вот так:
Метки: bmp, Explorer, favicon, ico, icon, Mozilla, браузер, иконка
Прозрачность и полупрозрачность в Photoshop
05.05.09 Подробные инструкции, Уроки Photoshop
Прозрачность в Photoshop – одно из ключевых понятий. Если вы только начали изучать Фотошоп и еще не знаете, как сделать прозрачным фон фотографии или как сделать часть рисунка прозрачной, этот небольшой урок с иллюстрациями будет для вас полезным.
Как сделать прозрачный фон в Фотошопе
Для того, чтобы сделать прозрачный фон на фото или рисунке, достаточно создать 2 слоя: нижний прозрачный фоновый слой и верхний видимый слой, на котором удалить ненужные участки изображения.
1. Открываем Photoshop. Открываем в нем картинку, которую нужно разместить на прозрачном фоне (File->Open…).
2. Выделяем все изображение/фото (Ctrl+O).
3. Копируем выделенную картинку (Ctrl+C).
4. Открываем новый файл в Фотошопе (File->New… или Ctrl+N). В появившемся окне в самом нижнем выпадающем списке выбираем значение Transparent – «прозрачность»:
Метки: favicon, gif, ico, Photoshop, png, веб дизайн, полупрозрачность, прозрачность, фото, Фотошоп
Растровые графические форматы для веб
31.01.09 Веб-дизайн, Секреты верстки сайтов
Графического формата, который был бы наилучшим для хранения и передачи по сети графической информации, не существует. Каждый формат является компромиссом между качеством картинки и скоростью ее загрузки. Понимание того, какой тип изображений в каком формате сохранять, поможет сделать графику на сайте более качественной и в тоже время сделает ваш сайт максимально легким. Это одна из основных характеристик качественного профессионального веб-дизайна.
1. JPEG: фотографии и красочные рисунки
JPEG – очень популярный формат представления графики в интернет. Фотографии, картины, рисунки высокого качества с большим количеством цветов – все это сохраняется с расширением .jpg. Формат способен отображать 16,7 миллионов оттенков. Прозрачность и анимация не поддерживаются.
Качество изображения зависит от степени сжатия файла: чем больше ужат файл, тем хуже картинка, но зато меньше размер самого файла. Потому хранение фотографий в JPEG – это компромисс между качеством изображения и его размером. На сильно ужатом файле этого формата появляются размытые области, теряется контрастность. Качество картинки теряется с каждым новым сохранением файла в JPEG, потому хранить промежуточные результаты работы нужно в формате, который не влияет на качество изображения. Например, в PSD.
Изображения в формате JPEG, как и все остальные форматы для интернета, бесполезно архивировать – их размер не уменьшится, поскольку они уже являются архивом.
Метки: gif, ico, jpeg, Photoshop, png, растровый, точечный, Фотошоп
Векторная и растровая графика для web
24.01.09 Веб-дизайн
Для веб-дизайнера важно знать, что графика в интернете бывает двух типов: растровая и векторная. Она создается с помощью разных программ, иногда даже с помощью скриптов, но по своей сути изображение состоит либо из цветных точек, либо является совокупностью кривых линий.
Нет идеального графического формата. В то же время важно научиться использовать преимущества того или иного формата для конкретной задачи, минимизируя влияние его недостатков.
Растровые (точечные) изображения
К растровой графике, которой гораздо больше, чем векторной, относятся все картинки форматов JPEG, GIF, PNG, ICO, BMP. Это привычные нам фотографии, иконки и рисунки, которые состоят из точек (пикселей, растров).
Преимуществом растровой графики является то, что с ее помощью можно создать любой по сложности рисунок. При этом применять огромное количество фильтров и плагинов. Основным недостатком – растровую графику нельзя растягивать без потери качества. Большие рисунки нужно изначально рисовать большими, а фотографии делать с большим разрешением.
При увеличении размера файлов растровой графики теряется четкость изображения, становятся заметными отдельные пиксели, из которых состоит картинка. Самым популярным пакетом для обработки растровой графики является, конечно же, Adobe Photoshop (PSD).
Растровый формат GIF, позволяет создавать анимацию. Правда, она проще и дольше загружается, чем flash, зато сделать gif-анимацию, как правило, намного легче.
Метки: flash, gif, ico, jpeg, Photoshop, png, векторный, кривые, растровый, Фотошоп
Как сохранить иконку сайта favicon в Photoshop
27.12.08 Уроки Photoshop
Если нужно создать иконку favicon.ico для своего сайта и нет желания скачивать и тем более платить за специальные программы по созданию иконок, можно обойтись только Фотошопом. К сожалению, даже версия Photoshop CS3 не умеет сохранять файлы в формате ICO. Эта проблема легко исправляется установкой специального плагина. Работы немного, зато плагин позволяет делать сколько угодно иконок быстро и удобно только в Фотошопе. Итак, что нужно делать:
1. Скачиваем специальный плагин для Photoshop, который дает возможность сохранять файлы в формате ICO:
Скачать плагин для Фотошопа, который позволяет сохранять файлы *.ico
Плагин упакован в архив icoformat.rar, весит 7 Кб. В версии Photoshop CS и Photoshop CS3 этот плагин работает точно, в других версиях тоже должен работать, но я лично не проверял.
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…:
Если вам нужна подробная информация, как установить иконку favicon на свой сайт, как ее сделать и для чего она вообще нужна, читайте статью Как сделать иконку favicon.ico для своего сайта.
Метки: favicon, ico, Photoshop, иконка, интеренет, плагин, сайт, сохранить, Фотошоп
