5 важнейших критериев оценки пользовательского опыта
Previous
выбрать за меня
Команда Google Shopping опубликовала видеопособия для рекламодателей
Next
инфографика, создание, расстановка элементов, макеты
Контент-маркетинг

Рисуем инфографику: расстановка элементов на странице

Автор: Анна Шаховская28.10.2015

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

Что значит свободное пространство?

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

Почему свободное пространство играет такую важную роль?

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

инфографика, создание, расстановка элементов, макеты

Свободное пространство

Основные типы макетов

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

Можно выделить 6 основных типов макетов для инфографики.

инфографика, создание, расстановка элементов, макеты

Макеты для инфографики

1. Эффективная приманка.

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

Отличительные особенности:

  • основной акцент делается на передачу информации, а не на дизайн;
  • можно распечатать и регулярно использовать;
  • легко читается.

инфографика, создание, расстановка элементов, макеты

Макет 1

2. Сравнение/противопоставление.

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

Отличительные особенности:

  • для восприятия информации важен хороший дизайн;
  • хорошо работает даже с большими объемами информации;
  • требует наличия интересного релевантного контента.

инфографика, создание, расстановка элементов, макеты

Макет 2

3. Большие числа.

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

Отличительные особенности:

  • хорошо справляется большими объемами данных;
  • строится на основе графиков и диаграмм;
  • требует хорошего дизайна:
  • может быть расширен до блок-схемы;
  • можно использовать для создания графика проекта;
  • хорошо работает в связке с маркетинговой стратегией.

инфографика, создание, расстановка элементов, макеты

Макет 3

4. Дорожная карта.

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

Отличительные особенности:

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

инфографика, создание, расстановка элементов, макеты

Макет 4

5. Таймлиния.

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

Отличительные особенности:

  • может быть использован также для сравнения, построения графика проекта или маршрута;
  • в зависимости от материала может быть и простым, и сложным;
  • требует наличия интересного релевантного контента.

инфографика, создание, расстановка элементов, макеты

Макет 5

6. Визуализированная статья.

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

Отличительные особенности:

  • отлично справляется с большими объемами данных;
  • хорошо подходит для передачи сложного материала или длинных историй;
  • легко читается и воспринимается;
  • требует наличия «сильных» заголовков.

инфографика, создание, расстановка элементов, макеты

Макет 6

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

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

Реакция на статью
поделюсь
500%
интересно
300%
полезно
1100%
не уверен
200%
скучно
0%
где автор?
200%
Комментарии
Оставить отзыв

    You must log in to post a comment

    ПОДПИШИТЕСЬ НА НАШУ РАССЫЛКУ!
    Уведомления о новостях, статьях и инфографике будут приходить раз в неделю.
    ПОДПИШИТЕСЬ НА НАШУ РАССЫЛКУ!
    Позвольте нам обновлять ваши знания раз в неделю.