Сферы, традиционно слабо представленные в Интернете, активно наращивают свое присутствие в Сети. Бизнес, ориентированный на массовый рынок, осознал место и роль Интернет-технологий – теперь сайты из разряда «must-have» переходят в категорию эффективных инструментов продаж. Как настроить свое Интернет-представительство так, чтобы оно работало на прибыль компании? Расскажем на примере наших свежих проектов для передовых компаний из сегмента household.

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

К примеру, как решить вопрос с каталогом, в котором представлено большое количество товарных категорий и наименований?

Каталог является, по сути, главным разделом сайта - и поэтому он всегда присутствует как один из пунктов главного меню в «шапке» сайта. Если каталог большой, то его развертка на всю длину главной страницы может выглядеть некрасиво. Чтобы работа с большим количеством товарных наименований была удобной для посетителя сайта, в главном меню сайта для сети товаров для дома «Старик Хоттабыч» (http://hottabych.ru/) мы применили строчное разделение категорий (в отличие от традиционного вертикального ряда), с ассиметричным расположением. Как результат, более 20 категорий выглядят компактно, а ориентироваться в них вполне удобно.

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

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

Что делать, если вы продаете крупногабараритный товар, который требует расчетов или тщательной примерки к помещению? На помощь придет интерактивный 2D-конфигуратор.

Для компании Saiwala (http://saiwala.ru) производителя мебели, мы реализовали конфигуратор, позволяющий самостоятельно собрать гарнитур мягкой мебели из отдельных блоков, исходя из размеров комнаты. Достаточно выбрать модель дивана и указать параметры помещения: глубину и ширину.

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

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

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

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

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

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

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

Пример – мебельная фабрика Saiwala.

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

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

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

Наглядный пример использования стиля Metro – «блочный» сайт сети «Старик Хоттабыч».

«Чистый» дизайн, но без ограничения функциональности, характерен и для сайта Saiwala.

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

Многие крупные компании выходят за рамки «традиционного веба» и для расширения своей коммуникационной платформы используют брендирование корпоративного канала на популярном сервисе видеохостинга YouTube.

В качестве примера приведем наш новый проект - брендирование страницы для нашего давнего партнера, одного из лидеров российского рынка пластиковых окон – компании «Пластика Окон» (http://www.youtube.com/plastikaokon).

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

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

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

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

На текущий момент количество просмотров канала компании на YouTube приближается к 1 млн. 320 тысячам.

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