Разработка концепции и дизайна интернет-магазина

Разработка концепции и дизайна интернет-магазина

Р.Ю. Желобкова,

студентка 5 курса ДЦим

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

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

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

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

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

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

восприятия целевой аудитории. Залог успеха дизайнерского решения лежит в понимании потребностей аудитории, а также в четком представлении практического назначения будущего интернет-магазина.

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

Общая схема интернет-магазина

Через Интернет покупатель при помощи браузера заходит на веб-сайт интернет-магазина. Типовая модель интернет-магазина [1] состоит из следующих основных функциональных частей:

• электронная витрина;

• поисковая система;

• пользовательская корзина;

• регистрационная форма;

• форма отправки заказа.

Электронная витрина (каталог товаров) представляет собой сложную и многоуровневую структуру данных, которая должна простым и понятным способом производить упорядочивание товаров. Проще всего такой каталог представить в виде дерева объектов, верхний уровень которого состоит из списка разделов. Разделы могут содержать подразделы или ссылки на конкретный товар и т. д. Такое упорядочивание просто необходимо для удобного и быстрого поиска и заказа товаров.

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

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

Регистрационная форма служит для ввода персональных данных пользователей.

Форма отправки заказа служит для ввода контактной информации заказчика и отправки ее и заказа на электронный ящик организации.

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

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

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

Понятие «юзабилити»

Юзабилити [2] (англ. Usability - «возможность использования», «полезность») характеризует степень понятности веб-сайта пользователю, из чего вытекает его способность отлично ориентироваться. Сюда входят такие понятия, как удобство, скорость, простота, интуитивность, широкие возможности интерфейса. Речь идет не только о веб-дизайне сайта: огромная роль отведена знаниям его создателя психологии и логики покупателя.

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

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

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

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

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

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

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

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

Разработка интерфейса интернет-магазина

Интерфейс пользователя [3] - элементы и компоненты программы, которые определяют способ взаимодействия покупателя с сайтом продающей компании. Пользовательский интерфейс должен быть помощником в выполнении задачи, а не самой задачей.

Существует несколько простых правил, позволяющих интерфейсу магазина быть понятым клиенту:

1. Чем проще, тем лучше: на сайте отсутствует бесполезная информация, а шрифт легко читается. Графические элементы, анимация и звук должны быть четкими и выразительными, они не должны отвлекать внимание покупателя и долго загружаться.

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

Чем проще выполнена верхняя часть страницы, тем легче запомнить название сайта и саму фирму.

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

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

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

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

5. Для наглядности необходимо предусмотреть специальные разделы, содержащие товары, сгруппированные по маркетинговым признакам: «Новинки», «Специальные предложения», «Товары дня», «Лидеры продаж» и пр.

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

7. Расчет стоимости и вывод цен должен осуществляться в различных валютах. Чтобы сэкономить время заказчика на оплату товара, неплохо иметь в магазине готовую квитанцию для оплаты через банк.

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

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

10. Раздел «Вопросы и ответы» (FAQ), где покупатель может задать свой вопрос, а администратор магазина - ответить на него. Это

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

11. Отзывы и вопросы по товарам. Покупателю следует предоставить возможность просмотреть отзывы о товаре, оставить свой отзыв или задать вопрос - это способствует повышению качества описаний товаров.

12. Наличие обратной связи администратора с клиентами. Важно, чтобы администраторы как можно быстрее и максимально полно отвечали на письма.

13. Грамотная система управления. Вход в систему администрирования осуществляется только после ввода администратором логина и пароля. Администратор имеет возможность полностью управлять содержимым интернет-магазина:

• добавлять или удалять товары, описания и фотографии к ним, изменять их стоимость, условия доставки товаров и уровень скидок;

• редактировать разделы магазина;

• редактировать контактную информацию интернет-магазина;

• редактировать содержание заголовков и текстов писем, отправляемых покупателю при регистрации и покупке товара;

• составлять и рассылать письма с новостями магазина подписчикам;

• просматривать историю заказов и статистику покупателей;

• изменять курс валюты на витрине магазина.

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

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

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

Подводя итоги, следует выделить основные моменты, на которые необходимо делать ставку при разработке интерфейса интернет-магазина:

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

• Удобный и быстрый поиск необходимого товара.

• Все товары, предлагаемые на сайте, должны быть в наличии.

• Простая и предельно удобной навигация.

• Грамотная цветовая гамма.

Общие правила дизайна страниц

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

Понятие дизайна веб-страницы проще всего определить как внешний вид страницы и ее восприятия посетителем.

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

Тремя основными принципами разработки домашних вебстраниц и небольших веб-узлов являются простота, предсказуемость и целостность [4].

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

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

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

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

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

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

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

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

Классификация веб-дизайна

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

Выделяются следующие элементы, участвующие в создании

стиля [5]:

• Шрифт. В пределах публикации шрифт должен иметь одинаковые характеристики (гарнитура (начертание), кегль (высота), цвет и пр.).

• Абзац. В пределах публикации предпочтителен единый вид выравнивания.

• Цветовая схема. Единое оформление создаст у посетителя ощущение связности сайта.

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

вую и цветовую коррекцию, кадрирование, найти способ обработки края фотографии.

• Логотип.

На сегодняшний день можно выделить следующие типы веб-

дизайна:

• Текстовый дизайн: почти полное отсутствие изображений, что значительно ускоряет загрузку страницы. Навигационные и декоративные элементы выполняются «символьными» приемами.

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

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

• Динамический дизайн: активное использование динамических объектов - анимации, звука, видео и пр.

