Сравниваем растровую графику и векторную | Важные отличия

Обновлено: 08.11.2022 16:01:39

Графические данные – от банальных изображений до сложных дизайн-макетов с множеством элементов и слоёв – могут упаковываться самыми разными способами. И разница между ними куда глубже, чем может показаться на первый взгляд. В частности, все графические форматы можно разделить на две группы – растровые и векторные.

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

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

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

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

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

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

Именно поэтому решающее значение для «качества картинки» в растровой графике имеет разрешение. Чем больше пикселей на квадратный сантиметр или дюйм – тем более «гладким» кажется визуал.

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

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

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

Кроме того, растровая графика при просмотре минимально нагружает ресурсы компьютера. Именно поэтому она используется в вёрстке веб-сайтов, встраивается в различные документы и файлы. Растровыми форматами являются JPEG/JPG, BMP, PNG, TIFF, ICO и многие другие. RAW, в котором хранятся «сырые» данные с сенсоров фотокамер, тоже к ним относится.

Итак, подведём итоги.

Достоинства

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

  • Способна воспроизводить изображения любой сложности независимо от количества элементов;

  • Довольно проста в просмотре, применяется очень широко и обеспечивает минимальную нагрузку на ресурсы компьютера при воспроизведении.

Недостатки

  • «Гладкость» изображения зависит от разрешения. Чем оно выше – тем более приятной глазу будет «картинка»;

  • Изображения малого или среднего разрешения не подходят для печати на больших полотнах;

  • Да и в принципе растровую графику лучше не масштабировать.

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

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

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

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

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

При рисовании круга компьютеру даётся команда – «Нарисовать круг с радиусом 10% и центром с координатами x=12%, y=52.36%».

Разумеется, описание работы векторной графики, приведённое выше – упрощённое, которое использовалось ещё в 1980-х годах. Сейчас технологии чуть усложнились, но общий принцип остался неизменным.

Векторная графика лишена главной проблемы растровой – она позволяет спокойно масштабировать изображение сколь угодно много. «Картинка» не будет терять ни гладкость, ни резкость, ни чёткости независимо от того, на каком полотне она отображается – хоть на 23-дюймовом экране компьютера, хоть на рекламном щите 6×3 метра, хоть на баннере, который закрывает 27-этажный дом (вроде рекламы Samsung в Москве – высота полотна 80 метров, ширина 40 метров).

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

Эта особенность «вектора» привела к тому, что данные форматы используются очень редко и – в большинстве случаев – в очень узкоспециализированных сферах. Например, в проектировании и рисовании чертежей (CAD-системы вроде AutoCAD, «Компас 3D» или даже Microsoft Visio используют именно «вектор»), составлении карт и различных схем. Кроме того, векторная графика применяется в полиграфии и дизайне рекламных материалов.

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

Итак, подведём итоги.

Достоинства

  • Идеально подходит для проектирования чертежей, схем и карт;

  • Позволяет легко масштабировать изображение с сохранением качества;

  • Позволяет вносить правки без риска «всё испоганить».

Недостатки

  • Низкая детализация и реалистичность готовых изображений. Точнее, можно добиться высокой реалистичности, но тогда «картинка» будет «тяжёлой» во всех отношениях – включая долгую обработку компьютером;

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

Как было сказано выше, векторную графику лучше всего использовать в сфере полиграфии. Тогда она обеспечит достаточную «гладкость» и «красоту» картинки независимо от размера полотна. А вот для рисования и обработки фотографий рекомендуется ограничиться растром.

Кроме того, векторная графика легко растрируется – то есть переводится в пиксельное изображение желаемого разрешения. А вот растровая в вектор конвертируется с трудом и потерей качества.

Что лучше – растровая или векторная графика?

графика

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

Сравним эти два варианта.

Характеристика

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

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

Составляющие изображения

Отдельные пиксели

Формулы, описывающие геометрические фигуры с опорными точками

Поведение при масштабировании

Теряет качество, «рассыпается»

Качество не изменяется

«Вес» файла

В зависимости от разрешения

В зависимости от сложности

Количество деталей

Поддерживает хорошую детализацию

Хорошую детализацию можно создать, но это приведёт к повышению сложности

Сфера применения

Фотографии, веб-изображения, встраиваемые иллюстрации

Создание чертежей, схем, карт, полиграфия и допечатная подготовка



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


Оцените статью

 
Всего голосов: 0, рейтинг: 0
Комментарии
Загрузка комментариев...