Какие бывают форматы изображений

PNG, JPEG, GIF, PDF — это те форматы, которые всегда на слуху, но существуют ли еще форматы? Чем каждый формат отличается от другого? Где какой использовать? Пришло время узнать ↓

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

Что такое формат графического файла

Графический формат — это способ организации и хранения данных в файле, который содержит графическое изображение.

Каждый графический формат определяет структуру файла, способ кодирования и хранения изображения, поддерживаемые свойства (например, прозрачность, сжатие, цветовую гамму) и другие характеристики, которые определяют, каким образом изображение будет отображаться и обрабатываться на компьютере. Различные графические форматы могут быть более или менее подходящими в зависимости от конкретной задачи или требований, поэтому важно выбирать формат с учетом целей и контекста использования изображения.

На что влияют различные графические форматы?

• Сохранность изображения
• Точность цветопередачи
• Качество изображения
• Сжатие изображения с потерей качества или без
• Подготовку печати в полиграфии
• Возможность открыть полученный макет в той или иной программе
• Скорость загрузки сайта или приложения
• Возможность интерактивности.

Все форматы делятся на две большие категории — растровые и векторные. Разница между ними колоссальна ↓

Растровые форматы изображений

Растровое изображение — это своеобразная мозаика, состоящая из множества точек (пикселей). Чем больше таких точек, тем выше разрешение, то есть качество картинки. Именно в этом формате создаётся большая часть изображений, если нет необходимости в масштабировании. Самые популярные растровые форматы:

PNG

Главная особенность Portable Network Graphics (PNG) — прозрачность. Его направление — работа с ограниченной цветовой гаммой и решение простых задач без градиента. Формат позволяет сжать изображение, сохраняя качество, и совместим практически со всеми программами и браузерами. Это важно, поскольку далеко не все форматы обладают такой совместимостью. PNG не используют в полиграфии, то есть для печати он не пригоден. Его сфера — веб-дизайн и электронные документы, не требующие распечатки. Нередко его используют как промежуточный этап при создании полноценных картинок для печати в коллажах и иных творческих проектах. Также он полезен для длительного хранения изображений без потери качества.

Расширение: .png

JPEG

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

Расширения: .jpg, .jpe, .jpeg или .jfif

GIF

Graphics Interchange Format — анимационный формат. В этом его главная особенность, для этого GIF и создавался. Хотя статичную картинку в GIF также можно сохранить. Формат не универсален, поскольку его цветовая гамма ограничена 256 оттенками. При этом он поддерживает прозрачность и совместим со всеми браузерами.

Расширение: .gif

RAW

«Сырой» формат, содержащий метаданные изображения. Первоначально в этом формате создаются снимки с камеры. RAW несложно обработать (например, изменить яркость, контраст, баланс белого). Для этого используют только две программы — Photoshop и Lightroom. У формата две важные особенности — большой вес и высокое качество. Для печати RAW непригоден. Существует большое количество разрешений RAW, каждое из них соответствует определенным производителям фотокамер, например:

• .cr2 — используется камерами Canon
• .nef — предназначено для фотокамер Nikon
• .arw — применятся для камер Sony
• .orf — для фотокамер Olympus

Кстати: компанией Adobe был предложен универсальный формат .dng, который может быть использован с различными фотокамерами. На данный момент поддержку файлов этого расширения включили в свои камеры компании: Pentax, Hasselblad, Samsung, Leica, Sigma, Ricoh.

TIFF

Специальный формат для печати. В этом отношении у него много преимуществ:

• изображение можно сжать без потери качества
• при сжатии сохраняются все особенности оригинала
• одновременно поддерживает несколько слоёв
• возможно сочетание растра и вектора.

При этом TIFF поддерживается не всеми программами и долго загружается. Для работы с таким форматом обычно выбирают Photoshop.

Расширения: .tif или .tiff

BMP