• Смешанные типы - комбинация любых представлнных типов дизайна.

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

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

• гибкую страницу можно настроить для вывода на любом дисплее;

• отсутствует нежелательное свободное место;

• на больших дисплеях длина строки может оказаться чрезмерной, что значительно ухудшает условия чтения;

• возможно негармоничное расположение элементов;

• результаты гибкого дизайна непредсказуемы: страница у разных пользователей будет выглядеть по-разному.

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

Подобный подход также имеет свои особенности:

• страница будет выглядеть одинаково независимо от размеров дисплея;

• страницы и столбцы с фиксированной шириной обеспечивают лучшее управление длинами строк;

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

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

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

Правило оформления текста

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

Шрифтовая композиция [4] - это способ самовыражения, выливающийся в самостоятельную творческую форму и композицию.

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

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

При выборе шрифта необходимо принимать во внимание следующие рекомендации:

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

• Не следует применять такие приемы, как подчеркивание и перечеркивание; подобные текстовые эффекты могут ассоциироваться у пользователей с гипертекстовой ссылкой.

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

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

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

Не менее важно и грамотное оформление ссылок: слово-ссылка должно выделяться цветом и иметь подчеркивание; просмотренные ссылки обязаны выделяться иным цветом, чем те, по которым посетитель еще не переходил. Ссылки не должны открываться в новом окне (за исключением файлов PDF и т. п.); ссылка обязана информировать пользователя о том, что его ждет при переходе по ней.

Подбор цвета

При создании сайтов важно уметь правильно подбирать цвета различных элементов web-страницы, чтобы они смотрелись цельно и гармонично.

Цвета красный, зеленый и синий называются основными, желтый, голубой и пурпурный - дополнительными цветами [6].

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

Контрастные цвета, слишком «резкие» для восприятия. Исключением являются пары черный-белый и желтый-синий цвета. В основном, контрастные пары применяются в рекламе для привлечения внимания. На сайте с большим количеством текстовой информации подобные сочетания лучше не использовать.

Нюансовыми цветами называются цвета, близкие по оттенку, но различающиеся по насыщенности и яркости.

При подборе цвета важна идея, а также конкретное ее воплощение. При осуществлении своей идеи следует довериться эмоциональным ощущениям.

Макет страницы

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

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

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

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

Для облегчения задачи создания макетов используется следующий контрольный список:

• изображения/чертежи/иллюстрации;

• контент (общее направление содержимого или готовый текст);

• глобальная навигация (навигационная панель или общие элементы, которые появляются на каждой странице);

• описание основных функциональных возможностей;

• первичные ссылки (предполагаемая навигация);

• вторичные ссылки;

• мультимедиа (если есть);

• целевой размер окна;

• данные для заголовка и подвала (название проекта, название страницы, номер версии, дата, авторское право).

Основные правила главной страницы

Главная страница сайта интернет-магазина [7] в первую очередь должна содержать логотип продающей компании, а также ссылки на основные разделы: «О компании» и «Каталог товаров и услуг». При дальнейшей разработке необходимо учитывать специфику аудитории данного корпоративного сайта.

Посетителей, которые путешествуют по корпоративным просторам Интернета, можно условно разделить на три группы:

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

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

3. Третья группа - люди, которым необходима контактная информация (телефон, адрес, схема проезда и пр.). Сюда могут входить как новички, так и постоянные посетители. Это сама ценная категория: именно эти люди приносят компании значимую часть дохода, а, значит, на их пути не должно быть никаких препятствий: продающая компания обязана разместить на главной странице контактную информацию. В том случае, если информация довольно объемна, на странице должна быть бросающаяся в глаза ссылка на нее.

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

ти. Им достаточно слогана и ссылок на страницы с подробной информацией об основных направлениях деятельности.

Под запретом

В веб-дизайне существуют основные запреты, которых стоит придерживаться для достижения тех или иных целей [7].

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

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

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

Стоит забыть и про произвольно открывающиеся «pop-up» окна. Они тормозят работу сайта, заставляют посетителя без их желания ждать появления бесполезной рекламы.

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

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

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

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

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

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

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

Ошибкой является наличие на сайте более 3 счетчиков посещений. Такое количество счетчиков значительно тормозит загрузку.

Наличие мусора в коде страницы может оказать значительное влияние на длительность загрузки.

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

Как добавить качественный контент

Одним из критериев качественности контента [8] является его актуальность: информация на сайте должна меняться, а новостная лента отличаться регулярностью и свежестью новостей.

Рекомендуется такой вариант представления контента, как календарь событий. Это позволяет пользователям легко ориентироваться в постоянно меняющемся мире цен, скидок и т. п.

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

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

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

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

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

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

Заключение

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

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

Библиографический список

1. Все об электронной коммерции в России: понятие и функции интернет-магазина. - www.ecomrus.ru.

2. «Продающий» дизайн интернет-магазина. -www.design.trilan.ru.

3. Джерк Н. Разработка приложений для электронной коммерции / Н. Джерк. - СПб. : Питер Бук, 2001.

4. Гото Г, Котлер Э. Web-дизайн / Г. Гото, Э. Котлер. - СПб. : Символ Плюс, 2009.

5. Web-дизайн. - http://ru.wikipedia.org.

6. Цветовые схемы. - http://ru.wikipedia.org.

7. ЛеонтьевА.А. Web-дизайн. Руководство пользователя / А.А. Леонтьев. - М. : Центр, 2000.

8. Web-сайты в Интернете: качественный контент и сервисы. - http://com-seo.ru.