Почему ваше мегаменю может убить вашего SEO

1. Мега-меню может вызвать скрытый дубликат контента
2. Решение загадки дублирующего контента в мегаменю
3. 1 - HTML5 Nav Tags
4. 2 - Ария Роли
5. 3 - Разместите разметку после содержимого тела
6. 4 - Используйте JavaScript для асинхронной загрузки содержимого меню
7. 5 - Не иметь мега-меню
8. Еда на вынос

У вас есть насыщенный контентом сайт, и вы хотите, чтобы посетители могли быстро и легко получить доступ к этому контенту, но разве подход к мегаменю тайно саботирует ваш SEO? Это может быть.

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

Мега-меню может вызвать скрытый дубликат контента

Я буду использовать пример проблемы, с которой мы недавно столкнулись для клиента. Используя один из наших волшебных инструментов SEO для сканирования своего сайта, мы заметили очень странный результат. Он сказал нам, что у них была довольно серьезная проблема с дублированием контента. Итак, мы начали с проверки всех типичных виновников: отсутствие канонических тегов, категорий без понятных URL-адресов, сообщений, отмеченных несколькими категориями, и загрузка контента по протоколам HTTP и HTTPS. Но ни одна из этих вещей не была проблемой на сайте. Итак, в чем может быть проблема?

Как ни странно, когда я просматривал исходный код страницы на нескольких страницах, чтобы убедиться, что канонические теги используются правильно, я начал замечать общую тему: разметка для навигации по сайту была ОГРОМНОЙ! Фактически, это было более 1300 строк кода, а средняя страница была всего около 1800 строк кода. Это заставило меня задуматься, если первые 1300 строк кода будут идентичны на каждой странице сайта, может ли поисковая система считать эти страницы дублирующими друг друга?

Я позволю тебе решить для себя. Вот официальное определение Google для дублированного контента: «Дублированный контент обычно относится к существенным блокам контента внутри или между доменами, которые либо полностью совпадают с другим контентом, либо заметно схожи». Мне кажется совершенно ясным, что Google рассмотрит 1300 строк разметки, созданных это мегаменю как дублированный контент. В этом случае, какие варианты у вас есть, чтобы решить проблему?

Решение загадки дублирующего контента в мегаменю

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

1 - HTML5 Nav Tags

С выпуском HTML5 теперь мы можем использовать разметку, чтобы различать определенные области разметки страницы как <header>, <footer> или даже <nav>. Используя эти теги, мы можем указать сканерам, что определенные области разметки страницы являются повторяющимися или общими элементами по всему сайту, а не фактической частью уникального содержимого страницы.

2 - Ария Роли

Чтобы помочь сделать ваш сайт более доступным для людей с ограниченными возможностями, мы рекомендуем вам начать использовать роли WAI-ARIA. Они очень похожи на теги HTML5 при описании назначения определенных разделов разметки для браузеров и программ чтения с экрана. Для этой конкретной проблемы мы предлагаем реализовать role = ”navigation” вместе с вашим HTML-тегом nav. Это будет выглядеть так: <nav role = ”navigation”> </ nav>. Эти теги теперь поддерживаются большинством браузеров, и даже если они присутствуют в браузере, который их не поддерживает, они безвредны.

3 - Разместите разметку после содержимого тела

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

4 - Используйте JavaScript для асинхронной загрузки содержимого меню

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

5 - Не иметь мега-меню

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

Еда на вынос

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

Для получения дополнительной SEO стратегии и секреты, обратитесь к нашему Директор по стратегии Мэтью О'Брайант.

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

Похожие

Комментарии