Ошибки amp страниц

Обязательная структура AMP-страницы

Каждая AMP-страница — это не просто HTML с особыми компонентами. Это код с жёсткими требованиями. Забудете один обязательный тег или неправильно напишете атрибут, валидатор AMP выдаст ошибку. И неважно, что остальные 99% страницы выглядят идеально.

В <head> AMP-страницы должны быть:

Ссылка на основной скрипт AMP: <script async src="https://cdn.ampproject.org/v0.js"></script>. Без неё ничего работать не будет.

Каноническая ссылка на обычную версию: <link rel="canonical" href="https://example.com/page"…. Google использует её, чтобы понять, что вот эта AMP-версия соответствует обычной странице.

Meta-тег viewport для мобильных устройств: <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">.

Обязательный тег <style amp-custom> для пользовательских стилей CSS.

Если чего-то одного нет — Search Console покажет в консоли ошибку валидации AMP. На AMP-страницах Google сразу исключит её из результатов поиска на мобильных. Трафик упадёт.

Конкретный пример. Младший разработчик забыл добавить <meta charset="utf-8">. Кажется, мелочь. Валидатор AMP выдал: «отсутствует обязательный тег». Страница не прошла проверку amp-страниц в Google Search Console. Через неделю владелец заметил: трафик с поисковых систем упал на 40%.

Проблемы с CSS и тегом style amp-custom

Стили в AMP работают по другим правилам, чем в обычном HTML. TегУ <style amp-custom> — самое частое место ошибок.

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

Вторая: запрещено использовать !important. Вот такой код вызовет ошибку:

html

Правильно будет:

html

Третья проблема — некоторые CSS-селекторы AMP просто не поддерживает. Псевдоселектор :hover работает очень ограниченно, селекторы вроде :before и :after могут привести к ошибкам валидации.

Четвёртая: обычный <style> тег без атрибута amp-custom вызовет ошибку. Валидатор AMP требует именно <style amp-custom>.

Инструменты для проверки. В Google Search Console под разделом AMP видны все ошибки стилей для каждой страницы. Валидатор AMP тоже сразу их выделяет.

Ошибки с изображениями и видеоконтентом

Изображения на AMP-страницах требуют обязательно два атрибута: width и height. Это не просто рекомендация — без них валидатор выдаст ошибку.

Плюс нужен атрибут layout. Он определяет, как элемент ведёт себя на странице. Значения типа responsive, fixed, fill — каждое работает по-своему.

Неправильно: html

Правильно: html

Для видеоэлементов то же самое. Компонент <amp-video> тоже требует width, height и layout. Если забыть — ошибка валидации AMP. На мобильных устройствах видео может вообще не загрузиться.

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

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

Другие распространённые ошибки валидации

Со ссылками тоже проблемы. Если использовать javascript: в href, это нарушает требования AMP. Валидатор AMP это поймёт сразу.

Формы нужны в виде <amp-form>, а не обычных HTML-форм. Обычная форма на AMP-странице — это ошибка валидации.

Структурированные данные (Schema.org) часто содержат синтаксические ошибки в JSON. Google не сможет прочитать информацию о товаре, статье или событии. Это не исключит страницу из поиска, но повлияет на CTR.

Неправильный doctype — тоже частая история. Вместо <!DOCTYPE html> (для AMP) пишут HTML 4 doctype. Это нарушение требований AMP.

Распространённая ошибка со скриптами: разработчик добавляет сторонний JavaScript вместо того, чтобы использовать компоненты AMP. Пользовательские скрипты запрещены в AMP. Если попробовать — валидатор выдаст ошибку валидации.

Как найти ошибки в коде AMP-страниц

Способ первый: откройте URL страницы в браузере, добавьте в конец #development=1. Google выведет все ошибки валидации AMP прямо в консоль разработчика.

Способ второй: используйте бесплатный валидатор AMP. Скопируйте URL, нажмите проверить. За несколько секунд инструменты покажут полный список ошибок валидации с описанием.

Способ третий: Google Search Console. Откройте раздел об улучшении, найдите блок AMP. Здесь Google автоматически показывает все ошибки валидации на AMP-страницах, которые уже в индексе. Список обновляется каждый день.

Для SEO-специалистов: критичные ошибки (которые исключают страницы из поиска) отмечены красным. Это помогает быстро приоритизировать работу. Сначала исправляете критичные, потом занимаетесь предупреждениями.

Для разработчиков: валидатор показывает точную строку кода, где ошибка. Копируете исправление из документации AMP — и готово. Проверить результат можно через минуту.

Как ошибки влияют на трафик и видимость

Критичные ошибки валидации AMP означают одно: Google исключает страницу из мобильных результатов поиска. Если сайт получает большую часть трафика с мобильных, падение видимости будет на 50–80%.

Владелец замечает это в Google Analytics: трафик упал, конверсии исчезли, доход упал. На самом деле причина простая — единственная ошибка в коде изображения.

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

Вот почему аудит сайта на ошибки AMP — основной технический SEO процесс. Даже небольшое исправление (добавить width и height в картинку) может вернуть потерянный трафик за пару дней. Поиск Google переиндексирует страницы быстро, и результат видно почти сразу.