Жила была одна московская фирма ТИСЭ… Ее название — аббревиатура “Технология Индивидуального Строительства и Экология”. Технология очень интересная даже мне, далекому от строительства человеку. И был у фирмы сайт. Всеми забытый, малопосещаемый. И в одни прекрасный день фирма решила: с этим надо что-то делать.
Я сделал редизайн сайта и предложил стратегию его маркетингового развития в дальнейшем. Описание всего этого публикуется здесь во многом потому, что все описываемые ниже проблемы типичны для большого количества проектов такого рода. Я старался избегать освещения эпизодов, специфичных именно для этого сайта.
НАВИГАЦИЯ
На первоначальном варианте сайта существует 2 системы навигации: выпадающее меню и навигационная панель в левой части сайта. Рассмотрим каждую из них.
1. Выпадающее меню
В верхней части всех страниц находится выпадающее меню, которое обеспечивает переход ко всем разделам сайта.
В принципе, я не против от использования выпадающих меню в качестве навигации, однако при редизайне сайта я полностью от него отказался. Оно мне не нравится по четырем причинам:
а) для того, чтобы перейти на другую страницу, приходится делать как минимум целых 3 щелчка:
— первый щелчок для того, чтобы “вывалить” менюшку
— второй щелчок для того, чтобы выбрать раздел
— и третий щелчок по кнопке “Перейти”
А т. к. в этом меню много пунктов, то для поиска нужного раздела приходится использовать полосу прокрутки, из-за чего количество движения мышью еще больше увеличивается.
Утомительно, не правда ли?
б) при использовании этого меню посетитель не видит все разделы сайта одновременно, что затрудняет возможности выбора
в) меню такого рода явно не блещут красотой, и его расположение в начале страницы заметно портит внешний вид сайта.
г) И, наконец, САМОЕ ГЛАВНОЕ. Пункты выпадающего меню не совпадают с разделами левой вертикальной панели навигации! Это способно сильно запутать пользователя, особенно если учесть, что при большом количестве информации на сайте его логическая структура (в первоначальном варианте) вовсе не отличается простотой!
Итак, отказываемся от выпадающего меню и смотрим на вертикальную панель навигации.
2. Вертикальная панель навигации
В левой части каждой страницы находятся ссылки на разделы сайта. При переходе на раздел ссылки на его подразделы появляются под ссылкой на этот раздел. Проще говоря, меню как бы “разворачивается”.
Вообще, теоретически все это достаточно удобно, однако практическая реализация в нашем конкретном случае явно подкачала.
Во-первых, выбранная логическая структура сайта излишне горизонтальна: на втором уровне (первый уровень это главная страница) слишком много разделов — целых 12, поэтому в них очень легко запутаться. Да и не логично, что, скажем, раздел “Вентиляция” находится на одном уровне с разделом “Цены” – это ведь разного поля ягоды.
Еще одна деталь: при появлении на сайте новых разделов (скажем, форума, подписки на новости и т. д.) меню раздувается просто до неимоверных размеров.
Поэтому я предложил более естественную и удобную (и более вертикальную) структуру 2-го уровня: описание технологии | цены | контакты. Все!
Чем это лучше? Вся информация, касающаяся самой технологии, находится в соответствующем разделе и не отвлекает пользователей от таких крайне важных разделов, как “Цены” и “Контакты”. При появлении на сайте, скажем, форума, ссылка на него будет находится на втором уровне, на котором вместе с ним будет 4 раздела, что тоже совсем не много. Т. е. благодаря вертикальной структуре сайт становится легко масштабируемым без ущерба в удобстве его использования.
С логической структурой все ясно, теперь обратимся к другому аспекту навигации. Известно, что посетители попадают на сайт — или сразу на главную страницу (ссылки в каталогах, офф-лайновая реклама: визитки, рекламные модули…) — или на любую внутреннюю страницу (огромный поток посетителей с поисковых серверов, по ссылкам с других сайтов, переходы по закладкам…)
Важно, чтобы когда посетитель попал на внутреннюю страницу, он четко осознал, в каком месте сайта он находится. Да и вообще, при перемещении по сайту посетитель должен быть всегда в состоянии однозначно идентифицировать свое место расположения.
Навигация на исходном сайте справляется с этим плохо. Посмотрим, например, на страницу с описанием процесса возведения стен. У панели навигации (слева) развернулось подменю раздела “Стены” (5 пунктов). И панель навигации в целом стала очень громоздкой: она состоит теперь из 17 (!) пунктов. Теперь при разрешении 800х600 при большом шрифте она с едва помещается на 3-х (!) экранах и приходится несколько раз прокручивать страницу, чтобы увидеть всю навигацию целиком!
Ситуация усугубляется тем, что размер шрифта у пунктов подменю и у названий разделов одинаковый и не понятно на первый взгляд, какой раздел важнее: утепление стен или “Коммерческие предложения”.
И, наконец, тот раздел, где мы находимся в данный момент недостаточно хорошо выделен: он подчеркнут мелкой анимированной полоской, которая только отвлекает посетителя и к тому же отделяет пункты подменю от названия раздела, что способно только лишь еще больше запутать посетителя.
Все это приводит к тому, что, попав на страницу, посетитель не может понять, где он находится относительно структуры сайта, ни самой структуры. В лучшем случае он просто щелкнет по ссылке “Главная страница” и начнет разбираться с сайтом с нуля. В худшем случае потенциальный покупатель вернется в поисковик, перейдет по следующей ссылке на странице результатов и купит банальные кирпичи у конкурирующей фирмы, на сайте которой он не испытывает таких неудобств.
А теперь посмотрите, как просто все эти проблемы решены на новом сайте.
Как я уже говорил, структура сайта сделана более вертикальной, что сократило количество разделов на каждом уровне. Далее: главные разделы сайта вынесены в самый верх, сделаны яркими и крупными и не заметить их просто невозможно. Также навигация по главным разделам продублирована внизу на каждой странице сайта.
Проблема определения посетителем своего месторасположения и вопрос навигации на любом уровне структуры решена с помощью механизма так называемых “хлебных крошек”. Вот как они выглядят на той же странице:
Главная > Описание технологии > Стены > Возведение стен.
Понятно, что слова “Главная”, “Описание технологии” и “Стены” являются гиперссылками, и посетитель может одним щелчком перейти на нужный ему уровень иерархии. Хлебные крошки наглядно показывают путь от начальной страницы сайта до текущего местонахождения.
На сайте, где используются хлебные крошки “найти дорогу” не составляет никакого труда. Они самоочевидны и не занимают много места на странице.
Итак, с навигацией все. Теперь посетители никогда не заблудятся на сайте и будут точно знать, куда им идти дальше.
ДИЗАЙН
Дизайн — вещь вообще достаточно щекотливая: сколько посетителей у сайта, столько и мнений о его внешнем виде. Однако у анализируемого сайта есть ряд просчетов, которые не понравятся никому:
— при увеличении размера шрифта в браузере текст меню и основной текст почему-то вылезают из своих границ, что выглядит как-то неряшливо.
— каркасом страниц являются таблицы с фиксированной шириной, что приводит к появлению широкого пустого пространства справа при высоких разрешениях экрана
— вообще, дизайн сайта несколько старомоден. Хотя, повторюсь, кто-то любит арбуз,…
— техническая деталь: сайт не использует концепцию CSS (Cascaded Style Sheets), что делает его негибким к изменениям и неудобным при поддержке из-за большой “засоренности” HTML-кода.
Поэтому при редизайне сайт был полностью “перелопачен”. Теперь он основан на резиновых таблицах, которые при любом разрешении растягиваются, заполняя собой все пространство экрана. Внешний вид текстового наполнения задано только через CSS.
Обращаю внимание, что все страницы разбиты на 2 таблицы: в одной из них — шапка страницы, а в другой — ее смысловая часть. За счет этого процесс загрузки страниц превращается в осмысленное слайд-шоу: сначала загружается верхняя часть страницы с логотипом и flash-роликом с навигацией по основным разделам, а потом — остальное. (При использовании одной общей таблицы посетитель перед загрузкой странцы сначала достаточно долго созерцал бы пустой экран, что не особенно приятно)
Продолжаем обсуждать дизайн нового сайта с позиции маркетинга. Поскольку целевая аудитория сайта — преимущественно частные лица, в дизайне обязательно должно быть что-то такое, что привлекло бы внимание, выделило бы сайт из ряда конкурентов, запомнилось бы людям. Для этого в нашем случае был использован flash-ролик в верхней части страниц, также выполняющий роль навигации. При наведении стрелки мышки на пункты меню, забавный человечек улыбается и жестом приглашает посетителя перейти в этот раздел.
КОНТЕНТ
В целом контент (информационное наполнение) на первоначальном сайте построен правильно. Тест достаточно лаконичен, а большие тексты разбиты на несколько страниц, связанных гиперссылками. Текст в основном удобен для беглого ознакомления: разбит на небольшие абзацы, используются подзаголовки, маркированные списки…
Однако, то, что мне не совсем нравится, является очень важной, критичной частью сайта — это главная страница. На ней есть пустая болтовня. Ну сами подумайте, может ли человеку, пришедшему на сайт с целью ознакомится с технологией ТИСЭ и принять решение о покупке, быть прежде всего интересна информация о дате создания фирмы? Дипломы тоже не важнее технологии, для них запросто можно создать новый раздел под названием, скажем, “Наши награды”
Главная страница должна передавать основную идею сайта. При взгляде на нее человек должен сразу понять, что ему может дать технология ТИСЭ и понять, что он может найти на этом сайте. Поэтому главная страница должна быть переработана в соответствии с этими требованиями. Посмотрим на новый вариант главной страницы. Все, что находится на ней, служит для объяснения того, о чем этот сайт.
Логотип. Логотип фирмы ТИСЭ находится в правом верхнем углу — стандартное, привычное для всех место для логотипа. Заметим, что в логотипе хорошо отражена деятельность фирмы, и даже взятый в отдельности он способен передать то, что деятельность фирмы связана со строительством.
Слоган. Одно из самых ценных мест на начальной странице — это пространство, которое находится сразу рядом с логотипом сайта. Когда мы видим текст, визуально примыкающий к логотипу, то мы знаем, что это слоган сайта, который мы воспринимаем, как описание всего сайта. В нашем случае удачно подобранный слоган (“НАРОДНАЯ ТЕХНОЛОГИЯ”) находится как раз там, где нужно.
Тест приветствия. В тексте приветствия размещается краткое описание сайта. Обратите внимание, оно оформлено в виде заметного текстового блока (выделение шрифтом и цветом), размещено на видном месте и видно целиком без прокручивания экрана.
Описание разделов. Поскольку назначение начальной страницы состоит в том, чтобы раскрыть наиболее полно то, что находится за ней, я разместил под текстом приветствия названия разделов и краткие описания к ним.
Таким образом, вы видите, что каждый элемент на главной странице работает на общую цель — передачу основной идеи сайта.
ЗАКАЗ ПРОДУКЦИИ
Одно из базовых правил в Internet-маркетинге: Должно быть ясно, как заказать товар, и сделать заказ должно быть ЛЕГКО. Об этой очевидной вещи часто забывают, как это и произошло на сайте ТИСЭ.
То, что продукцию можно получить наложенным платежем, написано мелким шрифтом (!) в середине страницы посреди другого текста (!) в разделе “Коммерческие предложения”, который находится на одном уровне с такими разделами, как “Фундамент”, “Стены” и совершенно теряется среди них. С этим обязательно надо что-то делать, причем в первую очередь!
Надо подумать об автоматизации заказа оборудования. Например, пользователь может отметить на сайте те позиции, которые его интересуют и заполненная форма заявки отправится в фирму по e-mail.
Еще одно замечание: возможно, стоит подумать о системе возврата денег за товар в некоторых случаях, поскольку это может служить дополнительной мотивацией покупки.
ЧАСТО ЗАДАВАЕМЫЕ ВОПРОСЫ
Наверное, среди вопросов, которые клиенты задают по телефону и e-mail (а потом будут спрашивать и в форуме), есть повторяющиеся. Так вот, вопросы, которые часто встречаются и интересуют многих стоит вместе с ответами опубликовать на сайте в разделе “Часто задаваемые вопросы “.
Идея эта используется на очень многих сайтах, и в нашем случае ничего, кроме пользы от этого не будет. Например, это разгрузит службу поддержки, которой не придется повторять одно и то же по несколько раз на дню. Да и вообще изучая этот раздел люди больше узнают о технологии, ведь читать материал, построенный в форме вопросов/ответов гораздо интереснее.
Итак, следующим шагом надо добавить на сайт раздел “Часто задаваемые вопросы”.
ОТЗЫВЫ КЛИЕНТОВ
Публикация положительных (если хотите, восторженных, благодарных…) отзывов клиентов — сильное средство для повышения привлекательности технологии, и, как следствие, продаж.
И получить отзывы гораздо проще, чем многие думают: достаточно сделать на сайте форму отправки отзывов (с обязательной подписью клиента). Этот подход хорош еще тем, что посетители будут знать, что вам интересно их мнение, что вы хотите сделать продукцию (или сайт, или книгу) лучше.
Значит, надо будет добавить на сайт отзывы пользователей и форму для их получения.
БРОСКИЕ ЗАГОЛОВКИ
Это одно из важных правил успеха. Выбор слов в заголовках — более 70% эффективности текста. Поэтому очень важно правильно подобрать заголовки.
КОРОТКИЕ СЛОВА, КОРОТКИЕ ПРЕДЛОЖЕНИЯ, КОРОТКИЕ ПАРАГРАФЫ
Прежде всего надо забыть, что нам говорили в школе. При написании текста надо помнить, что 2 вещи посетители должны сделать просто: ПРОСТО понять, и ПРОСТО заказать. Для этого надо использовать короткие слова, короткие предложения и короткие параграфы. Да, я помню, что в школе учитель русского языка учил меня не делать параграфы из 2-х предложений, но много ли он знал про Interenet-маркетинг?
Будьте проще, и люди к вам потянутся! В тот момент, когда людям становится что то непонятно, их внимание и ваши продажи пропадают.
ФРАЗЫ ДОЛЖНЫ БЫТЬ КОНКРЕТНЫМИ, НО НЕ ОБЩИМИ
Пусть текст будет конкретным. Не надо писать: “С помощью технологии ТИСЭ стены возводятся быстро!” Вместо этого пишем: “С помощью опалубки ТИСЭ стены 2-х этажного коттеджа площадью 50 кв. м. возводятся всего за 2 недели!” Чувствуете разницу? То-то же.
Когда факты конкретны, люди больше им верят. Когда есть только общие фразы, люди думают: “Это они просто утверждают, что это так. А как на самом деле, трудно сказать…”
ВОТ ВКРАТЦЕ ТО, ЧТО НУЖНО УЧИТЫВАТЬ ПРИ СОЗДАНИИ ПРОФЕССИОНАЛЬНОГО САЙТА – ИМЕННО ПОЭТОМУ ЕГО СОЗДАНИЕ НУЖНО ДОВЕРЯТЬ ПРОФЕССИОНАЛАМ!
Максим Корниенко, www.maximaster.ru
