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

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

Читать далее →

От автора: типографская разметка – обширное поле деятельности. Люди посвящают годы своей жизни этому древнему ремеслу, и всегда найдется что-нибудь новое для изучения. В этой статье, я сделаю обзор основных моментов, которые следует обдумать при выборе шрифта для своего сайта и гарнитуры (набор из одного или нескольких шрифтов). После чего вопросы на подобие «Какой шрифт выбрать?» у вас отпадут сами по себе.

Практическая типографская разметка

При создании дизайна для Сети вам нужно принять к сведению, что контент будет меняться. О том, чтобы тратить время на кернинг (подгонку пробелов между отдельными буквами) каждого заголовка большого вебсайта, вопрос даже не стоит. Другими словами, вы отказываетесь от контроля.

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

Читать далее →

От автора: чистый. Термин часто применяется для описания дизайна вебсайта, но что он обозначает? Как вы это определяете? Я уверен, это не значит белое пространство белее белого или что весь мусор заметён под нижний колонтитул… Давайте присмотримся поближе.

Читать далее →

От автора: чего вы прежде всего хотите от своего сайта-портфолио? Чтобы он выделялся! Сегодня Пол Дж. Нобл (Paul J Noble) проведет нас по этапам создания своего собственного сайта-портфолио с уникальным дизайном. Он покажет нам подсказки и приемы Adobe Photoshop’а, а также несколько разумных подходов к его выделению из огромного количества подобных сайтов.

Читать далее →

От автора: в этом учебнике мы покажем, как создать красивую простую навигационную панель, использовав несколько скомбинированных стилей CSS3. Наша цель – повторить внешний вид того, что в прошлом могло быть сделано только путем комбинирования нескольких изображений, JavaScript’а и нескольких div’ов. В общем создадим закругленные углы в CSS. Давайте начнем…

Читать далее →

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

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

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

Читать далее →

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

Читать далее →

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

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

Читать далее →

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

Перед тем, как мы приступим к созданию темы для блога, я Вам рекомендую просмотреть демо-результат работы.

Читать далее →

От автора: Способ, которым люди видят наши композиции, сильно влияет на смысл, который они из них извлекают. Правило гештальта (целого) изучает этот феномен; по существу, это – один из основных принципов, который следует обдумать каждому веб-дизайнеру при развитии своего замысла. Также мы рассмотрим, как понимание целостности идеи улучшит ход вашей работы!

Читать далее →