Когда и как использовать HTML-карту сайта для SEO и UX?

Джон Мюллер всегда преуменьшал ценность HTML sitemaps. Недавно он вновь выразил свое мнение. Он сказал:

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

Это было довольно резко. Ранее Джон высказывался куда менее категорично:

Когда речь идет о SEO, HTML sitemaps вряд ли пригодятся. Ни для крупных, ни для маленьких сайтов.

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

Мне нравится высказывание бывшего сотрудника Google, а ныне популярного SEO-эксперта Педро Диаса в ответ на замечания Мюллера. Оно мне нравится по той причине, что отражает реальное положение дел в интернете:

К сожалению, изменить архитектуру сложных и больших сайтов - это действительно трудная задача, требующая комплексного подхода. Часто на изменение чего-то подобного могут уйти годы, поскольку это зависит от множества переменных. HTML sitemaps позволяют «пересидеть» это время в комфорте. Раньше они мне не нравились... Но сейчас я вижу в их применении определенный смысл.

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

Что такое sitemaps?

В первые дни существования интернета многие сайты росли органически. Они не создавались по лекалам лучших UX-практик.

Нет.

Они создавались с нуля, и контент на них добавлялся по мере необходимости (зачастую далеко не самыми практичными способами).

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

В большинстве случаев приходилось править HTML вручную в текстовом редакторе, используя беспорядочный WYSIWYG-редактор типа Dreamweaver или один из первых, часто создаваемых на заказ и довольно громоздких инструментов CMS. В любом случае, структура сайта быстро становилась запутанной.

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

Позже поисковые системы ввели XML sitemaps, которые, несмотря на то что приносили относительную пользу поначалу, спустя 25 утратили в своей полезности.

Но действительно ли от HTML-карт можно взять и так просто отказаться?

HTML sitemaps против XML sitemaps

Основное различие между HTML и XML картами сайта заключается в том, что HTML видны посетителям сайта, а XML - нет. Это можно обосновать тем, что XML предназначены в первую очередь для поисковиков.

Стандарт XML sitemaps был введен в конце 2007 года поисковыми системами Google, Yahoo и Bing.

Несмотря на то, что карты сайта нужны для поисковиков, это вовсе не значит, что Google и Bing проиндексируют их. Слова Роб Уоттса подтверждают это:

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

XML sitemaps только в теории обеспечивают 100% индексацию. Так и нужно ли ими вообще заниматься, или лучше потратить время и силы на другие, более проверенные способы?

Почему нужно создавать карты сайта для Google?

На протяжении многих лет представители Google говорили, что сайты нужно создавать для пользователей, а не для поисковых систем. Зачем же тогда в этот раз отклоняться от привычного курса и ориентироваться на поисковики?

Если Google так сказал, значит, мы должны прислушаться, верно?

Не совсем так.

Дело в том, что Google просто «не любит» HTML sitemaps. Он предпочитает XML.

XML карты обычно автоматизированы и сразу включают в себя весь контент, как только он появляется в сети.

Большинство людей никогда не увидят ваш XML sitemap. Они даже не будут знать, где его найти, поскольку он не связан ни с одним видимым местом на сайте.

Как перепрофилировать XML sitemaps, чтобы они работали для людей?

К счастью, всегда есть золотая середина. Необязательно делать XML-карты сайта невидимыми.

Вы можете оформить XML с помощью CSS так же, как вы это делаете с любыми HTML-страницами. Эта техника работает столько же, сколько существует XML. Существуют учебники, которые помогут вам в этом.

Действительно, некоторое время назад казалось, что XML заменит HTML в качестве веб-стандарта. Ну или же что скоро внедрят какой-нибудь компромисс в виде XHTML. Но этого не произошло - в основном из-за многочисленных причин несовместимости (несмотря на то, что формат XHTML был более чистым и менее подвержен ошибкам).

Даже после того, как вы создали XML sitemap, вы все еще можете рассмотреть возможность создания читабельной HTML sitemap для посетителей.

Когда и какой язык разметки использовать?

Вы можете использовать сразу несколько языков разметки. Например:

• Чтобы разделить видимые и невидимые sitemaps-файлы.
• Чтобы иметь сразу несколько HTML и XML карт
• Все зависит от того, как выглядит ваш сайт и какие цели вы преследуете.

Задайте себе следующие вопросы, чтобы разобраться в этом:

• Вы хотите создать страницу быстрого обзора вашего сайта? Используйте HTML-карту.
• Вы хотите индексироваться быстрее и как можно более глубже? Используйте XML sitemap.

Вот примеры использования того или иного языка разметки:

Устаревшие сайты

Хотите верьте, хотите нет, но в интернете все еще существуют старые сайты, созданные десятилетия назад. Они были написаны вручную на HTML, CSS и/или JavaScript.

На самом деле, вы наверняка часто неосознанно пользовались такими сайтами.

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

Некоторые старые сайты могут испытывать трудности с созданием XML sitemap. Поэтому нет ничего страшного в том, что вместо него используется HTML sitemap.

Должны ли вы удалять его, потому что Google так сказал? Конечно, нет.

Большие сайты

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

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

В качестве альтернативе мегаменю

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

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

Сайты без внутреннего поиска

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

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

«Страницы-сироты»

Когда вы создаете меню, которым более или менее можно пользоваться, но в нем слишком много страниц, некоторые из них неизбежно оказываются «сиротскими».

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

Зачастую страницы-сироты следует удалить совсем.

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

Более быстрая индексация

Давайте будем честны: если что-то указано в XML sitemap (например, изображения или видео), это еще не означает, что Google обязательно проиндексирует это. Ваш сайт может не обладать достаточным авторитетом, чтобы все его содержимое попало в индекс.

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

Хороший ссылочный капитал

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

В XML sitemaps такой иерархии (если мне не изменяет память) не существует. Все перечисленное там является просто элементами списка. Однако вы можете создать иерархию там вручную.

HTML sitemaps, в то же время, позволяют вам связать те элементы, которые имеют наибольшее значение, и таким образом направить на них больше пользователей.

Юзабилити

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

HTML sitemaps улучшают UX, предоставляя:

• Доступность.
• Стабильность.
• Находимость.
• Общее удобство использования.

Это все еще самые сильные примеры использования HTML sitemaps, как и в 90-х годах, задолго до того, как Google начал использовать ссылки для индексирования и ранжирования и задолго до появления XML sitemaps.

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

Примеры полезных и рабочих sitemaps

The New York Times

Я часто использую The New York Times в качестве примера, потому что почти все знают это издание - оно является авторитетным. В этот раз я хочу привести NYT в качестве примера просто потому, что им удалось сделать что-то правильное и выделиться. The New York Timesиспользует видимые HTML sitemaps таким образом, что они становятся действительно полезными как для читателей, так и для ботов поисковых систем.

NYT имеет несколько файлов sitemaps, о которых рассказал наш коллега по SEO Крис Лонг из Go Fish Digital:

«60 Second SEO: У The New York Times одна из лучших HTML sitemaps, которые я видел. Вот пример того, как статья 1912 года находится всего в пяти кликах от главной страницы:».

Apple.com

Еще один отличный пример использования sitemap для крупного сайта - это Apple.com. Их простая и понятная навигация полезна как для людей, так и для поисковых систем.

Apple sitemap здесь начинается с раздела About Apple (без ссылки) и следующих ссылок:

Навигация сайта начинается с магазина и конкретных продуктов:

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

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

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

Источник: https://searchengineland.com/html-sitemaps-seo-ux-when-how-394763