Как сделать так, чтобы цвет моего логотипа выглядел одинаково в Web & Print?

  • Мой клиент хотел использовать цвет #dd0017 в качестве основного красного цвета на своем веб-сайте.
  • На протяжении всего пути мы разработали весь сайт и логотип в этом цвете (я сделал логотип в RGB).
  • Теперь он просит печатную версию. Я попытался сделать логотип таким же, как #dd0017. Но это совершенно не имеет значения в иллюстраторе или фотошопе. Он автоматически переключается на #db1e26.
  • Более того, большинство веб-сайтов показывают, что эквивалентный цветовой код для CMYK (0,100,93,13). Когда я пытаюсь это сделать, он получает еще один шестнадцатеричный код # d11628.
  • Обратите внимание, что я немного новичок в вопросах цветов. Я веб-дизайнер, но иногда мне нужно делать логотипы. Но я действительно не очень их понимаю.

Так есть ли решение? Если нет, может ли кто-нибудь предложить мне, как я должен объяснить это клиенту?

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

Ответы (5)

вот технический ответ

Говорить, что цвет #dd0017 , бессмысленно, если только он не связан с информацией о том, какое цветовое пространство вы используете! Поэтому и преобразование из #dd0017 в CMYK бессмысленно. Вычеркнув это из повестки дня, мы можем начать смотреть, что то же самое будет означать в вашем сценарии.

Когда вы говорите о чистом цвете, таком как #dd0017 , вы указываете цвет, который отличается на каждом мониторе. Если говорить об одном и том же, у вас возникнут проблемы, потому что мы не знаем, имеете ли вы в виду:

  • Так же, как на вашем мониторе
  • Так же, как на мониторе ваших клиентов
  • То же, что и в стандартном цветовом пространстве

Посмотрите, как одно и то же число дает разные цвета в разных цветовых пространствах. Чтобы имело смысл преобразовывать точные цвета, вы должны указать используемое цветовое пространство. Так что, например , #dd0017 в цветовом пространстве sRGB имеет смысл. Цифры не важны и без этой информации совершенно бесполезны. Таким образом, числа не представляют цвет как таковой, они представляют цвет в одном пространстве, разные пространства RGB будут иметь разные числовые значения.*

Введите управление цветом. Чтобы все это имело какой-то смысл, вам нужно знать, какой цвет в каком-то нейтральном пространстве устройства. По сути, вам нужно измерить монитор с помощью колорметра (например, калибратора Montor, такого как ColorMunki ). Кроме того, вам нужно знать, каковы условия освещения на рабочем столе, поэтому, чтобы быть точным, вам нужно измерять этот монитор там, где он используется (или делать это постоянно). Теперь вы можете создать профиль для своего монитора, который расскажет нам, как выглядит конкретная комбинация монитор/рабочее пространство, поскольку каждый монитор в мире уникален.

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

Хорошо, теперь вы можете преобразовать цвет в нейтральное пространство, но, очевидно, вам все еще нужно знать пространство принтера. Для принтера процесс почти такой же. Коммерческий принтер, скорее всего, использует калибровку по некоторому стандартному пространству, поэтому снова указывать значения CMYK без указания пространства бессмысленно. Но если вы хотите сделать то же самое с офисным принтером, его тоже необходимо откалибровать, я предлагаю не менее 3 раз за срок службы картриджа с тонером.

поймать 13

Сопоставление цветов связано со многими проблемами, но центральный вопрос заключается в том, что делать с цветами, которые невозможно воспроизвести. Посмотрите, может быть, ваш цвет превышает цвета, которые может воспроизвести ваш принтер CMYK. Размер каждого пространства называется гаммой, и превысить гамму легко, поскольку пространство sRGB намного больше, чем стандартные пространства CMYK SWOP, FOGRA, GRACol и т. д.

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

Так что да, это можно сделать, но требует от вас довольно много работы.

* Это то, что Photoshop делает для вас, так как было сказано, что пространство, с которым вы работаете, — это X, а монитор — Y, и поэтому числа меняются, чтобы соответствовать.

Также обратите внимание, что Adobe предлагает безопасный цвет, ближайший к текущему цвету, при выборе цвета из палитры. Он различает цвета, безопасные для печати и безопасные для отображения. Я думаю, что безопасно здесь означает не так рискованно.
Это хороший ответ, +1. Вы также можете кратко упомянуть, что цвет, воспринимаемый человеком-наблюдателем, будет значительно различаться в зависимости от множества факторов, включая освещение (например, тени/затенение и т. д.) и цвета, близкие к наблюдаемому (включая бумагу на который напечатан, что также может проступать сквозь печать). Существует множество оптических иллюзий , наглядно демонстрирующих, что один и тот же цвет будет восприниматься по-разному в зависимости от окружающих цветов/изображения.

