Основы графического и веб дизайна — основные правила и принципы

Основы композиции в графическом и веб дизайне

Правило выравнивания. Элементы дизайна нужно выравнивать по одним и тем же направляющим линиям, и придерживаться единого типа выравнивания. Лучший вариант выравнивания — по левому краю. Выравнивание по центру допускается для небольших блоков текста (максимум 3-4 строки). Выравнивание по правому краю или по ширине не рекомендуется использовать новичкам.

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

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

Основные принципы типографики (работы с шрифтами)

Правило иерархии. В дизайне должна быть четкая и явная иерархия шрифтов. Заголовки должны быть значительно крупнее и жирнее обычного текста. Также заголовки могут быть полностью написаны заглавными буквами, в то время как для обычного текста это не рекомендуется. При наличии нескольких уровней заголовков они также должны четко отличаться друг от друга по размеру с шагом не менее чем в 1,5–2 раза.

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

Правило интервалов. Новичкам не рекомендуется изменять межстрочный и межбуквенный интервалы (интерлиньяж и трекинг). Значения этих интервалов по умолчанию в большинстве случаев гармонично продуманы разработчиками самого шрифта, и их редактирование с большой вероятностью только ухудшит читаемость. Если вы всё же решили изменить эти интервалы, придерживайтесь следующих советов:

• Для крупных заголовков межстрочный интервал как правило лучше уменьшать
• Для текстов, набранных заглавными буквами, можно как увеличивать, так и уменьшать межбуквенное расстояние (но не сильно)
• Для мелких текстов можно немного увеличивать интерлиньяж, а вот трекинг менять не стоит вообще

Основы колористики (работы с цветом)

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

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

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

Основные правила стиля в графическом и веб-дизайне

Правило аккуратности. Все элементы должны быть выровнены ровно. Однотипные отступы должны быть одинаковыми. Ширина текстовых контейнеров также должна быть одинакова.

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

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

Основные принципы работы с изображениями в дизайне

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

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

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

Насколько строгими являются правила и принципы дизайна

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

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