Параллакс (одностраничные сайты) и SEO [RU]

ПАРАЛЛАКС: ДИЗАЙН ПРОТИВ SEO?

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

Нужно ли отказываться от удачного дизайнерского решения ради качественного SEO? Или всё-таки можно творчески подойти к вопросу и найти компромисс? Чтобы ответить на эти вопросы, начнём с самого начала.

Что такое дизайн с параллаксной прокруткой

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

Вот буквально несколько примеров параллакса на веб-сайтах:

  • Asvada.com, сайт интеркативного-агентства;
  • Spotify, сервис составления музыкальных плейлистов;
  • сайт Google о том, как работает поисковая машина компании.

Одно из главных преимуществ такого подхода к дизайну — возможность визуальными средствами рассказать посетителю сайта увлекательную историю, не заставляя его щёлкать по ссылкам.

Как параллакс затрагивает SEO и аналитику

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

Мало того — измерять вовлечённость посетителей на одностраничных сайтах очень непросто. Хотя длительность сеанса даёт некоторое представление о том, как себя ведут посетители, назвать аккуратной эту метрику нельзя. По мнению Авинаша Каушика, во многом это связано с активным использованием вкладок в браузерах.

Хотя многие утверждают, что параллаксный скроллинг увеличивает вовлечение, подтверждающих это исследований (например, сплит-тестов) практически нет.

Что с мобильной аудиторией?

В недавнем отчёте, подготовленном Walker Sands, говорится, что за год мобильный трафик на сайтах вырос на 78%, и на него теперь приходится 24% общего трафика (сайтов). Но параллакс на мобильных устройствах работает не слишком хорошо. Это означает, что пока веб-мастерам приходится создавать вторую версию сайта специально для мобильных устройств — так поступили, к примеру, специалисты Google, подготовив альтернативную версию сайта "How Search Works".

Есть ли обходные пути?

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

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

Использование JavaScript, метатега http-equiv="refresh" или других методов переадресации пользователей на другую страницу для показа содержания, отличающегося от предоставленного роботу поисковой системы, является нарушением рекомендаций Google для веб-мастеров.

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

Оптимальное решение: комбинированный подход

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

Spotify это дало порядка 3400 проиндексированных Google страниц. Для сравнения, в Google проиндексирована лишь одна страница сайта для спецверсии Range Rover Evoque от Виктории Бэкхем.

Что учесть при выборе между параллаксом и другими подходами к дизайну

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

  1. Поможет ли параллакс рассказать посетителям интересную историю?
  2. Насколько критично для бизнеса использовать поисковую оптимизацию для привлечения трафика?
  3. Допустим ли комбинированный вариант?

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

  • Ключевые слова: помните, что страницу с параллаксным скроллингом не получится успешно оптимизировать под ключевые слова из разных тематик. Поэтому планируйте карту сайта так, чтобы поддерживающий контент был выстроен вокруг большинства ключевых слов, по которым вы будете продвигаться.
  • Глубокий контент: продумайте, как вы свяжете основную страницу с вспомогательными. Как именно вы сегментируете историю, с какого момента материал нужно подробно раскрывать на отдельной странице? Пример удачного решения — сайт о туризме в Новой Зеландии, на котором эта разбивка очень хорошо продумана.
  • Посетители с мобильных устройств: подумайте, как сайт будет выглядеть на смартфонах и планшетах. Если вы создаёте новую версию уже действующего сайта, проверьте данные аналитики по пользователям мобильных устройств. Не исключено, что уже сейчас их намного больше, чем вам кажется. Не стоит оставлять их со страницей, по которой они не могут перемещаться. Продумайте, как вы будете с ними работать.
  • Аналитика: что именно вы хотите знать о своих посетителях? Какие их действия вы хотите измерять? Возможно, вы хотите видеть, какие предложения или продукты больше всего интересны вашим посетителям? Может быть, контент какого типа им больше всего интересен? Решите, как размещать такой контент на отдельных страницах, чтобы у вас была возможность собирать данные для аналитики и принимать информированные решения.
  • Ретаргетинг: если вы хотите настроить ретаргетинг посетителей на основе интересов, вероятно, вам нужно будет «приземлять» их на определённую страницу. Скажем, если вы хотите вернуть на сайт посетителей, которые начали, но не завершили регистрацию, будет логичным создать отдельную страницу с формой регистрации.

источник