Растровые и векторные изображения

Для начала, нужно знать, что существует два типа 2D графики - растровая и векторная. Очень важно понимать разницу между этими типами изображений. 

От вида графики зависит выбор возможной технологии печати.

Давайте начнем с более распространенного типа графики – с растровых изображений.

Понятие растрового изображения

Растровые изображения это изображения, которые состоят из очень маленьких прямоугольников - пикселей разного цвета.

У каждого пикселя есть свое место на рисунке и свой собственный цвет.

Каждое изображение имеет фиксированное количество пикселов. Их вы можете видеть на экране монитора, большинство из которых отображают примерно от 70 до 100 пикселей на 1 дюйм (2,54 см) фактическое количество зависит от вашего монитора и настройки самого экрана.

Размер изображения и его разрешение

Растровые изображения зависят от разрешения. Разрешение изображения это число пикселей в изображении на единицу длины. Оно является мерой четкости деталей растрового изображения и обычно обозначается как dpi (точек на дюйм) или ppi (пикселей на дюйм). Эти термины в некотором смысле синонимы, только ppi относится к изображениям, а dpi — к устройствам вывода. Именно поэтому dpi вы можете встретить в описании мониторов, цифровых фотоаппаратов и т. д.

Чем больше разрешение, тем меньше размер пикселя и тем больше их приходится на 1 дюйм, и соответственно, тем лучше качество картинки.

Разрешение каждого изображения подбирается в зависимости от того, где вы планируете его использовать:

• Для размещения в интернете достаточно 72 ppi, поскольку они быстрее загружаются. НО при растягивании картинки с вконтакте размером 5х5см на футболку во всю грудь мы получим все прелести сжатия изображения. Детали пропадут и появятся артефакты.

Так выглядит фото с интернета после нескольких пересохранений:

• Так, для того чтобы напечатать изображение в хорошем качестве, разрешение должно быть не ниже 300 ppi. Это основное требование для цифровой печати. Предоставлять изображение свыше 600 ppi как правило нет смысла, так как разницы при печати не будет видно.

Так выглядит картинка пригодная для полноцветной печати:

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

Форматы растровых изображений

К самым распространенным форматам растровых изображений относятся:

• JPEG, JPG
• PNG
• TIFF
• PSD
• BMP

Файлы форматов PNG, TIFF, PSD поддерживают прозрачность фона. При этом не стоит забывать , что прозрачный фон не будет таковым, если изображение пересохранить в формат не поддерживающий прозрачность, например PNG в JPEG.

Самые популярные программы для работы с растровой графикой это Adobe Photoshop, Gimp, Corel Photo-Paint, Corel Paint Shop Pro.

Что такое векторные изображения

Векторные это изображения, состоящие из множества отдельных, масштабируемых объектов (линий и кривых), которые определены с помощью математических уравнений.

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

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

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

Векторные изображения, как правило, создаются с помощью специальных программ. Вы не можете отсканировать изображение и сохранить его в виде векторного файла без использования преобразования (трассировки) в программах вроде Adobe Illustrator или Corel Draw.

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

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

Основные виды

Рассматриваемый тип изображений может относиться к различным типам. Каждый формат имеет свои ключевые особенности. Вот описание самых распространенных типов векторных изображений:

1. EPS – наиболее распространенный вариант. Он разработан Adobe на PostScript. Поддерживается большинством специализированных программ и графическими редакторами.
2. DWG – известный формат, с которым знакомы инженеры и проектировщики. Он был создан компанией Autodesk. Применяется в качестве универсального типа чертежных файлов в AutoCAD. Не имеет совместимости ранних и поздних версий. Может быть дополнительно открыт при помощи Corel Draw.
3. CDR – разработка, с которой имеет дело графический редактор Corel Draw. Не имеет совместимости с другими векторными расширениями и собственными более ранними версиями.
4. AI – файл, созданный при помощи Adobe Illustrator. Допускается несовместимость ранних и поздних версий.
5. FLA – рабочий формат Adobe Flash. Он ориентирован на анимационные изображения. Для создания управляемых сценариев требуется использование языка Action Script.
6. SVG – расширение векторной графики, базирующееся на языке XML-разметки. По своей структуре оно представляет собой текстовый файл. Это дает возможность редактировать векторные документы через текстовый редактор. Управление атрибутами изображения предусматривается через таблицы стилей CSS. Поддерживает анимацию.
7. SWF – формат, который используется в приложении Flash Player. Дает возможность работать с анимацией.

