Найти в Дзене

Что такое растровое и векторное графические изображения

Графическое изображение бывает разным: растровое или векторное. Пиксель – наименьший кусочек растрового изображения. Пиксель может содержать либо 1 бит либо 3 байта (RGB), либо биты любой другой цветовой системы. Как я рассказывал в своей прошлой статье про «Что такое биты и байты», кстати кто не читал, может перейти по этой ссылке, RGB это цветовая система цветов, которая может дать любому пикселю любой цвет из шестнадцати миллионов семьсот семьдесят семь тысяч двести шестнадцать различных вариантов. Если пикселю присвоен один бит, то цвет будет либо черный(0), либо белый(1). Изображение имеет не только пиксели, но и разрешение, соотношение сторон изображения и формат файла. Давайте все по порядку. Разрешение – количество пикселей по ширине и высоте изображения. Оно измеряется, как вы уже наверно поняли, в пикселях. Разрешение бывает разных видов: Соотношение сторон изображения – наш с вами второй пункт. Соотношение сторон изображения тоже определяет разрешение изображения. Соотн
Оглавление
Графическое изображение бывает разным: растровое или векторное.

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

Пиксель – наименьший кусочек растрового изображения. Пиксель может содержать либо 1 бит либо 3 байта (RGB), либо биты любой другой цветовой системы. Как я рассказывал в своей прошлой статье про «Что такое биты и байты», кстати кто не читал, может перейти по этой ссылке, RGB это цветовая система цветов, которая может дать любому пикселю любой цвет из шестнадцати миллионов семьсот семьдесят семь тысяч двести шестнадцать различных вариантов.

Если пикселю присвоен один бит, то цвет будет либо черный(0), либо белый(1).

Изображение имеет не только пиксели, но и разрешение, соотношение сторон изображения и формат файла. Давайте все по порядку.

Разрешение – количество пикселей по ширине и высоте изображения. Оно измеряется, как вы уже наверно поняли, в пикселях. Разрешение бывает разных видов:

  1. SD(Standard Definition)360p – 480x360
  2. 480p – 640x480
  3. HD(High Definition)720p - 1280x720
  4. Full HD(1080p) – 1920x1080
  5. UHD(Ultra High Definition)2K – 2048x1080
  6. 4K – 3840x2160
  7. 8K – 7680x4320

Соотношение сторон изображения – наш с вами второй пункт. Соотношение сторон изображения тоже определяет разрешение изображения. Соотношение сторон бывает разным:

  1. 1:1 — квадратный формат. Используется для логотипов, аватарок, иконок в социальных сетях.

Разрешение 1200x1200, соотношение сторон 1:1. На данном изображении показаны квадрат, пятиугольник, прямоугольный треугольник и круг. Формат изображения - BMP
Разрешение 1200x1200, соотношение сторон 1:1. На данном изображении показаны квадрат, пятиугольник, прямоугольный треугольник и круг. Формат изображения - BMP

  1. 4:3 — стандартный прямоугольник. Применяется для фотографий, презентаций, изображений для сайтов. Подходит для большинства типов контента, в том числе для печатных материалов.
  2. 3:2 — классический формат. Используется для пейзажей, портретов, фотографий. Формат близок к естественным пропорциям, воспринимаемым человеческим глазом.

Разрешение 4K, соотношение сторон 16:9.
Разрешение 4K, соотношение сторон 16:9.

  1. 16:9 — широкоформатный. Применяется для видео, рекламных баннеров, презентаций. Подходит для современных экранов телевизоров и видеоплатформ, таких как Дзен или Rutube.
  2. 1.91:1 — широкий горизонтальный. Используется для баннеров и изображений для социальных сетей. Оптимизирован для отображения на новостных лентах и рекламных блоках.

Формат файла изображения – наш последний пункт из списка. Давайте взглянем какие есть форматы растрового изображения:

  1. Формат PNG (Portable Network Graphics) – формат с сжатием без потерь, поддерживает прозрачность. Подходит для веб-графики и изображений с прозрачным фоном.
  2. Формат JPEG (JPG) – используется для хранения фотографий и изображений с плавными переходами цветов. Использует сжатие с потерями, что позволяет уменьшить размер файла, но может привести к потере качества.
  3. Формат GIF (Graphics Interchange Format) – поддерживает анимацию и прозрачность, но ограничен 256 цветами. Часто используется для простых анимаций и иконок.
  4. Формат BMP(Bitmap) – формат без сжатия, сохраняет все данные изображения. Обладает большим размером файла, редко используется в современных приложениях.

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

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

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

  1. Формат SVG — основной формат для отображения векторной графики в Интернете, описывается с помощью XML, легко масштабируется.
  2. Формат EPS — универсальный формат, поддерживаемый многими графическими редакторами, применяется в полиграфии для печати визиток, буклетов и рекламных материалов.

Векторная графика применяется в различных областях, например:

  1. Айдентика — изображения легко адаптируются под носители разных размеров — от маленьких визиток до крупных билбордов.
  2. Иконки и интерфейсы — на сайтах и в мобильных приложениях часто используются векторные иконки, так как они легко редактируются и подходят для экранов разного разрешения.
  3. Полиграфия и наружная реклама — афиши, баннеры и вывески печатаются в высоком качестве без пикселизации.
  4. Инфографика — графические представления данных в виде диаграмм, схем и карт создаются с помощью вектора, чтобы оставаться чёткими и легко читаемыми.

На этом всё. Подписываетесь, ставьте лайки, и смотрите мои прошлые и будущие публикации. До скорых встреч!