Валидаторы в SEO

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

Основных валидаторов три: W3C Validator для HTML, Schema Markup Validator для микроразметки и Rich Results Test для расширенных результатов Google.

W3C Validator

Проверяет HTML на ошибки: забытые закрывающие теги, неверную вложенность, дубли id. Открыть можно здесь: validator.w3.org.

Пусть у нас есть такая верстка:

<html>
	<head>
		<title>Page</title>
	</head>
	<body>
		<h1>Title
		<p>Text</p>
	</body>
</html>

Валидатор покажет ошибку: тег h1 не закрыт. Робот тоже споткнется об это место и может неверно понять структуру.

Schema Markup Validator

Проверяет микроразметку JSON-LD, Microdata и RDFa. Показывает, какие свойства разметки распознаны. Открыть можно здесь: validator.schema.org.

Пусть у нас есть такая разметка:

<script type="application/ld+json">
{
	"@context": "https://schema.org",
	"@type": "Article",
	"headline": "Title",
	"datePublished": "2024-01-01"
}
</script>

Валидатор покажет тип "Article" и свойства headline и datePublished. Если синтаксис JSON сломан, он сообщит об ошибке.

Rich Results Test

Проверяет, какие расширенные результаты Google сможет показать для страницы. Открыть можно здесь: search.google.com/test/rich-results.

Пусть у нас есть разметка товара:

<script type="application/ld+json">
{
	"@context": "https://schema.org",
	"@type": "Product",
	"name": "Product",
	"offers": {
		"@type": "Offer",
		"price": "100",
		"priceCurrency": "USD"
	}
}
</script>

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

Как не сломать микроразметку

Микроразметку легко испортить мелкими правками. Держите несколько правил.

Первое: не дублируйте блоки JSON-LD с одним и тем же типом. Два блока "Article" на одной странице собьют валидатор.

Второе: следите за запятыми в JSON. Лишняя запятая ломает весь блок, и поисковик не прочитает ни одного свойства.

Третье: не выводите свойства через innerHTML из пользовательских данных. Кавычки внутри сломают JSON.

Четвертое: после правок шаблона прогоняйте страницу через Schema Markup Validator и Rich Results Test заново.

Проверить страницу можно и из терминала, если у вас есть сохраненный HTML:

curl -s https://example.com/ > page.html

Практические задачи

Расскажите, чем занимается W3C Validator, а чем Schema Markup Validator.

Дана разметка:

<script type="application/ld+json">
{
	"@context": "https://schema.org",
	"@type": "Article",
	"headline": "Title",
}
</script>

Найдите ошибку и объясните, как она повлияет на разметку.

Дана верстка:

<div>
	<h1>Title</h1>
	<p>Text
</div>

Найдите ошибку и расскажите, что покажет W3C Validator.

Расскажите, какие три шага нужно сделать после правки микроразметки на странице.