Теперь понятно, что такое векторная графика, и какой она может быть. Можно рассмотреть преимущества и недостатки соответствующей формы представления рисунков на экранах устройства.

Что такое SVG

SVG (сокращение от Scalable Vector Graphics — «масштабируемая векторная графика») — это вид графики, которую создают с помощью математического описания геометрических примитивов (линий, кругов, эллипсов, прямоугольников, кривых и так далее), которые и образуют все детали будущего изображения.

То есть в этом формате хранится не сама картинка, а инструкции для её построения по точкам и кривым. Они написаны на языке разметки SVG, расширяющем XML.

Достоинства SVG

Прелесть SVG раскрывает масштабирование. Если увеличить растровое изображение сверх 100%-ного размера — проявляется пикселизация: отдельные точки превращаются в одноцветные блоки пикселей, границы областей становятся ступенчатыми, и в целом картинка выглядит негладко, некрасиво.

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

У svg-графики есть ещё одно достоинство. Её можно открывать как HTML или CSS и менять в любом редакторе кода, и даже на лету. Подробнее об этом ниже.

И наконец, при прочих равных SVG весит намного меньше растровых изображений.

Недостатки SVG

Как таковых недостатков у SVG нет, но есть некоторые моменты, о которых стоит знать:

• SVG не может быть использован для фотографий. В теории вы можете получить фотографию в формате SVG, но такой файл будет очень большим. Кроме того, файл останется тем же растровым изображением, которое будет покрыто оболочкой SVG.
• Не поддерживается старыми браузерами.

В общем, SVG-формат – это наилучший вариант для использования иконок, анимированных элементов и иллюстраций на сайте.

EPS

EPS (Encapsulated PostScript) — это формат векторных изображений, созданный компанией Adobe Systems в 1980-х годах для профессиональной и высококачественной печати изображений. Эта функция актуальна до сих пор: файлы EPS часто требуются для крупномасштабных дизайн-работ, таких как баннеры на рекламных щитах, постеры и иная уличная реклама. Формат EPS основан на языке PostScript, который описывает внешний вид изображения с помощью геометрических фигур, линий и текста. Файлы EPS могут содержать как растровые, так и векторные данные, что делает их очень универсальными для создания сложных иллюстраций и дизайна.

Плюсы и минусы формата EPS

Почему EPS прослужил так долго и остается востребованным до сих пор? Секрет в уникальном сочетании преимуществ.

• Высокое качество. Документы в формате EPS используют векторную графику, которая позволяет сохранять картинки в высоком разрешении, независимо от масштаба. Это означает, что изображения могут быть увеличены или уменьшены без потери качества.
• Совместимость. Формат широко поддерживается различными программами для работы с графикой, включая Adobe Illustrator, CorelDRAW, Inkscape и другие. Это упрощает и ускоряет работу над проектами в команде, а также обмен файлами.
• Поддержка сложных эффектов. Изображения в формате EPS могут содержать градиенты, стандартные и цветные тени, прозрачные и полупрозрачные элементы, что позволяет создавать сложные и красивые векторные изображения.
• Встраивание шрифтов. В EPS-файле могут содержаться шрифты, что гарантирует правильное отображение текста при открытии файла на других компьютерах.

В формате EPS часто дополнительно сохраняют логотипы для последующей печати.

