Влияет ли дизайн на SEO-продвижение сайта?

Автор: Екатерина Софина

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


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

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

А, может быть, в тот, где вас сразу обступает несколько консультантов, за которыми вам не удается даже толком разглядеть ассортимент? Вопрос со звездочкой. Какой из этих магазинов будет более выгодным для владельца ТЦ, который заинтересован в посещаемости и удовлетворенности клиентов?

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

В связи с этим к дизайну и юзабилити сайтов со стороны поисковика предъявляются следующие требования:

  • Не превышать оптимальный вес страницы. Поисковый робот не обрабатывает ту часть кода, которая превышает установленное значение (80 Кб). Чрезмерный вес странице может добавлять таблица стилей, графические элементы, файлы скриптов. В результате она будет долго загружаться, превышая оптимальную скорость (2 секунды на десктоп и 3 секунды на мобильное устройство).
  • Не перегружать код. Это правило хорошо рифмуется с предыдущим. Проверьте (или поручите проверить) код сайта на наличие в нем Java Script, динамических тегов и т. д. Их лучше переместить в отдельные подключаемые модули.
  • Внедрить внутренний поиск. Наличие поисковой строки на сайте обеспечивает пользователю возможность быстро найти информацию или товар, а вашему сайту — укрепление позиций в выдаче.
  • Обеспечить простую и понятную навигацию по сайту. Чтобы посетитель разобрался в ней в первые же секунды визита. Заполнить текстовым контентом верхний отдел страницы. SEO-специалистам известно, что чем выше находится текст на странице, тем больший вес имеют использованные в нем ключевые слова. С другой стороны, злоупотребляя этим правилом, можно отпугнуть посетителей. Которым сложно воспринимать сразу много текстового контента, не “разбавленного” графическими элементами.
  • Добавить ссылку на главную страницу сайта при нажатии на логотип. Это интуитивно понятный пользователю способ вернуться к началу. И поисковые системы тщательно следят за его внедрением.
  • Позаботиться о мобильной адаптации сайта. И сделать все возможное, чтобы пользоваться им было одинаково удобно на устройствах с разными диагоналями экранов.
  • Реализовать меню в футере и добавить в эту часть сайта кнопку для возвращения к началу страницы.
  • Тщательно структурировать текстовый контент. Правильно оформить абзацы (через каждую 1000 символов), заголовки и подзаголовки (H1, H2. H3).
  • Добавить ссылки на другие страницы. Оформить их нижним подчеркиванием.
  • Протестировать сайт и добиться корректного отображения в любом браузере.
  • Отобразить контактные данные вверху страницы и в футере. Телефоны, адреса, электронная почта, время работы. Номера для мессенджеров тоже приветствуются.
  • Добавить к изображениям описание Alt.

Как поисковые системы оценивают дизайн сайта

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

Почему поисковые алгоритмы обращают такое внимание на дизайн?

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

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

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

Факторы, за которые поисковые роботы повышают уровень доверия к сайту:

  • Уникальный дизайн.
  • “Возраст” сайта: временной промежуток с момента регистрации домена.
  • Активность пользователей: читают ли они тексты, делают покупки, оставляют комментарии, находят ли то, что искали.
  • Взаимодействие с социальными сетями.
  • Данные из справочников и рекламных кабинетов в поисковой сети.
  • Указание контактных данных и номеров официальной регистрации предпринимателя/предприятия.

Mobile-first и Page layout

На Всемирном конгрессе мобильных устройств в 2010 году Эрик Шмидт, генеральный директор Google, заявил, что дизайнеры должны следовать правилу «сначала мобильные» в дизайне продукта.

На основе этого правила был создан индекс Mobile-first, который влияет на ранжирование сайтов и сегодня. В чем суть этого правила и как работает индекс?

правило Mobile-first

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

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

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

Правило Google Mobile-first говорит о том, что разработчикам следует идти по пути “прогрессивного улучшения”, начиная проектировать дизайн для мобильной версии, а затем совершенствовать ее для стационарного ПК.

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