Сопоставление цветов экрана и печати — сложная, а иногда и невыполнимая задача. Из-за особенностей освещения (экраны, RGB) по сравнению с чернилами (CMYK, Pantones и т. д.) и того факта, что практически каждый монитор будет отображать цвет немного по-разному, и печать будет выглядеть по-разному при разном освещении. Этот вид управления цветом — это работа сама по себе.

Однако в этом случае вам может повезти. Рассматриваемый цвет — чистый, ярко-красный, поэтому ваш выбор довольно ограничен. Если вы печатаете CMYK, то, скорее всего, лучшим вариантом будет 100% пурпурный, 100% желтый. Это примерно такой красный цвет, который вы можете получить от триадных красок, и его преимущество заключается в относительной стабильности, потому что вы просто печатаете твердые тела. Если у вас есть возможность использовать плашечный цвет Pantone, я бы предложил Pantone 485. Опять же, приятный ярко-красный цвет, который часто выбирают дизайнеры для красного цвета.

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

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

Если вам интересно, что вызывает это, дело в том, что экраны работают с цветами RGB, а печать работает с цветами CMYK, вы можете увидеть разницу здесь .

Ваша проблема в том, что RGB и CYMK не имеют одинаковой гаммы или диапазона. Есть цвета, которые RGB может воспроизвести, а CMYK физически не может.

К сожалению, вы должны вернуться к своему клиенту и объяснить это, что вы должны были сделать в первую очередь, когда клиент выбрал этот цвет. Возможно, вы получите плашечный цвет, который близок (у меня нет под рукой книги Pantone или Trumatch, чтобы проверить), но если нет единственного плашечного цвета (предварительно смешанные чернила), который работает, или CMYK не может произвести это значение, то вашему клиенту придется как-то идти на компромисс.

Выполните поиск на этом сайте с помощью тегов rgbи cmyk, и вы получите больше информации о двух цветовых гаммах и о том, как адресовать перевод между ними.

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

  • Два разных экрана будут по-разному отображать одну и ту же координату RGB. Чтобы продемонстрировать это, вы можете подключить ЭЛТ и светодиодный экран к компьютеру и клонировать экран.
  • Один сфотографированный цвет будет представлен по-разному с использованием цветовых пространств Adobe-RGB, s-RGB, LAB и CMYK.
  • Один цвет, сфотографированный разными камерами, будет представлен по-разному. КМОП-чипы разных производителей имеют несколько разные маски фильтров и чувствительность.
  • Одни и те же цвета CMYK (единственное цветовое пространство для печати) будут печататься по-разному на принтерах разных типов. То же самое относится к различным брендам.
  • Различные типы цветов и различные базовые материалы будут по-разному выцветать/состариваться. Распечатайте простую графику, накройте ее часть и оставьте на неделю на солнечном свете.
  • Различные настройки экрана (яркость, контрастность, температура) также испортят точно настроенное цветовое соответствие.

Есть также несколько дополнительных пунктов, слегка затрагивающих тему.

  • Невозможно сопоставить напечатанный цвет с фактическим цветом (рекламируемого продукта) с использованием цветового пространства CMYK. За исключением случая, когда продукт имеет точно такой же цвет, как и цвет, используемый в конкретном принтере.
  • Способ получения, скажем, Impreza-Blue (IB) и STi-Purple (SP) цветов на отпечатке заключается в использовании расширенного цветового пространства CMYK-IB-SP, где наряду со стандартными красками CMYK используются специальные краски IB и SP. . Эти специальные чернила смешиваются по индивидуальному заказу для точного соответствия. Цвет Impreza-Blue — металлик, типичный для Subaru Impreza, а STi-purple — цвет логотипа STi на автомобиле.

tl;dr
Для демонстрации того, что невозможно создать квадрат цвета #FF0000.

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

Покажите своему клиенту красный квадрат, напечатанный на бумаге, на его (ЖК-экране), вашем ЖК-экране, его смартфоне, планшете, вашем смартфоне, планшете, любом устройстве, которое вы можете себе представить полезным.

Вы можете увеличить полезную нагрузку аргумента, используя различные настройки принтера (фото-качество, стандартное, черновое), разные марки принтеров (HP, Canon, Epson, Brother, UTAX,...).


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

Это просто потому, что красный, скорее всего, выходит за пределы гаммы. Но когда вы находитесь в гамме, конечно, можно подойти очень близко. Проблема в том, что печать гораздо более чувствительна к условиям освещения, чем сцены, поэтому оценивать печать следует в стандартных условиях просмотра.
@joojaa Хороший вопрос. Используйте это в своих интересах. Я думаю, что даже если вы находитесь в гамме, различия все равно будут присутствовать. Особенно, если вы используете струйный принтер с низким разрешением и яркие цвета.