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

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

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

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

Color picker

Многим должна быть до боли знакома ситуация, когда внезапно требуется HEX-цвет на полтона темнее или, скажем, бирюзовее, чем есть сейчас.
Если вы до сих пор не умеете представлять точный RGB-цвет в голове — вам не обойтись без color picker’а, который сделает эту работу за вас.

Лично я знаю только три вменяемых варианта, где можно взять color picker:

1. Отдельная программа, специально предназначенная для этого;
2. Практически любой графический редактор;
3. Online-сервис

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

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

Вступление

Привет, Хабр!
Это мой первый хабратопик. Надеюсь, его прочитает хотя бы полтора верстальщика. Если после этого хотя бы один сайт станет лучше, я буду очень рад.

Ничто не предвещало беды

Как и любой слегка красноглазый линуксойд, я люблю экспериментировать. До сборки релиз-кандидатов ядра и ковыряния в экзотических оконных менеджерах дело не дошло, но в поисках приключений я все же пересел на тестовую ветку моего дистрибутива, что привело к переезду на четвертую версию КДЕ.
Несколько месяцев до переезда я присматривался к новым кедам в виртуальной машине, игрался с плазмой и новым оформлением. В один прекрасный день решил я попробовать темную цветовую схему «Wonton Soup», да так на ней и остался, хотя всю жизнь использовал светлые схемы.

Суровая реальность

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

1. браузер использует системные стили и цвета для input'ов на страницах. Абсолютное большинство современных браузеров именно так и поступает для лучшей интеграции в окружение
2. верстальщик прописывает в CSS свой цвет текста для полей ввода, кнопок или списков, но оставляет дефолтный фон. Либо наоборот, меняет только цвет фона

В абсолютном большинстве OS и DE по умолчанию элементы интерфейса имеют светлый фон, текст же рисуется черным цветом. В этом случае ничего страшного не происходит, мы просто увидим, к примеру, input'ы с темно-серым текстом на светлом фоне, как и задумывалось в дизайне страницы.
Но в темных схемах может случится конфуз, и мы увидим темно-серый текст на темном же фоне. Т.е, ничего не увидим.

Доска позора

Приведу скриншоты с некоторых популярных сайтов, посещение которых вызывает у меня желание послать луч ненависти верстальщикам.

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

Собрался я тут посмотреть кино в обновленной убунте, а получил довольно психоделичную картинку (к конкретному концертнику такие цвета конечно подходили еще как, но я почувствовал, что что-то тут не так).

Раз уж нашлась темная тема для Eclipse и для TextMate решил найти тему для Netbeans. И нашел
Название: Twilight (PHP и Ruby)
Автор: Nettuts
Источник: Скачать

Установка
Tools → Options → Import → выбрать архив → OK.

Прочитав сегодня пост Тёмная тема для Eclipse+PDT (ZendStudio for Eclipse) решил найти такую же тему для Textmate. Погуглив немного, я так и не нашел ничего похожего (может плохо искал). Решил сделать сам. Так как раньше таким не занимался, то вышло возможно и не очень хорошо :) Если кто поправит буду рад.



Скачать

UPD: Зеркало

UPD2: Для тех кому нужен оригинал берите тут. Это тема для вима, но в комментах там есть и для emacs.

Преамбула

Когда-то давно, работая еще в ZendStudio 5.0, а потом и 5.5 нашлась красивая темная тема для подсветки кода. За пару лет работы я так привык к ней, что пересев на Eclipse+PDT, глаза были против белого фона с зелеными буковками.
Поиски в интернете такой же темы для Eclipse, поиски хоть какой-нибудь тёмной темы а затем и поиски вообще какой-либо темы результата не дали. Оказалось (о ужас!), что Eclipse не поддерживает смену готовых тем.

Поиски хотя бы какой-то возможности кастомизации Эклипса на хабре вывели на топик хабраюзера olegchir. Вдохновленный идеей самому сделать аналог Parabox Style для Eclipse, я принялся за работу

Что из этого получилось, можно глянуть на скриншотах ниже: