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

Сторонник поисковой системы Google Джон Мюллер всегда преуменьшал значение карт сайта в формате HTML. Недавно он вновь выразил свое недовольство картами сайта в формате HTML, заявив:

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

Это немного более сильная позиция, чем то, что он выражал в прошлом:

«Когда дело доходит до SEO… для небольших сайтов ваш сайт должен быть просканирован в любом случае (и если вы используете обычную CMS, это почти всегда будет хорошо), а для больших сайтов они все равно не будут полезны. (используйте карты сайта, используйте обычные перекрестные ссылки, проверьте с помощью поискового робота по вашему выбору)».

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

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

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

Существует компромисс между картами сайта HTML и XML, поэтому, как всегда в SEO, «это зависит».

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

Что такое карты сайта и зачем они были изобретены?

На заре Интернета многие веб-сайты росли естественным образом.

Веб-сайты не были должным образом спланированы информационными архитекторами в соответствии с лучшими практиками UX.

Они начинали с нуля, и веб-мастера добавляли контент по мере необходимости, часто далеко не удобными способами.

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

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

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

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

Более 25 лет спустя карты сайта в формате HTML стали менее предпочтительными. Но можем ли мы действительно перестать использовать HTML-карты сайта, как отказались от гостевых книг или веб-сайтов?

Карты сайта HTML и XML: видимое и невидимое

Короче говоря, основное различие между картами сайта в формате HTML и XML заключается в том, что карта сайта в формате HTML обычно видна посетителям веб-сайта, а карта сайта в формате XML — нет. (Последний в первую очередь предназначен для поисковых систем.)

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

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

С другой стороны, то, что ресурс находится в XML-карте сайта, не означает, что Google и Bing проиндексируют его или его можно будет найти, даже если он есть в индексе.

Другой коллега по SEO Роб Уоттс добавил к дебатам ироничный рассказ из первых рук, сказав:

«В течение многих лет у меня были сайты, на которых отсутствовали карты сайта в формате html или xml. Я снял свою шапочку из фольги и начал использовать карты сайта в формате xml, и мне понравилось видеть, сколько времени потребовалось, чтобы URL-адреса появились в поисковой выдаче. Я не думаю, что заметил какое-либо заметное улучшение производительности при их использовании, но это немного упростило некоторые анализы/отчеты».

Таким образом, если XML-карты сайта только теоретически обеспечивают сканирование и индексацию, должны ли мы сосредоточиться на них и пренебречь видимыми или визуальными картами сайта?

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

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

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

Во всяком случае, так сказал Google, так что мы должны слушать, верно? Не совсем.

Должна быть причина, по которой Google не любит карты сайта в формате HTML и предпочитает XML.

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

В WordPress множество инструментов создают карты сайта для вас. Yoast SEO также охватывает вас, например, даже в базовой бесплатной версии.

В 2020 году WordPress наконец-то добавил в ядро ​​поддержку XML-карты сайта, так что вам даже не понадобятся внешние плагины.

Формат кода XML также является машиночитаемым, в то время как HTML запутан. HTML должен работать, несмотря на ошибки, в то время как XML ломается, когда вы забываете символ.

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

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

Как заставить XML-карты сайта работать на людей

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

Вы можете форматировать XML-карты сайта с помощью таблиц стилей так же, как и любые HTML-страницы.

Этот метод работает с тех пор, как существует XML. Существуют обучающие программы, которые помогут вам в этом.

Действительно, какое-то время казалось, что XML заменит HTML в качестве веб-стандарта, или это был компромисс, называемый XHTML.

По соображениям совместимости этого не произошло. Хотя формат XHTML был чище и менее подвержен ошибкам. Когда произошла ошибка, сайт сломался.

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

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

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

Когда использовать визуальные или HTML-карты сайта

Это не или/или. Ты можешь:

• Решите разделить как видимые, так и невидимые карты сайта вместо того, чтобы делать XML-карту сайта видимой для людей.
• Создавайте как видимые (HTML), так и невидимые (XML) карты сайта на своем сайте по разным причинам.
• Иметь более одной карты сайта в формате HTML или XML.

Это зависит от того, как выглядит ваш сайт и каковы ваши цели.

Используйте эти вопросы как руководство к принятию решения:

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

Тем не менее, есть крайние случаи, и многие веб-сайты не соответствуют типичным стандартам.

