Выполнено проектов - 1239
Проектов в работе - 84

Создание веб-дизайна сайта


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

Что такое хороший дизайн сайта?

Хороший веб дизайн сайтов должен отвечать следующим критериям:

  • Юзабилити. Под этим заимствованным из английского языка подразумевается удобство использование интерфейса. Действия пользователя на сайте всегда являются стандартизованными, так как сам функционал определенным образом ограничивает его возможности. Соответственно, разработка дизайна сайта должна начинаться с построения графов поведения пользователя, схематичного отображения возможных запросов пользователя, ответов системы и его реакций. Сценарии поведения – это базис, от которого вырастает интерфейс. Разработка должна идти таким образом, чтобы наиболее важные и востребованные сценарии были просты, понятны и интуитивны.
  • Эстетика. Естественно, дизайн – это всегда работа для человека с хорошим эстетическим вкусом. Графика, визуальные образы, оформление текстовых элементов и даже работа со шрифтом и экранной типографикой требует тонкого вкуса и чувства гармонии. Стили дизайна могут быть самыми разными, ведь сайт ведущего свадеб и информационный портал финансовой тематики требуют кардинально разных подходов. Но для каждого решения во главе угла должна ставиться эстетика, гармония. Проще говоря, сайт не должен травмировать зрения посетителя.
  • Контент – во главе угла. Человек приходит на сайт не ради того, чтобы смотреть на дизайн, а для решения поставленной задачи. Это может быть покупка товара, просмотр информации, чтение какой-либо статьи. В 99% случаев (за исключением редких сетевых арт-проектов) дизайн является тарелкой, а информация и контент – главным блюдом. Потому тарелка должна соответствовать блюду, украшать его, и, что самое главное, не мешать едоку насладиться пищей.
  • Стимуляция определенных действий. Дизайн сайта – мощный инструмент стимуляции определенного поведения пользователя на сайте. С помощью различных баннеров, кнопок, фонов, графических элементов можно подтолкнуть пользователя к тому, чтобы нажать на какую-либо кнопку, открыть какую-либо статью и т.п. При этом неудачное дизайнерское решение – это решение, которое скрывает от пользователя действия, выгодные владельцу сайта (например, неудобная или незаметная кнопка «Купить»).

дизайн сайта

Разновидности дизайна

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

Основные стили:

  • Минимализм. Современный и весьма распространенный стиль, который заключается в минимализации графических элементов на сайте. Применяется для сайтов, на которых нужно заострить внимание пользователя на контенте. Особенностью дизайна в стиле минимализма является важная роль грамотной вёрстки. Зачастую для обозначения смысловых участков, отдельных областей и прочих зон на сайте применяется не графика, а просто стройное расположение текстовых или графических блоков. Минимализм в дизайне не отрицает применения современных технологий, в частности – анимации и прочих приятных для глаза эффектов. Создание дизайна сайта в таком стиле подойдет для информационных ресурсов и солидных компаний.
  • Активное применение графики. Этот дизайн предполагает использование различных рисованных иконок, фонов, яркое цветовое решение. При помощи графики отделяются важные логические модули, делаются акценты. Современные сайты зачастую держатся на красивых фотографиях, крупным планом расположенных на страницах. Как правило, такой дизайн бывает уместен для интернет-магазинов и других коммерческих предприятий.
  • Максимум внешнего вида. Такого рода сайты, как правило, делаются для того, чтобы производить впечатление на аудиторию. На страницах сайта имеется много графики, сложные анимационные эффекты, различные интересные находки. Такие сайты чаще всего делаются ради имиджа, потому классическим примером такого сайта может быть веб-портал певца или официальный сайт модного дома.


При этом дизайнерское решение может выполняться в двух основных форматах:

  • В качестве отдельно стоящего решения. Если разработка сайта ведется «с нуля», под нужны клиента, то создание дизайна сайта выполняется строго в соответствии с нуждами заказчика. Такой подход дает максимум свободы дизайнеру и позволяет сделать оптимальные решения.
  • Шаблон дизайна для существующей CMS. В этом случае дизайнер оказывается ограничен техническими возможностями самой системы управления контентом, потому решение сводится к формированию эстетичных и соответствующих сущности будущего веб-сайта шаблонов оформления по стандартным модулям.

Процесс создания дизайна

Техническое задание

Это первый этап, и он же – самый важный. Клиент должен предоставить разработчику четкое и детальное ТЗ, по которому будет выполнен дизайн. ТЗ должно отвечать на следующие вопросы:
1.    Какая задача ставится перед разрабатываемым веб-ресурсом?
2.    Кто будет пользоваться этим сайтом?
3.    Какие действия пользователи будут осуществлять на этом сайте?
4.    Какие предпочтения имеет клиент в плане оформления?
5.    Как сайт планируется развивать в будущем?

Эскиз

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

Детальный дизайн всех страниц

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

Верстка и программирование под авторским контролем

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

Сдача работы

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

Запуск и последующая работа

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

Также смотрите:

Создание интернет сайтов 

О нас