RSS Tvitter facebook gplus vk Youtube
Skip to content

 

В чем эффективность web дизайна Вашего сайта

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

Недавно я присутствовала на вебинаре от школы практического интернет-маркетинга Нетология, где очень подробно рассматривалась эта тема.

Существует 2 вида веб-дизайна: ИНФОРМАТИВНЫЙ и ПРОМО.

Цель информативного дизайна - чтобы посетители прочитали опубликованную на нем информацию.

Цель промо дизайна  - рекламирование продуктов и услуг.

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

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

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

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

Эта статья, как и весь сайт, имеет главной целью дать информацию. Но сегодня она больше обычного снабжена картинками, чтобы было более понятно, о чем речь. Так что тип статьи получился смешанный 50х50 🙂

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

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

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

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

 Также меню должно быть понятным, знакомым и удобным. Ниже прилагается изображение главной страницы сайта, где не так просто догадаться, а где меню? 🙂 Сначала кажется, что это детский игровой сайт. Но это сайт для родителей, то есть основная ЦА - взрослые люди.

Существует 3 типа дизайна, в зависимости от ширины. Фиксированная (fixed) ширина применяется в старых дизайнах, и постепенно такие шаблоны выходят из употребления. Они очень узкие для того, чтобы при маленьких размерах экрана их содержимое отображалось полно. В таких случаях остается много пустого места по бокам, которое отдано пустому бэкграунду.

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

По этой теме сейчас очень полезным сайтом WebForMySelf подготовлен бесплатный мини-курс "5 техник резиновой верстки". Если вы хотите создать более гибкий сайт сами, то воспользуйтесь этим курсом.

 Но всё чаще (судя по заказам) пользуются спросом адаптивные дизайны (responsive). Это инновационная техника разработки сайта с использованием яваскриптов и медиа запросов из CSS, которая позволяет ресурсу адаптироваться под любые устройства от мобильных телефонов и PDA до мониторов с высоким разрешением экрана.

А в связи с прогнозами, что к 2013 году мобильные девайсы обгонят обычные ПК в качестве устройств для выхода в интернет, то стоит уже сегодня задуматься о flexible или responsive дизайнах сайта.

А у вас какой дизайн сайта? Подходит ли он под ваши цели?

И для расслабления видео от ВВС, что даже белые медведи имеют свою тактику при достижении цели 🙂

Related Posts Plugin for WordPress, Blogger...
Присоединяйтесь ко мне в социальных сетях:

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

6 комментариев

  1. clip2net.com/s/2uVJk Оля, вот так выглядит шаблон в Опера, на базе Хрома поля сбоку ещё больше. F2 резиновая тема, но с фиксированным максимальным и фиксированным минимальным размером. И это хорошо. С появлением огромных широкоэкранных мониторов настоящие резиновые сайты растягиваются так, что читать просто невозможно, как на школьной доске, но там хоть учитель пишет крупные буквы, а читать резиновый сайт в альбомном формате не очень легко и удобно, всякий раз нужно следить за строчкой при переходе с одной строки на другую, а если ещё шрифт мелкий, так вообще, мрак. Считаю, что резиновый блог должен быть примерно таким, как F2. Чтобы в меньшую сторону уменьшался при малых экранах мониторов, а при больших, имел фиксированную ширину, но не на весь экран. А что бы место бэкграунта не пропадало даром, водрузить туда неутомляющий глаз, фон.

    • Ольга Абрамова:

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

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

    • Ольга Абрамова:

      Александр, надо просто проанализировать, с каких устройств больше всего посещают Ваш сайт. Это можно посмотреть, например, в статистике Li.ru. Если увеличивается кол-во с мобильных устройств, то надо подумать о мобильной версии сайта.

    • Мне кажется что, если существуют мини браузеры для мобильных устройств, то и сайты в них будут выглядеть соответствующе

    • Ольга Абрамова:

      Под мобильные устройства делаются мобильные версии сайтов.