Главная Журнал 5 принципов хорошего дизайна

5 принципов хорошего дизайна

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

Ксения Костина

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

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

Типография

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

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

Подходящая длина строки является ключевым моментом в удобстве чтения текста на сайте. Тут важно отыскать «золотую середину». Например, если длина строк слишком мала, читатель будет вынужден постоянно прерываться, таким образом, время необходимое на чтение увеличивается и становится сложнее сосредоточиться. Рекомендуемая ширина строки должна содержать до 60 символов. Это поспособствует удобному взаимодействию пользователей с сайтом.

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

Структура типографии определяет наш дизайн. Когда человек видит перед собой только буквы, становится сложно понять смысл. Чтение и восприятие намного облегчается если текст структурирован, заголовки выделяются крупным шрифтом, важные моменты обозначены «жирным», курсивом и т.д. Так текст можно прочитать намного проще и быстрее.

Минимализм — будь проще

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

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

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

Тестируйте как можно чаще

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

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

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

Принцип контраста

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

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

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

Структура

Композиция — это расположение объектов в гармонии друг с другом. Любопытный факт – элементы которые находятся ближе к центральной оси, «весят» больше, чем элементы, удаленные от центра. Мы рассмотрим важность цвета в композиции и то как с ее помощью создается визуальная иерархия.

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

Управлять вниманием пользователя просто – нужно создать визуальную иерархию. На эту тему было проведено множество психологических исследований. Согласно им, люди сканируют экран с формой буквы Z. Используйте эту информацию, чтобы правильно расположить (по ключевым точкам буквы «Z») детали на странице.

Заключение

При разработке сайта нужно помнить о том, для какой ЦА он создается. Текст в дизайне должен четко читаться, структура иметь логичность и простоту, цвета контрастировать. Избавьтесь от визуального мусора и не забывайте о тестировании. Все это гарантированно поможет создать хороший дизайн.

Читайте также

Раскладываем по полочкам: какие бывают типы всплывающих окон на сайте, их плюсы и минусы, а также отвечаем на вопрос о том, стоит ли вообще их использовать.

Ксения Костина

Представляем вашему вниманию несколько идей для улучшения сайта в сторону удобства и легкости взаимодействия с ним. Готовы прокачать свой ресурс? 😉

Ксения Костина

А вы знаете какие фразы заставят всплакнуть даже самого стойкого дизайнера? Ловите топ 5 выражений от которых в сфере дизайна никуда не деться…

Ксения Костина

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

Ксения Костина

Семь принципов ведения почтового маркетинга. Рассказываем вам как правильно начать разработку маркетинговой кампании по электронной почте.

Ксения Костина

Основные плюсы и минусы использования сайта в доменной зоне .РФ Рассуждаем на тему того, стоит ли использовать кириллический домен.

Ксения Костина

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

Михаил Костин

Каким компаниям не стоит рекламироваться в контексте и почему? Взглянем на основные варианты, с которыми специалисты по контексту встречаются чаще всего.

Ксения Костина

Ни для кого не секрет, что текст на сайте имеет огромное значение. А потому ловите 10 советов о том, как сделать ваш текст легким и приятным для чтения.

Ксения Костина

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

Ксения Костина

Картинки, если они правильно оптимизированы, способны помочь в SEO-продвижении сайта. Давайте узнаем, что такое атрибут alt и как правильно его прописывать.

Ксения Костина

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

Ксения Костина

В любом бизнесе важно завоевать лояльность своей аудитории. Рассмотрим несколько примеров контента, который повышает доверие посетителей сайта.

Ксения Костина

Как стандартную и устрашающую 404-страницу сделать информативной и полезной? Рассказываем, как красиво и креативно сообщить пользователю об ошибке.

Ксения Костина

Улучшайте своё сообщество Вконтакте, добавляя в него новые функции. Рассмотрим основные приложения для сообществ и чем они могут быть полезны.

Ксения Костина
Контакты
Телефон: +7 (988) 970 08 90
Часы работы: с 10:00 до 18:00

Начать проект