Содержание
- 01. Используйте сетку
- 02. Выберите единственную точку фокусировки.
- 03. Используйте правило третей
- 04. Используйте пробелы
- 05. Повторяющиеся элементы дизайна.
- 06. Используйте иерархию
- 07. Используйте масштаб, контраст и гармонию.
Основная цель любого макета страницы, который вы разрабатываете, будь то печатная брошюра или новейшее веб-приложение, - четко и эффективно донести информацию до читателя. Один из лучших способов гарантировать, что ключевые сообщения будут доставлены читателю, - это создать сбалансированный макет страницы.
Дизайн макета страницы обычно включает в себя множество элементов размещения, перестановки и форматирования. Многие дизайнеры подходят к этому процессу органично, нащупывая путь к приятному конечному результату. Хотя это может привести к отличным счастливым случаям, существует риск того, что использование методологии свободной формы может привести к отсутствию визуального баланса на странице.
Хорошая композиция страницы должна не только радовать глаз, но и четко передавать эти ключевые сообщения целевой аудитории. Мы собрали несколько основных советов, которые помогут вам обеспечить сбалансированность макетов страниц (хороший конструктор веб-сайтов также поможет). Эти подходы будут хорошо работать, чтобы обеспечить структуру баланса, независимо от того, с какой средой вы работаете.
Дополнительные советы для веб-сайтов см. В нашем руководстве по созданию идеальных макетов веб-сайтов.
01. Используйте сетку
Один из самых простых способов обеспечить сбалансированность вашей страницы - это использовать сетку. Раньше сетки были единственной прерогативой печатной страницы, но за последние несколько лет в Интернете была проделана большая работа, чтобы помочь перенести концепцию сетки на цифровой носитель.
Используя сетку для определения положения различных элементов на странице, вы создадите связь между различными элементами, составляющими вашу страницу. Это может помочь упорядочить ваш макет, предоставить читателю четкую структурную ссылку, к которой он может вернуться, и повысит успех вашей страницы.
Это важно, потому что, когда все элементы вашей страницы связаны друг с другом, общий эффект ощущается более комфортным для читателя, помогая им расслабиться и облегчая им доступ к важному материалу: контенту.
02. Выберите единственную точку фокусировки.
Один из наиболее эффективных способов обеспечить чувство баланса - выбрать одну точку фокусировки для дизайна макета. Хорошим примером этого на практике является использование большого изображения в качестве самого большого элемента на странице.
Сильная визуализация может предоставить мощный способ привести читателя на вашу страницу (как и экспертный анализ идеального веб-хостинга), а также предоставляет полезный структурный элемент, вокруг которого можно расположить оставшийся контент в вашем макете. Если у вас несколько визуальных элементов, используйте принцип близости Гештальт-теории, чтобы сгруппировать их вместе, выровняв их таким же образом.
Также стоит помнить, что вы можете использовать заголовок или цитату таким же образом; хороший отображаемый заголовок может предложить такой же визуальный интерес, как и изображение, при этом сохраняя структуру, которая поможет вам обеспечить сбалансированный макет.
03. Используйте правило третей
Один из лучших способов обеспечить чувство баланса - использовать любимое дизайнером правило третей или золотое сечение. Проще говоря, правило третей гласит, что если вы разделите свою страницу на трети как по вертикали, так и по горизонтали, точки, в которых пересекаются линии сетки, обеспечивают естественные фокусные точки композиции.
Выровняв ключевые элементы по этим четырем точкам, вы получите более приятную композицию, чем если бы вы, например, идеально центрировали элементы на своей странице.
Само по себе правило третей не может волшебным образом обеспечить баланс вашего макета, но, расширив принцип, можно легко использовать эту тенденцию к естественному фокусу, чтобы помочь сбалансировать ваш макет.
Распространенный подход заключается в размещении наиболее важных элементов вашей страницы в верхней (или нижней) трети страницы с выравниванием основной точки фокуса в соответствии с одним из пересечений. Есть много ресурсов для хранения вашего сайта? Ознакомьтесь с этими вариантами облачного хранилища.
04. Используйте пробелы
Начинающие дизайнеры часто используют каждый бит пространства на странице, наполняя контент до тех пор, пока все пробелы не будут заполнены. Более опытные знают, что иногда лучший способ дизайна заключается в том, чтобы исключить элементы, а не втиснуть их внутрь.
В печатных материалах наиболее распространенным способом использования пустого пространства является увеличение полей и промежутков страницы. В Интернете простое обеспечение достаточного пространства для передышки вокруг элементов может помочь сделать дизайн макета собранным и сбалансированным.
Использование отрицательного пространства лучше всего работает, когда у вас есть четкая структура, которая связывает контент вместе (например, предоставляемая сеткой), поскольку риск пустого пространства может быть ощущением разъединения между элементами страницы, если они введены случайно.
05. Повторяющиеся элементы дизайна.
Повторение также может обеспечить сильное ощущение связности дизайна и баланса композиции. Идея состоит в том, что, идентифицируя и повторно используя мотив или дизайнерскую обработку во всем макете, вы можете предоставить читателю ссылку, чтобы разрозненные области ощущались связанными и составляющими одну и ту же общую композицию.
Вы также можете использовать эту технику, чтобы обеспечить фокус в своем дизайне, сохраняя при этом общий баланс, намеренно нарушая шаблон сходства, введенный посредством повторения.
06. Используйте иерархию
Один из ключевых подходов к достижению нирваны макета страницы - четкое представление о структуре и иерархии. Мы уже коснулись структуры, но важно также передать относительную важность различных частей содержания на вашей странице. Например, заголовок почти всегда должен быть визуально более важным, чем основной текст.
Посмотрите на различные элементы, из которых состоит ваш макет, и решите, какой из них является наиболее важным. Используйте этот элемент, чтобы обеспечить структурный зацеп для остальных элементов на странице, сохраняя его наиболее важным.
07. Используйте масштаб, контраст и гармонию.
Наконец, использование масштаба может быть очень эффективным методом достижения хорошего визуального баланса в макете. Делая одни элементы крупнее других, возникает чувство порядка и иерархии. Это помогает создать удобный макет, потому что зритель автоматически сначала будет смотреть на более крупные элементы в макете, переходя к более мелким элементам по мере чтения.
Этот принцип также работает с повышенным контрастом, так что выделение элемента на странице с помощью контраста заставит глаз сначала сфокусироваться на этой точке. Это обеспечивает путь на страницу и снова дает полезную структурную точку для разработки вашего макета.
И масштаб, и контраст работают лучше всего, когда они применяются к одному элементу, выделяя его среди других частей вашего макета. Используйте принципы гармонии, чтобы заставить других почувствовать себя связанными и акцентировать внимание на фокусе.
