1.4.6 Подбор шрифта

Шрифт определяет визуальный облик текста, который будет влиять на восприятие, создавать определенный образ или настроение, являться средством выделения или привлечения внимания.

В настоящее время существует множество шрифтов, но большую их часть можно классифицировать следующим образом:

• шрифты с засечками (Serif): «Times», «Century», «Garamond» и пр.; этот тип шрифтов состоит из символов, на концах которых располагаются «хвостики», называемые засечками (serifs);

• шрифты без засечек (Sans Serif): «Arial», «Verdana» и пр.; такие шрифты имеют округлый вид;

• декоративные (Decorative);

• рукописные (Script);

• символьные.

Кроме того, для всех шрифтов можно выделить еще две группы:

• пропорциональные;

• моноширинные шрифты (все кегельные площадки знаков имеют одинаковую ширину).

В веб-дизайне шрифты группируются по семействам и гарнитурам. Семейство гарнитур – специфический набор шрифтов со специфическими свойствами. Гарнитура указывает на шрифт внутри семейства.

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

Что касается декоративных и прочих нестандартных шрифтов, то, в этом случае, главной проблемой является отсутствие нормального сглаживания в браузерах [26].

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

Кроме того, некоторые шрифты не имеют жирного начертания. При применении к ним "font-style:bold;" или <strong> получается «математическая модель» жирного шрифта, а не реальный жирный.

В веб-дизайне существует понятие «безопасные шрифты», т.е. те, которые одинаково отображаются на большинстве компьютерах. Вот некоторые из них: «Arial», «Arial Black», «Courier New», «Georgia», «Impact», «Times New Roman», «Trebuchet MS», «Verdana».

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

1.4.7 Подбор цвета

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

Первым и главным правилом подбора цвета для будущего веб-ресурса является четкое представление о безопасных цветах.

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

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

Если весь спектр цветов свернуть в виде трубки, то полученная фигура будет носить название «цветовой круг». С помощью цветового круга удобно подбирать цвета и манипулировать ими [25].

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

Оттенком (Hue) называют лучи света, отраженные от объекта или прошедшим сквозь него. На цветовом круге выражается в градусах от 0° до 360°.

Насыщенность (Saturation) – видимая яркость или интенсивность цвета. Насыщенность определяет количество серого цвета в оттенке, измеряется в процентах от 0% (серый) до 100% (полная насыщенность).

Яркость (Brightness) зависит в основном от количества световых лучей, отраженных поверхностью данного цвета, что равно его яркости по отношению к другим цветам при данном освещении. Обычно измеряется в процентах от 0% (черный) до 100% (белый) [8].

При подборе цветовой палитры необходимо придерживаться следующих правил:

1) для привлечения внимания используются контрастные цвета, остальные цвета будут находиться в их диапазоне;

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

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

Нюансовыми цветами называются цвета близкие по оттенку, но различающиеся по насыщенности и яркости.

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

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

Некоторые стандартные цветовые схемы проиллюстрированы на рисунке 1.4.1.­­

«Престижные»	«Здоровые»
«Пастельные»	«Природные»

Рисунок 1.4.1 – Стандартные цветовые схемы