Создание и раскрутка сайтов - веб-студия WebStudio2U Написать письмо в студию веб-дизайна WebStudio2U Авторизация Лента новостей студии веб-дизайна WebStudio2U Карта сайта

Коммерческая точка зрения на веб-дизайн

Эти заметки не рекомендуется читать тем, кто делает сайт только для себя и для любимой тещи и хочет показать на нем всё, чему он научился на курсах компьютерного дизайна…

По определению русского Яндекс-разговорника по интернет тематике Веб-дизайн – это оформление веб-страниц. Он играет такую же роль для сайта, как полиграфический дизайн и верстка для бумажного издания. Часто под веб-дизайном понимают не только создание графических элементов для сайта, но и проектирование его структуры, навигации и иногда даже движков, нужных для работы сайта, то есть создание сайта целиком. Дизайн в смысле разумного устройства сайта значительно важнее, чем его "красивость".

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

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

  1. Скорость загрузки страниц

    Данные статистики на март 2008 года гласят: если сайт загружается более 10 секунд, то 90% посетителей с него уходят. Известно, что скорость загрузки напрямую связана с «весом» страницы (грамотная веб-страница не должна быть тяжелее 100 кб), а самое наиболее тяжелыми объектами веб-файла являются картинки.

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

    Что касается количества картинок на одной странице – тут хорошо бы найти «золотую середину»: слишком большое их количество раздражает посетителя, так как мешает искать и читать нужный текст. С другой стороны, сплошные тексты совсем без иллюстраций скучны и монотонны. Да и чего греха таить – мы ведь с детства привыкли к книжкам с картинками! Хорошим тоном считается, когда на страничке не больше 4, но не меньше 2-х картинок (имеются в виду не постоянные элементы дизайна, а иллюстрации, сопровождающие текст).

    разработка веб-дизайна
  2. Цветовое решение сайта

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

    разработка веб-дизайна
  3. Фон и текст

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

    разработка веб-дизайна
  4. Кнопки (пункты основного меню сайта)

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

    разработка веб-дизайна
  5. Главная страница сайта

    На главной странице должна быть краткая и четкая информация: о чем сайт, своеобразная аннотация. Она должна сразу бросаться в глаза, а не теряться среди дизайнерских изысков. Анализируйте статистику: если более 50% посетителей не идут дальше главной страницы, значит, она неверно составлена.
    На главной странице должна быть интрига, мотивирующая на дальнейший просмотр сайта.
    Желательно, чтобы главная умещалась в окне экрана. Если не умещается – самая важная информация должна быть наверху. Категорически недопустим горизонтальный скролл!
    Входная страница не нужна категорически – это дверь, за которой ничего нет. По статистике у сайтов с входной страницей 90% посетителей уходят сразу.

    оптимизация сайта
  6. Навигация сайта

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

    Оптимизация сайтов
  7. Фрейм

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

    разработка веб-дизайна
  8. Flash

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

    разработка веб-дизайна
  9. Музыка

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

    разработка веб-дизайна
  10. Тестирование сайта

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

    разработка веб-дизайна

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

Теги:
веб-дизайн, красота сайта, удобство сайта, скорость загрузки, цветовое решение, навигация сайта, flash, тестирование сайта, юзабилити, конверсия, стильный дизайн сайта, рациональный веб-дизайн, удобный сайт