Формат высокого качества для детализированных картинок с дополнительными расширениями. Файлы BMP содержат подробные несжатые данные о каждом пикселе изображения, включая его цвет, расположение, частичную прозрачность. А также поддерживают различные глубины цвета, включая черно-белый, серый, индексированный и полноцветный. Имеет поддержку Windows и может быть открыт простым двойным кликом по файлу. Из минусов — большой объем файла.

Расширения: .bmp, .dib и .rle

ICO

ICO формат обычно содержит один или несколько значков разных размеров и разрешений чаще всего квадратного формата 16, 32 или 48 пикселей. Формат поддерживает прозрачность и чаще всего используется для создания иконок в ОС Windows и для создания фавиконов (иконок вкладок браузера) наряду с PNG и JPG. Вот пример программ, которые могут открывать формат ICO: Adobe Photoshop, Microsoft Paint, Windows Picture.

Расширение: .ico

PSD

PSD — промежуточный формат для работы в Photoshop. Открывается только в программах компании Adobe. Файлы PSD могут содержать не только изображение, но и различные слои, маски, настройки, текст, анимации и другие элементы, используемые при создании и редактировании изображения. Особенность формата PSD состоит в том, что он поддерживает слои, что позволяет пользователю работать с каждым элементом изображения независимо, изменять их порядок, применять различные эффекты. Благодаря этому, формат PSD идеально подходит для задач, требующих высокой степени контроля над каждым элементом, например: создания сложных многослойных композиций, ретуширования фотографий, создания иллюстраций.

Расширение: .psd

WebP

Небольшой вес, поддержка прозрачности — главные особенности WebP. С его помощью можно на 1/4 уменьшить вес файлов, созданных в форматах PNG и JPEG. Потери качества при сжатии незначительны. Его часто используют программисты для дополнительной подгрузки изображений на сайт. Поддерживается почти всеми современными браузерами.

Расширение: .webp

HEIF

Новый формат с более эффективным сжатием, чем JPEG. В этом и состоит его главная особенность. В HEIF можно создать изображение с высоким разрешением, но меньшим весом. Расшифровка аббревиатуры даёт комбинацию «High-Efficiency Image File», означающую «изображение высокой эффективности». Формат расширяет возможности фотографов и программистов. Его потенциал сравним с возможностями RAW. Также он поддерживает анимацию, сохраняет метаданные и может хранить в себе разные типы изображений.

Расширения: .heic или .heif

AVIF

AVIF — конкурент формата HEIF. Возможности аналогичны, но глубина цвета, эффективное сжатие (с потерями и без), квантование изображения — его прерогатива. Минусы безусловно присутствуют. Главный — ограниченность поддержки браузерами и программами.

Расширение: .avif

Векторные форматы изображений

Векторный формат подчиняется математическим формулам. Картинки создаются с помощью кривых с заданной траекторией. Состоит такая картинка из контура и заливки цветом. Точная детализация в векторе невозможна. Задача этой графики — лаконичность, которую используют для создания логотипов и значимых элементов интерфейса.

Вес такого изображения гораздо легче, чем у растра. Но главная особенность (она же преимущество) — масштабируемость. Вектор можно сжимать и растягивать до больших величин, не утрачивая качество. То есть оно всегда остается прежним.

SVG

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

Расширения: .svg или .svgz

PDF

Самый распространённый формат векторной графики. При этом — востребованный и популярный. В отличие от других векторных форматов, PDF прост в работе. Его назначение — работа с документами, создание электронных брошюр и презентаций. Преимуществ у PDF много:

• легко открывается и скачивается в браузере
• адаптирован к печати
• поддерживает многостраничность
• совмещает слои — растровые и векторные.

Но есть и недостатки:

• ограниченный набор программ для работы
• потеря качества при конвертировании.

Расширение: .pdf

EPS

