Про відповідність кольорів інформації у веб-розробці

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

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

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

Зіткнувся з цим я коли вирішив подивитися програму і тези доповідей конференції Рит++.

У них програма викладена у вигляді pdf-файлу, а тези зроблені у вигляді звичайного акордеону на сайті. При цьому в програмі кожна доповідь написана в блоці свого кольору.

Тези:

Доповіді:

Дуже зручно! Подивившись, на якому тлі написана доповідь, ми відразу можемо швидко знайти його тезу на сайті завдяки цьому підсвічуванню. Таке виділення кольором дійсно дуже сильно спрощує процес навігації по сайту і зменшує час пошуку необхідної інформації.

А тепер подивимося якомога легким рухом руки запороти все це благе починання. Ось так:

Увага! Кольори в pdf-файлі відрізняються від кольорів на сайті.

Тепер пошук тез для потрібної доповіді перетворюється на своєрідний тест Струпа

Мораль цієї байки така: роблячи такі хороші і зручні речі, як колірний поділ інформації, який дійсно полегшує пошук і навігацію, ніколи не забувайте проконтролювати, щоб кольори скрізь збігалися!