Максимизация прибыли: что нужно учесть при проектировании дизайна коммерческого сайта с учетом SEO
Поисковые роботы не умеют различать нюансы шрифтов и оттенки цветовой палитры, поэтому многие владельцы сайтов и руководители проектов полностью доверяются фантазии веб-дизайнера, позволяя ему воплощать в жизнь самые головоломные и необычные решения. И, как правило, надеются, что визуально приятный интерфейс будет автоматически генерировать так необходимые для коммерческого проекты лиды.
Но на практике выясняется, что это совсем не так. Ни корректно настроенная рекламная кампания, ни проводимые SEO-работы на готовом сайте не приносят нужного результата. Все потому что изначально, на этапе разработки, сайт не был оптимизирован под требования поисковых систем для коммерческих сайтов.
Цветовая схема и типографика
Правильно подобранная цветовая гамма и приятные глазу шрифты напрямую влияют на SEO, улучшая так называемые поведенческие факторы:
● длительность визита пользователя;
● возвраты на сайт;
● социальные сигналы — отметки «нравится», репосты понравившегося контента, комментарии.
Визуально привлекательный дизайн и читабельный контент побуждают пользователя задерживаться на сайте, возвращаться к нему снова и снова, делиться ссылкой на материал с другими интернет-пользователями. А это — хороший сигнал поисковикам о полезности сайта и контента, размещенного на нем.
Иерархия и навигация
Структура, структура и ещё раз структура. Весь контент, размещенный на сайте, должен быть разбит на визуально понятные и читаемые блоки, а все части сайта — логически связаны между собой. В отличие от цветов и других элементов интерфейса, структурирующие контент html-теги поисковые роботы понимают очень хорошо.
- Они помогают поисковым «паукам» легко и быстро определить структуру сайта и обнаружить наиболее важные страницы.
- Правильно организованная навигация и разбивка контента на логические блоки помогают пользователям эффективно ориентироваться на ресурсе. Это может увеличить вероятность того, что посетители останутся на сайте и продолжат искать интересующую их информацию. Хорошо себя зарекомендовало наличие блоков «похожие товары», грамотная организация каталогов по принципу «одна продвигаемая страница — один запрос» и другие SEO-практики в коммерции.
- Html-теги помогают поисковикам определить наиболее важные фрагменты контента и ключевые слова на странице. Так, например, заголовки h1-h6, метатеги title и description определяют для ПС тематику страницы, а также то, какие ключевые слова следует учитывать на ней в первую очередь.
Когда страницы сайта имеют логическую и последовательную структуру, удобную навигацию, используют разнообразные теги, роботам проще понять, что именно предлагает сайт. Это повышает рейтинг страниц в результатах поиска. Более того, структурированный контент улучшает пользовательский опыт и увеличивает конверсию на сайте. Причем это касается не только организации иерархии страниц, но и отдельных блоков, например, характеристик, описаний товаров и категорий, товарных изображений, таблиц сравнений и других немаловажных элементов продающего сайта.
Скорость загрузки сайта
Когда разработкой дизайна занимается только дизайнер, имеющий, как правило, художественный вкус и тонкую душевную организацию, существенно повышается вероятность того, что готовая верстка будет содержать самые качественные и красивые изображения, видео, иконки и другие элементы графического интерфейса. Экраны потенциальных покупателей будут выдавать самую четкую, сочную и детализированную картинку.
Звучит неплохо? Однако именно здесь кроется один из самых опасных подводных камней!
Дело в том, что в своей работе дизайнер редко задумывается об оптимизации. По этой причине у верстальщика, в задачи которого входит «перевести» макет в код, на руках оказываются качественные, уникальные, но неоптимизированные изображения, которые тратят огромные вычислительные мощности, замедляя загрузку и отрисовку контента в браузере. Особенно это касается коммерческих сайтов с большим каталогом товаров, насчитывающим десятки тысяч позиций.
Последние исследования в области интернет-маркетинга показывают, что более половины пользователей не готовы ждать загрузки веб-ресурса дольше 3 секунд. А это значит, что, каким бы потрясающим ни был дизайн, насколько бы ни был удобным и понятным каталог, — по прошествии 3 секунд каждый второй пользователь покинет ресурс, так и не сумев оценить его по достоинству. Помимо очевидного повышения процента отказов и снижения конверсий существует и дополнительное негативное последствие такого поведения — понижение позиций сайта в выдаче поисковых систем. Ведь пользователи возвращаются в поиск и переходят на более быстрые ресурсы конкурентов!
Замедлить загрузку могут не только изображения. Существует еще целый спектр неочевидных проблем — от плохого кода до большого веса или неправильной работы подгружаемых ресурсов. В том случае, если у заказчика собрана опытная команда разработки, большинства этих проблем можно избежать, но что делать, если верстка и бэкенд, как это часто бывает, отданы фрилансерам на аутсорс?
В задачи SEO-оптимизатора, помимо прочего, входит контроль скорости загрузки сайта — а потому именно этот специалист может отследить возникающие ошибки на раннем этапе, а также составить грамотное ТЗ для команды разработки с учетом последних требований к сайту от поисковых систем.
Адаптивный дизайн, коммерческие факторы
Технологии не стоят на месте. Все больше пользователей полностью переходят на мобильные устройства, функциональность которых с каждым годом охватывает все больше сфер человеческой жизни. Даже в сложных промышленных тематиках, основной аудиторией которых являются люди среднего и старшего возраста, доля пользователей, посещающих сайт с мобильных устройств, составляет 55-60%.
Такие технологические гиганты, как Google и Яндекс, несомненно, в курсе данного тренда, и уже несколько лет продвигают принцип Mobile-first: в первую очередь любой интернет-ресурс должен быть оптимизирован именно под мобильные устройства.
Адаптивный дизайн предполагает не только правильное отображение на различных экранах, но и:
● оптимизацию подгружаемых ресурсов: картинок, видео, сторонних API;
● еще более простую и логически понятную навигацию;
● оптимальный размер и логику работы элементов дизайна (например, кнопок заказа, корзины, полей ввода и форм) для удобства пользователя.
Для коммерческого сайта важен каждый посетитель, который потенциально может стать клиентом, а потому следует убедиться в том, что на сайте присутствуют все возможные факторы, которые конвертируют трафик в лиды.
Вот некоторые из коммерческих факторов, которые стоит проверить на сайте:
- Наличие правильно оформленной карточки компании. В ней должна быть вся необходимая клиенту информация: график работы, все возможные способы связи, карта проезда (если актуально).
- Наличие корзины, функционала заказа, возможность оплаты любым удобным способом.
- Формы обратной связи, охватывающие все возможные способы: обратный звонок, онлайн-чат, формы обратной связи с возможностью прикрепления файлов.
- Возможность поставить оценку и/или написать отзыв о товаре.
- Наличие функционала фильтрации и сортировки товаров.
- Продуманный и оформленный блок «Преимущества» с уникальными торговыми предложениями.
Все эти элементы и блоки должны быть хорошо видны и удобны для взаимодействия с экранов любого типа и размера. Ошибки в работе любого из них предсказуемо приводят к резкому увеличению показателя отказов и снижению конверсий, а также сводят на нет всю проведенную SEO-работу.
Оптимизация готового сайта
Разумеется, не всегда у владельца сайта есть возможность привлечь SEO-специалиста к разработке дизайна на этапе макета. Чаще всего найм такого сотрудника происходит, когда требуется улучшить позиции уже готового сайта, поднять его в выдаче. В этом случае эксперт проводит технический и SEO-аудит ресурса, затем составляет необходимый пул доработок, в том числе относящихся к дизайну сайта.
Некоторые работы могут включать в себя:
● перерисовку, добавление или исправление логики работы управляющих элементов, кнопок, фильтров;
● исправление структуры и внешнего вида товарных карточек, подбор семантически оптимизированных названий и описаний;
● дополнение информации на служебных страницах: «О компании», «Клиентам», «Контакты»;
● настройку мобильной версии сайта;
● оптимизацию интерактивных и мультимедиа-компонентов и скорости загрузки сайта совместно с командой разработки;
● дополнение функционала сайта исходя из анализа конкурентов в ТОПе выдачи поисковых систем.
В особенно тяжелом случае потребуется провести полный редизайн сайта, но иногда можно обойтись и небольшими улучшениями.