Формат для графических дизайнеров, созданный разработчиками Adobe Illustrator. EPS используется для создания рисунков, иллюстраций и логотипов. Точная передача цвета позволяет использовать его в печати при создании макетов. Поддерживает разные слои, что позволяет комбинировать их при вёрстке печатных изданий. Масштабирование и возможность изменения элементов — главные особенности и достоинства формата. Однако даже небольшая картинка, созданная в формате EPS, занимает значительно пространство, поэтому браузеры не поддерживают загрузку таких файлов. То есть перед публикацией файла его придётся перевести в более лёгкий формат — векторный SVG или растровые PNG, JPEG, WebP.

Расширение: .eps

AI

Аналог формата EPS, также созданный разработчиками Adobe Illustrator. Но этот формат поддерживает прозрачность. AI подходит для вёрстки, создания рисунков и иллюстраций. Главная особенность — возможность одновременного создания разных рабочих областей, что ценно при вёрстке сайта. Однако с растровыми изображениями он несовместим. Возникают трудности и с экспортом. Для этого необходимо установить плагин или перенести изображение в другой формат. Приоритетные зоны для работы и просмотра — Adobe Illustrator, Adobe Photoshop, Corel Paint Shop Pro и Adobe Reader.

Расширение: .ai

CDR

CDR создавался для профессиональных платформ CorelDRAW Graphics Suite и Corel Paintshop Pro. Сам CDR содержит сжатый и закодированный файл, открыть который позволяют только указанные выше программы. CDR предназначен для больших графических проектов. В этом и есть его преимущество. Реклама, иллюстрации — основной спектр задач этого формата. Высокое разрешение — особенность и достоинство CDR. Масштабирование применяется априори. Формат предназначен исключительно для дизайнеров и программистов.

Расширение: .cdr

Как конвертировать один формат в другой

Для конвертации одного формата в другой (растрового в векторный и наоборот) используют различные сайты и специализированные программы. О том, что подобная конвертация возможна, догадаться несложно. Но здесь сразу возникают вопросы. Их будет меньше, когда речь идёт о конвертации растрового векторного формата в растровый, и очень много в случаях «наоборот», поясним:

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

Важно, что для любой конвертации требуется дополнительный «инструмент» — специализированная программа или сайт. Поэтому и о них скажем несколько слов.

Встроенные функции графических редакторов

Многие форматы можно конвертировать непосредственно внутри графического редактора, в котором вы работаете, например:

• Figma: вы можете свободно выделенные элементы (отдельные элементы, целые области или группированные объекты) экспортировать в JPG, PNG, SVG, PDF. Однако отметим, что если в элементах будет присутствовать растровый формат изображений, то они также останутся растровыми и в SVG формате.
• Adobe Photoshop: вы можете преобразовать файл, в котором вы работаете, в JPEG, PNG, PSD, SVG, GIF или TIFF.
• Adobe Illistrator: JPEG, PNG, BMP, PSD, SVG, TIFF, WebP и другие.

Сайты

Онлайн-конверторы, размещённые на сайтах, выгодно использовать при работе с растровыми изображениями, особенно когда речь идёт о PDF. Но в принципе это могут быть любые растровые файлы. Для работы с конкретным форматом достаточно ввести в поиске нужный запрос, и все платформы будут доступны. Это могут быть как платные, так и бесплатные ресурсы. Самые популярные на сегодняшний день — бесплатные платформы Convertio и Online-Convert.

Специализированные программы

Эти программы используют для серьёзной работы, чаще — с конвертацией растра в вектор. Сами по себе программы достаточно тяжелы, то есть для их установки потребуется приличная мощность. Скачивают такие программы из AppStore и Google Play. Альтернатива (сторонние сайты) не приветствуется.

Рекомендуемые приложения для конвертации:

• JPEG PNG
• Convert JPG, PNG to PDF
• Mage Converter PDF/JPG/PNG.

Проблемы, лайфхаки

Проблемы возникают в тот момент, когда к конвертации приступают не подумав, предположив, что графический редактор самостоятельно всё «сообразит». Но думать должен человек, а не графический редактор. Поэтому для начала нужно чётко определить:

• Что конвертируем и в какой формат
• Чего ожидаем в результате.

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