Основы веб-типографики by

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

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

Законы гештальта в типографике

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

Два наиболее важных закона гештальта, которые нужно понять в типографике, — это закон близости и закон подобия.

Закон близости

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

В типографском дизайне «близость» относится к количеству пробелов, создаваемых высотой строки, полями и отступами. Между двумя разными разделами должно быть отчетливое и заметное количество дополнительных пробелов!

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

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

]]>