});
ДИЗАЙН В СРЕДЕ
ДИЗАЙН / 27 ФЕВРАЛЯ

Памятка дизайнера: большой гид по форматам графических файлов

Любая графика, что вы видите на экранах или в реальной жизни, когда-то была просто графическим файлом определенного формата. Каждый из этих форматов создан для своих целей. Правильный выбор типа файла гарантирует, что вы увидите на изображении именно то, чего ожидали. Ошибетесь — получите плохую печать, некачественную картинку, гигантский размер файла или кривую верстку.

Добавьте в закладки этот гид — так вы сможете быстро вернуться к статье, когда в следующий раз зависнете над кнопкой Save As.
Большинство графических файлов можно поделить на растровые и векторные. При этом некоторые файлы, например, PDF, могут содержать элементы как растровой, так и векторной графики.

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

JPEG / GIF / PNG / TIFF / RAW / PSD
Растровые изображения состоят из пикселей, каждому из которых присвоен свой цвет. Качество графики зависит от разрешения — после увеличения картинка может размыться. Это происходит потому, что компьютер сам пытается дорисовать новые непрописанные пиксели, основываясь на цвете соседних.
Растровые форматы обычно используются для фотографий, художественной графики и некоторых элементов веб-дизайна. Самый распространенный графический редактор растровой графики — Adobe Photoshop, в котором создаются, комбинируются и редактируются изображения.

Растровые изображения сохраняются в одной из двух цветовых моделей: CMYK или RGB. Такие аббревиатуры получили цветовые модели со своими системами записи цвета. Не будем углубляться в технические нюансы и сосредоточимся на главном: если вы готовите файл к печати, выбирайте CMYK, а если к размещению на электронных платформах — RGB.
Еще один нюанс — это плотность пикселей. Файл для печати лучше сохранять с плотностью 300 dpi, а для веба хватит 72 dpi.
JPG или JPEG — формат растровой графики, который используется в фотографиях, изображениях в рассылках и баннерах на сайтах. JPG хорош регулировкой степени сжатия — файл на выходе может занимать мало места, правда от этого графика теряет в качестве.
Используйте JPG, когда...
  • работаете с фотографиями или художественными работами
  • отправляете клиенту файл для быстрого просмотра и внесения правок
Не используйте JPG, когда…
  • вам нужна веб-графика с прозрачным слоем. У JPG нет альфа-канала, поэтому в этом случае лучше использовать GIF или PNG
  • работаете с многослойным изображением. Если вы не закончили с редактированием сложной графики, воспользуйтесь PSD
GIF часто встречается в анимированных изображениях, например, баннерах. Теоретически GIF — файл «без потерь», но существующие алгоритмы сжатия могут уменьшить размер изображения и его качество.
Используйте GIF, когда...
  • создаете веб-анимацию. Внутри GIF-файла содержатся все необходимые кадры («фрэймы») и информация о временных интервалах
  • вам нужна прозрачность
  • вам нужен файл небольшого размера — простая иконка или веб-графика
Не используйте GIF, когда…
  • вам нужно изображение фотографической детализации. GIF имеют ограничение в 256 цветов, для сложных изображений этого недостаточно
  • готовите файл для печати
  • вам нужно многослойное изображение для редактирования. Редактировать анимированную графику можно в PSD
Растровый формат со встроенной прозрачностью и поддержкой миллионов цветов (в отличие от GIF). Часто встречается в вебе — это стандартный формат изображений, используемых в интернете.
Используйте PNG, когда...
  • вам нужна высококачественная графика с прозрачным слоем. Транспарентность в PNG-файлах можно регулировать — это позволяет создавать в PNG более сложные композиции, чем в GIF
  • имеете дело с изображением с ограниченным набором цветов. PNG хранит информацию о миллионах цветов, но формат лучше использовать с небольшой цветовой палитрой
  • вам нужен небольшой файл. PNG могут сжиматься до крошечных размеров, поэтому такие файлы часто используют в вебе
Не используйте PNG, когда…
  • работаете с фотографиями и сложными художественными работами. Такие изображения в PNG будут занимать много места, поэтому используйте JPG
  • готовите файл к печати. PNG оптимизирован для экранов смартфонов и компьютеров, поэтому печатать лучше JPG- и TIFF-файлы
TIFF — растровый формат высокого качества. Его используют при широкоформатной печати, сканировании документов или сохранении высокодетализированных фотографий.
Используйте TIFF, когда...
  • готовите к печати графику больших размеров
  • делаете высококачественное сканирование
Не используйте TIFF, когда…
работаете с веб-графикой. Здесь больше подойдут JPG и PNG
RAW-файлы содержат необработанные данные, записанные сенсором цифровой камеры или сканера. Как правило, их обрататывают (проводят цветокоррекцию, настраивают экспозицию и баланс белого) и сохраняют в JPG или TIFF. Работать с RAW-изображениями можно в графических редакторах, например, Adobe Photoshop.
Используйте RAW, когда...
  • создаете веб-анимацию. Внутри GIF-файла содержатся все необходимые кадры («фрэймы») и информация о временных интервалах
  • вам нужна прозрачность
  • вам нужен файл небольшого размера — простая иконка или веб-графика
Не используйте RAW, когда…
  • вам нужно изображение фотографической детализации. GIF имеют ограничение в 256 цветов, для сложных изображений этого недостаточно
  • готовите файл для печати
  • вам нужно многослойное изображение для редактирования. Редактировать анимированную графику можно в PSD
К ДРУГИМ МАТЕРИАЛАМ