Вот примеры использования визуальных или HTML-карт сайта.

Устаревшие и/или жестко закодированные сайты

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

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

Amazon.com — почти тот же сайт, что и много лет назад. На протяжении многих лет он постоянно обновлялся и совершенствовался по сей день.

Полный редизайн был бы слишком рискованным и разрушительным для итоговой прибыли.

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

Вы должны удалить его, потому что Google так говорит? Конечно, нет.

Крупные сайты

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

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

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

Вам не нужно перечислять каждую страницу, так как это сделает ее слишком большой.

Альтернатива мегаменю

Многие сайты пытаются вписать как можно больше в свою навигацию по сайту и в конечном итоге имеют так называемые мегаменю.

Вы наводите указатель мыши на навигацию, и меню внезапно охватывает весь сайт.

Пользователи быстро ошеломлены визуально десятками опций на выбор.

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

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

Но они часто являются кошмаром для пользователя, как ясно демонстрирует основатель журнала Smashing Magazine Виталий Фридман.

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

При работе в Интернете вы можете заметить, что со многими сайтами довольно сложно связаться с ними.

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

Функция поиска была бы логичным решением, но удивительно, что некоторые сайты не имеют ее, даже те, которые работают на WordPress, который имеет встроенную функциональность.

Некоторые владельцы тем или веб-сайтов просто удаляют поисковый ввод.

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

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

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

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

Это происходит, когда контент удаляется и обновляется, а некоторые ссылки исчезают.

Часто страницы-сироты должны быть полностью удалены.

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

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

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

Будем честны! Тот факт, что страница или другой ресурс (например, изображение или видео) указан в XML-карте сайта, не означает, что Google будет его индексировать.

Возможно, у вашего сайта недостаточно полномочий для включения всего его контента в индекс Google.

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

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

Ссылайтесь на более важный контент сверху, на видном месте и/или чаще.

Лучшая ссылочная ценность

Когда мы говорим об авторитете, мы имеем в виду ссылочный вес, который некоторые SEO-специалисты до сих пор называют «ссылочным соком».

Карта сайта в формате HTML, которая показывает одни ссылки вверху, а другие внизу, в некоторой степени регулирует поток ссылок.

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

Насколько мне известно, в XML-картах сайта такой иерархии нет. Все перечисленные в нем ресурсы — это просто элементы в списке.

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

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

Видимая HTML-карта сайта позволяет вам связать те ресурсы, которые наиболее важны, и, таким образом, направлять больше пользователей и авторитетов, как в навигации по вашему сайту. Таким образом, это не «последний» сверху, а самый важный сверху, в идеале.

Удобство использования

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

В конце концов, это земля поисковых систем, а не UX Collective. Они выступают за создание (внутренней) карты сайта UX для каждого проекта веб-сайта, по крайней мере, при создании информационной архитектуры.

Карты сайта в формате HTML улучшают общее взаимодействие с пользователем, особенно:

• Доступность.
• Открытость.
• Находимость.
• Удобство использования.

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

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

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

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

Полезные примеры карты сайта в дикой природе

Нью-Йорк Таймс

Я часто использую в качестве примера «Нью-Йорк Таймс», потому что почти все знают это издание, а это такой авторитет.

На этот раз я хочу показать NYT в качестве примера просто потому, что им удалось сделать что-то правильно и выделиться.

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

У Нью-Йорк Таймс есть несколько карт сайта, выделенных коллегой по поисковой оптимизации Крисом Лонгом из Go Fish Digital в LinkedIn. Это яркий пример использования карты сайта в интересах веб-сайта.

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

Я не хочу вдаваться в подробности, так как Лонг уже отлично справился с этой задачей.

Apple.com

Еще один отличный пример использования карты сайта для большого сайта — Apple.com. Их обычная и простая текстовая карта сайта полезна для людей и поисковых систем.

Однако обратите внимание, насколько сильно карта сайта отличается от фактической верхней навигации на сайте Apple над содержимым.

«Карта сайта Apple» начинается с «Об Apple» (без ссылки) и следующих ссылок:

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

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

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

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

Он меньше как по размеру шрифта, так и по количеству ссылок, но все равно очень полезен.

Поэтому, где бы вы ни оказались, у вас всегда есть навигация по сайту или карта сайта, которые помогут вам.

Пользовательский интерфейс «все легко найти» занимает центральное место в дизайне веб-сайта Apple.