Графика и Web

Векторная и растровая

Компьютерные изображения можно разделить на две группы:

Растровая графика
Векторная графика

Растровые изображения - это изображения, состоящие из прямоугольного набора точек, например, фотографии, отсканированные рисунки и т.д. Для работы с растровой графикой я предлагаю использовать Adobe Photoshop. Работая с растровой графикой, можно добиться многих вещей, которые пока не доступны в векторной. Например, разные спецэффекты. Засунуть фотографии или подобные им изображения в векторный формат вам тоже не удастся.

В векторной графике изображение состоит не из точек, а из набора линий, дуг, прямоугольников и т.п. Это очень удобно, такие изображения легко редактировать. Каждую фигуру можно передвинуть, изменить, развернуть, не затронув других. Кстати, в большинство векторных изображений можно включать растровые куски. Для работы с векторной графикой я предлагаю использовать Adobe Illustrator .

Если хотите нарисовать что-то своими руками, а не обработать готовое изображение, то обычно лучше использовать векторное изображение. Потом это изображение можно растрировать и доработать его в растровом формате. Перевести векторный рисунок в растровый очень просто. В векторных редакторах можно сохранить рисунки в растровых форматах, выбрав такой формат в меню Save As... , или импортировать его в векторный формат, что, на самом деле, одно и тоже. А вот сделать из растрового рисунка векторный, практически нельзя. Попробуйте описать лицо человека в виде набора линий, кривых, кругов. Естественно, вам это не удастся, а если и удастся, то это будет похоже не на фотографию, а на рисунок, сделанный от руки.

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

GIF и JPEG форматы

В Интернете для картинок в основном используются 2 формата. Это файлы *.GIF и *.JPG. Все они сжимают (как бы архивируют) изображение. Но каждый приспособлен к определенной цели. Какой из них выбрать? Это очень важно, так как от формата зависит размер файла и его качество (часто приходится делать тяжелый выбор между размером файла и качеством изображения). Помните, как долго загружаются некоторые картинки из плохо продуманных сайтов? Иногда по несколько минут! И что вам хотелось тогда сделать: разбить клавиатуру, сбросить монитор на пол или просто покинуть этот ....... сайт? Конечно, чем меньше размер картинки, тем меньше размер файла, тем быстрее она грузится. Но иногда можно засунуть очень крупную картинку в очень мелкий файл. Рассмотрим форматы файлов:

Формат GIF (расширение .gif )

Может содержать изображение до 256 цветов. Но число цветов можно уменьшить для уменьшения размера файла.
Хорошо сжимает контрастные и несильно заполненные изображения с малым числом цветов. Например, чертежи, рисунки.
Может содержать мультипликацию, т.е. несколько картинок, которые выдаются через указанные промежутки времени. Для редактирования таких многокадровых GIF-ов можно использовать программу Adobe Image Ready. Может содержать "прозрачные" цвета, т.е. сквозь рисунок может просвечивать задний план.

Формат JPEG (расширение .jpg или .jpeg )

Хорошо сжимает изображение с плавными цветовыми переходами. Например: портреты, пейзажи, фотографии.

Можно установить сжатие с заданной потерей качества. Таким образом, можно выбирать соотношение: размер файла / качество.

Упрощенный вывод можно сделать следующий: GIF - лучше для картинок с ограниченным числом цветов (например, для логотипов), а JPEG - для картинок с неограниченным числом цветов и плавными переходами (например, для фотографий). Чем сложнее изображение, тем больше размер файла.

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