Однако со временем EPS все же отошел на второй план, так как имеет ряд объективных недостатков. Вот они.

• Большой размер файлов. Файлы могут быть довольно объемными, особенно если они содержат сложные векторные объекты или растровые изображения в высоком разрешении. Это может создавать проблемы с передачей и хранением таких файлов.
• Сложность редактирования. Хотя файлы EPS поддерживаются большинством графических редакторов, работать с ним может быть сложно и непривычно, особенно для новичков. Наибольшие трудности обычно вызывает изменение текста и цветов.
• Совместимость с программами. Несмотря на то что EPS поддерживается многими программами, не все из них корректно отображают его и позволяют редактировать содержимое, особенно если файл содержит специфические для PostScript функции.

Сферы применения EPS

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

1. Издательское дело. EPS — один из основных форматов файлов для профессиональной печати. По данным компании Adobe, с ним способны работать более 90% печатных установок по всему миру.
2. Графический дизайн. В этом формате все еще часто сохраняют векторную графику, в частности, логотипы, иллюстрации, шрифты и другие элементы. 
3. Веб-дизайн. Для отрисовки макетов сайтов, приложений, рекламных креативов очень часто требуются иллюстрации, фоны и иконки. Их спокойно можно скачивать со стоков в формате EPS и затем добавлять в проект. Весь проект при этом можно сохранить в растровом формате — PSD, PNG или JPG.
4. Маркетинг и реклама. В данном формате все еще нередко делают макеты открыток, плакатов и листовок, рекламу для размещения на транспорте, креативы для различных медиа — газет, журналов и др. 
5. Наука и образование. EPS-файлы довольно широко применяют для создания диаграмм, схем, графиков и других визуальных элементов, которые добавляют в научные статьи, учебники, презентации и т. д. Простота векторной графики в сочетании с масштабируемостью и готовностью к печати делают EPS хорошим выбором в этом случае. 

EPS-элементы часто используются для научной инфографики.

Вот какие проекты могут выполнять в формате EPS:

• логотипы — в монохромном и цветном варианте;
• полиграфическая продукция — флаеры, визитки, брошюры, постеры и др.;
• иллюстрации и рисунки — как простые плоские, так и более сложные художественные;
• техническая графика — спецификации, чертежи и схемы с таблицами и сопроводительным текстом;
• типографика — сами шрифты сохраняют в других форматах, однако их презентации нередко выполняют в EPS благодаря его способности сохранять четкость линий. 

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

При создании подобных брошюр нередко применяют EPS-элементы.

Формат PDF

Название формата — это аббревиатура из нескольких слов, полное название на английском — Portable Document Format. Расшифровка PDF на русском буквально означает «портативный формат документов». Если говорить простыми словами «для чайников», то это специальный режим сжатия, который сохраняет оригинальные стили текста и картинок.

Расширение было создано фирмой Adobe System специально для их продукта Adobe Acrobat. На данный момент ПДФ считается стандартом для хранения и передачи цифровых документов.

Какие плюсы использования ПДФ

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

• Файлы в этом формате сохраняют оригинальное форматирование при открытии в любом приложении для чтения. Единственное исключение – простейшие текстовые редакторы вроде Блокнота от Windows.
• ПДФ можно создать из картинки без необходимости перепечатки текста. Это значительно ускоряет работу, если вы работаете со сканами.
• Электронные бумаги в этом формате можно подписывать прямо на компьютере, а также добавлять специальные формы для заполнения.
• В ПДФ-документ можно встраивать комментарии и пометки, которые не изменяют его внешний вид, но видны другим пользователям. Это полезно при совместной работе над проектом.
• Можно наложить несколько уровней безопасности, в том числе включить защиту от копирования, печати и полностью запретить открытие.
• Не знаете, как переслать документ по e-mail или анкету на Госуслуги, если стоит ограничение на размер? Создайте документацию в PDF-формате — он отличается небольшим размером и идеально подходит для пересылки по интернету.

