Форматы изображений | Как создать свой сайт

Форматы изображений для сайта

Сен-16-2010 Автор: VeryOldMan

Графические изображения и форматы изображений в дизайне веб сайта играют решающую роль. Какой же дизайн без графики? Основной инструмент по работе с графикой и, кстати, очень удобный для этой цели, это программа Photoshop. Как работать с графикой в этой программе – это разговор отдельный, Одной статьей все не расскажешь, тем боле что на сайте достаточно подробно этот вопрос рассмотрен в разделе Дизайн страницы сайта в программе Photoshop.

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

Самый простой способ сохранить изображение или изменитьформаты изображений в программе Photoshop, это выбрать в главном меню команду Файл – Сохранить как.  В соответствующих строках открывшегося окна задать имя сохраняемого файла, а в выпадающем меню Тип файлов выбрать формат изображения, в котором Вы хотите его сохранить. Как видите – выбор большой. Этим способом можно сохранять изображения или изменить форматы  изображений, если Вы не планируете применять их для создания дизайна сайта.

В противном случае, рекомендуется использовать команду Файл – Сохранить для WEB и устройств. Откроется большое окно, в котором Вам предложат сохранить изображение в форматах JPEG, GIF, PNG и WBMP. В настоящее время, при разработке дизайна сайта, применяют такие форматы  изображений:  GIF, JPEG и PNG . Рассмотрим их по порядку.

Форматы изображений  и формат GIF

Формат изображения GIF (Graphics Interchange Format) создала в 1987 году компания CompuServe. Разработан данный формат изображения специально для Интернета. Его назначение – передача скринов (это снимки эрана), высококачественных сканов черно-белых документов, изображений, которые содержат небольшое количество цветов, имеющих большие участки одинакового цвета. У формата GIF есть «прозрачный цвет», что дает возможность применять его в различных дизайнерских решениях в процессе создание дизайна сайта.

Одна из основных особенностей формата GIF это то, что файл в этом формате может иметь несколько кадров, сменяющих друг друга через заранее заданный промежуток времени, то есть позволяет создавать анимацию Если Вы создаете дизайн сайта в программе Photoshop и Вам необходимо сохранить изображение в формате GIF или изменить форматы изображений на формат GIF, то сделать это можно двумя способами. Я имею ввиду тот случай, когда Вы сохраняете изображении через меню Сохранить для WEB и устройств.

Это способ Без дизеринга (No dither) и способ Дизеринг (Dithered). Дизеринг это способ обработки изображения, позволяющий с помощью точек формировать что наподобие полутонов. Естественно, что при такой обработке этот файл стает более похожим на оригинал, но, как Вы сами можете видеть, в левом нижнем углу окна, растет «вес» этого файла. Кроме этого, настройки меню Сохранить для WEB и устройств, позволяют использовать настройки прозрачности, количества цветов и модели цвета. Если говорить о том, где применяется формат изображения GIF в процессе создания дизайна сайта, то это создание диаграмм, графиков, простейших изображений, графических элементов сайта, таких, как кнопки, баннеры, элементы меню. Ну и, конечно, как же можно обойтись без этого формата при создании GIF анимации.

Форматы  изображений и формат  JPEG

Формат изображения JPEG (Joint Photographic Experts Group) — идеально подходит для сжатия фотографий, я имею ввиду многоцветные фотографические изображения. Данный формат может обеспечить сжатие полноцветного изображения, при этом, практически не уменьшая количества цветов. То есть если вы создаете дизайн сайта в программе Photoshop и Вам необходимо вставить в страницу сайта фотографию, сохранив при этом все цвета и переходы полутонов, то этот формат будет самым оптимальным.

Форматы  изображений  и формат  PNG

Форматы изображений, относящиеся к новым форматам. По своим свойствам он очень близок к формату GIF. Он и должен был по идее разработчиков этого формата заменить GIF. Но что-то там не «срослось» и надежды авторов не оправдались. Может из-за большего веса файлов по сравнению с GIF или, скорее всего, из-за отсутствия поддержки анимации. В программе Photoshop существуют две возможности обработки и сохранения изображений в формате PNG.  Это PNG-8 и PNG-24.

Последний, дает возможность сохранить изображение или изменить формат изображения, с фотографическим качеством. Хотя до формата JPEG, в этом отношении ему далеко. У формата изображения PNG есть полноценный альфа-канал, то есть он поддерживает прозрачность и полупрозрачность. Где можно применить формат изображения PNG при разработке дизайна сайта. Во многих случаях он может заменить формат GIF если последний Вас чем-то не устраивает.

В частности, если Вам нужно сохранить изображения, качества скринов.  Иногда  может заменить формат JPEG.  К примеру,  в режиме PNG-8 и количеством цветов 256, «вес» изображения может быть намного меньше и с приемлемым качеством. Ну а подобрать оптимальные  форматы изображений можно только с помощью эксперимента.

Ну, пока все! Удачного Вам создания дизайна сайта!






Комментариев (0)

Добавить комментарий