Требования Mobile-first:

  • Наличие на мобильной версии всех важных элементов контента, которые присутствуют на десктопной (видео, текст, изображения с описанием alt).
  • Структурированные данные в обеих версиях.
  • Использование идентичных метатегов в обеих версиях.
  • Связь между версиями остается неизменной. Для этого подходят действующие теги rel=canonical и rel=alternate.
  • Для атрибута hreflang нужно указать ссылки в рамках текущей версии сайта.
  • Выбранный сервер должен быть способным выдержать дополнительную нагрузку краулинга (сканирования страниц).
Если вы учли все эти требования на своем сайте, не спешите праздновать победу. Есть еще кое-что. А именно — улучшение алгоритма верстки, введенное Google еще в 2012 году и актуальное на сегодня.

По словам разработчиков, введение Page layout должно отразиться на позициях в выдаче не более чем для 1% всех сайтов. Но тем, кому “посчастливилось” попасть в это число, придется ждать повторного сканирования страниц роботом, чтобы выйти из-под санкций.

Единственное требование, которое предъявляет алгоритм Page layout — отсутствие большого количества рекламы в области сайта, которая доступна без использования прокрутки

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

Идеальный веб-дизайн: какой он?

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

Почему так происходит? При разработке сайта основное внимание некоторые разработчики уделяют SEO-оптимизации в ущерб внешнему виду и usability (удобству использования). И тогда сайт легко продвигать, но не очень удобно использовать посетителям. А иногда, наоборот, слишком много внимания уделяется внешнему виду и навигации. В итоге веб-ресурс удобен для пользователей, но найти его им нелегко.

Идеальный веб-дизайн — это продукт слаженной работы дизайнера и SEO-специалиста на этапе разработки сайта. Компромисс по каждому параметру, в котором выигрывают обе стороны.

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

Чек-лист для проверки usability сайта

  1. Гармоничное визуальное оформление. Приятное глазу и соответствующее тематике сочетание цветов (не больше 4), красивая типографика.
  2. Отсутствует нагромождение текстовой или графической информации, которую сложно воспринимать.
  3. Корректное отображение и удобство использования с мобильных устройств. Высокая скорость загрузки страниц (1-2 секунды).
  4. Единый стиль для всех страниц. Одинаковый хедер, слоган и меню на каждой странице.
  5. Логичный, понятный, кликабельный логотип. При на нажатии на него посетитель попадает всегда на главную страницу.
  6. Типовое расположение основных элементов: логотип слева вверху, контакты — вверху справа, строка поиска в хедере. В футере — сквозной линк на site map.
  7. Характерное подсвечивание ссылок при наведении курсора.
  8. Соответствие логотипа и иконки сайта, которая отображается во вкладке браузера.
  9. Выделенные кнопки призыва к действию. Которые в достаточном количестве размещены на сайте.
  10. Понятное оглавление меню. Присутствие на сайте “стандартных” страниц: “О компании”, “Каталог продукции”, “Отзывы” и т. д.
  11. Правильно оформленная страница 404: короткий текст, идентичный дизайн, контакты и поиск по сайту.
  12. Отсутствие таких элементов, как нерабочие ссылки, недоступные изображения и видео, не кликабельные кнопкки, обилие всплывающих окон и медийной рекламы, которая перекрывает основной контент.
  13. Защищённый HTTPS протокол.
Обратитесь за услугой создания корпоративного сайта в веб-студию BUSINESS SITE и наша команда реализует для Вас проект в соответствии со всеми требованиями поисковых систем, а также с учетом всех совреманных тенденций веб-дизайна и юзабилити!
Звоните сейчас +38 (044) 495-31-30!
Екатерина Софина
Автор Екатерина Софина
Уважаемый пользователь! C целью предоставления наиболее актуального контента, наш сайт использует файлы cookie. Продолжая взаимодействие с нашим сайтом, вы соглашаетесь с использованием файлов cookie нами.
Принять
Получите скидку -15%
Заполните эту форму