Все эти особенности позволяют применять данный формат как в бизнесе, так и в личной деятельности.

Какие минусы у ПДФ-формата

Конечно, не обошлось без недостатков. У PDF можно обнаружить следующие минусы:

• Редактировать подобные файлы можно только в специальных программах.
• Если ПДФ-документ состоит из изображений, для его коррекции потребуется специальный модуль распознавания текста.

Как видите, у формата есть и минусы, но они не критичные. В большинстве случаев их можно обойти, установив подходящий софт.

Преимущества и недостатки

Вектор в графике имеет как сильные, так и слабые стороны. К преимуществам такого типа отрисовки относят следующие моменты:

1. Небольшой размер файлов при умеренной или небольшой сложности и детализации картинок. Объем существенно возрастает при увеличении количества и сложности деталей.
2. Поддержка простого редактирования и масштабирования изображений.
3. Возможность внесения изменений: растягивания, перемещения, вращения и так далее. Качество рисунка ухудшаться не будет.
4. Универсальность. Файл, созданный один раз в векторном формате, разрешено использовать для разных целей и носителей без значимых изменений. Каждый раз отрисовка всего изображения с нуля не нужна.
5. Простой перевод вектора в растр. Обратное форматирование требует больше ресурсов и сил.
6. Возможность выполнения сложения, вычитания, пересечения, а также дополнения над объектами на экране.
7. Относительно простое освоение навыков работы с векторными файлами.

Недостатки у такого способа обработки графики следующие:

1. Технические ограничения по использованию. Векторное изображение – это формат, который не поддерживает высокую степень детализации. Рассматриваемым способом не получится создать картинку со значительным числом деталей, а также градиентами.
2. Отсутствие поддержки вектора современной техникой. Изучаемый способ обработки графики не используется в принтерах, сканерах, фотоаппаратах и так далее. Цифровая техника поддерживает растровый формат.
3. Проблемы с совместимостью между отдельными типами векторов или программным обеспечением. Часто редакторы для рассматриваемого способа создания картинок конкурируют друг с другом. Итогом становится то, что при использовании «не родной» программы получить на выходе качественный рисунок без дефектов проблематично.
4. Высокие требования к компьютеру, если планируется отрисовка сложных изображений. Это связано с тем, что в файле размещаются только координаты. Отрисовка выполняется только после открытия соответствующего документа. Это может потребовать значительных ресурсов.
5. Повышенная сложность и трудоемкость создания картинок высокого качества.
6. Ограничения при использовании эффектов. Принципы форматирования векторов не дают задействовать в работе некоторые эффекты, тени и градиенты.

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

Где применяется

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

Векторная графика применяется в следующих отраслях:

• реклама;
• полиграфия;
• архитектура;
• проектирование;
• формирование чертежей, схем и карт;
• печатные издания;
• конструкторские разработки.

Векторный формат можно встретить в дизайне и компьютерной графике, а также в веб-программировании.

Подробное сравнение растровых и векторных изображений:

РАСТР

1. Высокая реалистичность изображения.
2. Все фотографии растровые.
3. Для создания не обязательно использовать профессиональные программы.
4. Для хорошего качества печати нужно высокое разрешение.
5. Некоторые растровые картинки возможно векторизовать с потерей качества.
6. Возможности редактирования ограничены по сравнению с вектором.
7. Чтобы убрать фон с картинки нужно редактирование в графических программах.
8. Файлы весят много.

ВЕКТОР

1. Тяжело добиться фотореалистичности.
2. Стандарт для логотипов.
3. Для создания изображение нужны специальные дизайнерские программы.
4. Наилучшее качество при печати.
5. Векторные картинки можно растрировать без потери качества.
6. Легко редактировать, в сравнении с растровыми файлами.
7. Для прозрачности достаточно экспортировать в формате поддерживающем прозрачность (PNG, TIFF, PSD).
8. Малый вес файлов.