fbpx

Иерархия в типографике

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

«ТИПОГРАФИКА СУЩЕСТВУЕТ В ЧЕСТЬ СОДЕРЖАНИЯ»

Robert Bringhurst приводит простой пример представления содержания без типографской иерархии. «На рис. 1 приведен список концертов под открытым небом на улице, где я живу.

Рис. 1

К примеру, у меня свободны дни 15-17 августа. Мне надо проверить, смогу ли я бесплатно посетить в этот период какое-то выступление. Здесь на рисунке, очень сложно понять что-то. Мягко говоря, неудобно. Представьте, что список состоит из 50 концертов. Нужно проштудировать немало данных ,чтобы проштудировать то, что мне нужно. Это, возможно, самый «жесткий» пример, но все-таки. Информацию мы можем сделать намного читабельнее и проще.

Итак, в следующем примере, на рис.2, вы видите дату, название, описание концертов изолированных друг от друга интервалами между абзацами. Ну, вот, похоже, что мы идем на шоу The Avett Brothers)».

Рис. 2 ИЕРАРХИЯ И WEB

Следует отметить что при проектировании веб-страница должна иметь иерархию, которая имеет еще и связи, взаимодействия. Страница в целом должна быть разработана таким образом, чтобы были доступны ДЕЙСТВИЯ для легкого перехода по данным и поиска контента. В этих целях можно использовать возглавляемые тэги (или Н-метки), позволяющие задать порядок важности содержания (например, Н1-Н6 (по убыванию) и пр.). Но, как же эффективно создавать Н-тэги для придания смысла вашему контенту? Все довольно просто. Есть несколько основных методов, которые чаще всего используются в комбинации друг с другом. Нужно установить:

  1. Размер
  2. Вес
  3. Цвет
  4. Позицию (расположение)
  5. Контраст
  6. Сочетание
  7. Расстояние

 РАЗМЕР. Это самый простой и наиболее распространенный способ типографской иерархии.

Читайте также:  Ребрендинг НБУ: казнить нельзя помиловать. Мнение дизайнеров

Рис. 3

«ВЕС». Простое использование более «громоздких» шрифтов поможет изолировать, например, заголовки, названия.

ЦВЕТ. Он играет важную роль, так как наши глаза воспринимают первичную и вторичную информацию. Проще говоря, чем ярче, тем важнее сообщение (или его часть). Также используются теплые, нейтральные оттенки.

рис. 4

ПОЗИЦИЯ. В зависимости от того, как расположены части текста по отношению к друг другу, разработчик устанавливает иерархию данных (что должно быть побольше и поярче, а что есть вторичной информацией).

 рис. 5

КОНТРАСТЫ. Отличный способ для выделения самого важного в тексте – использование контрастных шрифтов.

рис. 6

СОЧЕТАНИЕ. Как уже упоминалось, все эти методы более эффективны в комплексе. А здесь уже самый интересный процесс – решить, что же все-таки и с чем лучше всего сочетается для отличного оформления и восприятия.

 рис. 7

РАССТОЯНИЕ. Одна из важнейших составляющих иерархии, которая выделяет во-первых элементарно слова друг от друга, во-вторых визуально выделяет самое очевидное. Это правило дизайна гласит, что связанные детали должны быть ближе к друг другу, нежели отделенные элементы.

Помните, ваша цель – представление содержания в организованном порядке, поэтому не стоит слишком увлекаться «прибамбасами». В любом случае действует одна простая истина: текст должен быть чи-та-е-мым. Вот и вся наука.

Качайте также свежий шрифт : Borg.

Поделиться:

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: