Сьюзан Уэйншенк - 100 главных принципов дизайна. Как удержать внимание

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

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

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

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

• Старайтесь не располагать рядом картинки или надписи синего и красного или зеленого и красного цвета.

• Не размещайте синий или зеленый текст на красном фоне, а также красный или зеленый текст на синем фоне.

Термин «дальтонизм» (цветовая слепота) часто понимают неправильно. Считается, что большинство дальтоников видит мир в черно-белой гамме, но на самом деле речь идет всего лишь о частичной цветовой слепоте, в результате которой людям сложно видеть различия между некоторыми цветами. В большинстве случаев дальтонизм обусловлен наследственностью, хотя иногда он может возникать в результате болезни или травмы. Большинство генов, отвечающих за восприятие цвета, расположено на X-хромосоме. Так как у мужчин только одна X-хромосома, а у женщин их две, у мужчин чаще возникают проблемы с восприятием цвета.

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

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

Другой подход состоит в выборе цветовой схемы, которая воспринимается людьми, страдающих любым из видов дальтонизма.

Используйте специальные веб-сайты, чтобы проверить, как будут выглядеть изображения с вашего веб-сайта для дальтоников

Существует несколько сайтов, с помощью которых можно проверить, как будут выглядеть картинки с вашего веб-сайта для дальтоников. Здесь я рекомендую два таких сайта:

– www.vischeck.com

– colorfilter.wickline.org

Зачастую дальтоники лучше видят камуфляжную маскировку

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

• Проверьте ваши картинки и веб-странички с помощью сайтов www.vischeck.comили colorfilter.wickline.org.

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

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

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

Наконец кто-то, обладающий особо зычным голосом, спросил: «Что, черт возьми, происходит на западе?»

«Что вы имеете в виду? – не понял вице-президент. – Ничего не происходит. У них прекрасные квартальные показатели».

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

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

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

Сверьтесь с цветовым колесом Дэвида Маккендлесса

Дэвид Маккендлесс (David McCandless) разместил на InformationIsBeautiful.net цветовое колесо, которое показывает, как различные цвета воспринимаются в различных культурах: http://www.informationisbeautiful.net/visualizations/colours-in-cultures/.

Цвета и настроение

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