При нахождении на сайте Вы соглашаетесь с политикой обработки персональных данных.
Всё понятно!
Color Depth (глубина цвета)
Color Depth (глубина цвета) — это количество бит, используемых для представления цвета одного пикселя в изображении: чем больше бит, тем больше оттенков можно различить. Её измеряют в битах на пиксель (bpp) или в битах на каждый цветовой канал.
Кратко
- Число цветов равно 2 в степени числа бит: 8 бит дают 256 цветов, 24 бита (True color) — 16 777 216.
- 24 бита на пиксель — это по 8 бит на красный, зелёный и синий каналы; 32 бита — те же 24 бита цвета и 8 бит для прозрачности.
- Глубина цвета влияет на размер файла, но не строго пропорционально: на него влияет сжатие.
- Для обычных сайтов важнее формат и размер изображения; глубину выбирают по задаче: фото, логотип, анимация.
Кому и зачем это знать
С запросом «глубина цвета» приходят люди с разными задачами. Найдите свою ситуацию.
Школьник, студентСитуация: Нужно понять, что такое глубина цвета, или решить задачу по информатике.Зачем: Задачи сводятся к степеням двойки: сколько бит на пиксель, столько цветов и столько данных.Что сделать: Запомните: число цветов равно 2 в степени числа бит на пиксель. Разберите таблицу ниже и пример расчёта размера файла.
Контент-менеджер, маркетологСитуация: Выбираете формат и подготавливаете изображения для сайта или рекламы.Зачем: От глубины цвета зависят и качество градиентов, и размер файла, а размер влияет на скорость загрузки страницы.Что сделать: Для фотографий используйте формат с достаточной глубиной цвета, например JPEG. Для простых логотипов и анимации с ограниченной палитрой подходит GIF. Сравните размер файла до и после экспорта.
Дизайнер, фотографСитуация: Нужно выбрать режим документа, камеры или монитора.Зачем: Низкая глубина даёт заметные ступени на плавных переходах цвета, высокая даёт запас для обработки, но увеличивает файл.Что сделать: Работайте в режиме с запасом глубины, а для публикации экспортируйте в стандартную. Проверяйте градиенты и небо на полосатость.
Владелец сайтаСитуация: Сайт медленно грузит картинки, подрядчик говорит о цветовом режиме.Зачем: Тяжёлые изображения замедляют страницу, а глубина цвета — один из факторов размера.Что сделать: Попросите показать размер файлов в килобайтах и формат. Не просите «убавить цвета» без проверки внешнего вида: решает формат, размеры и сжатие.
Глубина цвета: таблица значений
Число цветов считается как 2 в степени числа бит на пиксель. Основные значения:
| Глубина | Цветов | Название и примечание |
|---|---|---|
| 1 бит | 2 | монохром: два цвета |
| 4 бита | 16 | фиксированные палитры, например CGA, EGA, VGA |
| 8 бит | 256 | индексированный цвет: в пикселе хранится номер цвета из палитры |
| 16 бит | 32 768 или 65 536 | High color; вариант зависит от раскладки бит по каналам |
| 24 бита | 16 777 216 | True color: по 8 бит на красный, зелёный и синий каналы |
| 30 бит | 1 073 741 824 | Deep color: по 10 бит на канал |
| 36 бит | 68 719 476 736 | по 12 бит на канал |
| 48 бит | 281 474 976 710 656 | по 16 бит на канал |
Значения приведены по статье Wikipedia о глубине цвета. В прежней версии этой страницы 8 бит на канал и 16,7 млн цветов были смешаны: 8 бит на канал соответствуют 24 битам на пиксель.
Бит на пиксель и бит на канал: в чём разница
Глубину цвета указывают двумя способами. Бит на пиксель (bpp) показывает, сколько данных занимает весь цвет точки. Бит на канал (bpc) — сколько приходится на каждую составляющую цвета: красную, зелёную, синюю.
- 24 бита на пиксель равны 8 битам на канал при трёх каналах.
- 32 бита — это 24 бита цвета и 8 бит для альфа-канала (прозрачности) либо неиспользуемые биты.
- Индексированный цвет. При малой глубине в пикселе хранится не сам цвет, а номер в таблице цветов (палитре). Поэтому в GIF до 256 цветов: подробнее формат GIF.
Как глубина цвета влияет на размер изображения
Размер изображения без сжатия равен числу пикселей, умноженному на глубину цвета в битах, и делённому на 8 для перевода в байты. Условный пример, цифры выдуманы для иллюстрации: изображение 1920×1080 пикселей.
| Глубина | Расчёт | Размер без сжатия |
|---|---|---|
| 8 бит | 2 073 600 × 8 ÷ 8 | 2 073 600 байт, около 2,0 МБ |
| 24 бита | 2 073 600 × 24 ÷ 8 | 6 220 800 байт, около 5,9 МБ |
| 32 бита | 2 073 600 × 32 ÷ 8 | 8 294 400 байт, около 7,9 МБ |
Реальные файлы сжимаются, поэтому разница получается другой. В примере статьи Wikipedia один и тот же рисунок занимал 98 КБ в 24 битах и 37 КБ в 8 битах: меньше, но не в три раза. На сайте размер подбирают форматом и сжатием, а не только цветом.
Что выбрать для сайта и рекламы
Выбор зависит от того, что показываете и где. Для сайта итоговый размер и скорость загрузки важнее максимальной глубины. Подробнее о влиянии оформления: дизайн сайта.
| Задача | Что учесть |
|---|---|
| Фотография на странице | Нужна большая глубина цвета для плавных градиентов; следите за размером файла, он влияет на скорость страницы |
| Логотип или иконка с небольшим числом цветов | Хватает ограниченной палитры, файл получается лёгким |
| Анимация | Формат GIF ограничен палитрой до 256 цветов |
| Графика для печати или обработки | Закладывайте запас глубины и храните исходник отдельно от версии для сайта |
Типичные ошибки
- Путать глубину цвета (биты на пиксель) с разрешением (число пикселей).
- Считать, что больше бит всегда лучше: для сайта лишняя глубина увеличивает файл без видимой пользы.
- Складывать цвета каналов с цветами пикселя: 256 значений на канал дают 16 777 216 сочетаний.
- Ждать пропорционального уменьшения файла при снижении глубины: сжатие меняет картину.
Частые вопросы
Что такое глубина цвета?
Количество бит, которое используется для кодирования цвета одного пикселя. Измеряется в битах на пиксель (bpp). Чем больше бит, тем больше возможных цветов.
Как посчитать число цветов по глубине цвета?
Возведите 2 в степень числа бит. 8 бит: 2 в степени 8 равно 256 цветов. 24 бита: 2 в степени 24 равно 16 777 216.
Что такое True color?
Это 24 бита на пиксель, по 8 бит на красный, зелёный и синий каналы. Даёт 16 777 216 цветов.
Что такое High color?
Режим с 16 битами на пиксель: 32 768 или 65 536 цветов в зависимости от раскладки бит по каналам.
Глубина цвета в информатике: как решать задачи?
Определите число цветов, найдите число бит на пиксель как степень двойки, затем умножьте число пикселей на биты и переведите в байты, поделив на 8.
Чем глубина цвета отличается от разрешения?
Разрешение — число пикселей по ширине и высоте. Глубина цвета — сколько бит нужно на один пиксель. Размер файла зависит от обоих значений.
Что означает 32 бита?
Обычно 24 бита цвета и 8 бит для альфа-канала (прозрачности). Иногда эти 8 бит не используются.
Связанные термины
- JPEG: Joint Photographic Expert Group: формат хранения фотографий со сжатием с потерями, а глубина цвета описывает способ кодирования пикселя
- GIF: Graphic Interchange Format: формат с палитрой до 256 цветов, пример низкой глубины цвета
- Дизайн сайта: общее оформление сайта, а глубина цвета — технический параметр изображений