Проверка заголовков и alt-текста
Проверьте иерархию заголовков и alt-тексты изображений на странице без регистрации.
Инструмент
Инструмент один раз загружает указанный адрес через наш сервер, извлекает все заголовки от h1 до h6 в порядке документа и показывает их как структуру с отступами; каждый тег img выводится с alt-текстом, атрибутами width и height, признаком loading="lazy", принадлежностью к элементу picture и наличием srcset. Сверху показаны число заголовков, h1, изображений, изображений без атрибута alt и слов в видимом тексте; ниже идут результаты и что делать по каждому из них. Таблицу изображений можно скопировать как CSV.
Иерархия заголовков важна для трёх читателей: посетитель, просматривающий страницу, различает разделы по заголовкам; пользователь программы чтения с экрана перемещается по странице из списка заголовков; поисковая система читает организацию содержимого из той же структуры. Инструмент отдельно отмечает отсутствие h1, несколько h1, пропущенные уровни (например, h4 сразу после h2), пустые и повторяющиеся заголовки, заголовки длиннее 70 символов и первый заголовок, который не является h1. Один h1 не является обязательным, но это распространённый и надёжный выбор; стандарт HTML допускает несколько h1, однако один главный заголовок понятнее для программ чтения с экрана и поисковых систем. Alt-текст сообщает посетителю, который не видит изображение, что оно передаёт, и помогает поиску по картинкам понять содержимое; инструмент помечает изображения без атрибута alt как «нет», пустой alt как декоративный, а alt длиннее 125 символов или равный имени файла как требующий проверки.
Инструмент читает только HTML, который возвращает ваш сервер; заголовки и изображения, добавленные в браузере через JavaScript, фоновые изображения CSS и галереи, подгружаемые скриптами, ему не видны. Он не проверяет, загружаются ли изображения на самом деле, их размер файла и сжатие; соответствует ли alt-текст изображению, может оценить только человек. Результат для одного и того же адреса хранится в памяти сервера 10 минут, затем удаляется; кроме введённого адреса ничего не читается.
Частые вопросы
Использовать несколько h1 это ошибка?
Нет, стандарт HTML допускает несколько h1, и по заявлениям Google само по себе это не проблема для ранжирования. Тем не менее один h1 делает основную тему понятнее для пользователей программ чтения с экрана и поисковых систем; поэтому один h1 остаётся распространённым и надёжным выбором.
Нужно ли писать alt-текст для декоративного изображения?
Дайте декоративному изображению пустой alt (alt=""), тогда программа чтения с экрана его пропустит. Не удаляйте атрибут совсем, иначе некоторые программы прочитают имя файла. Для информативного изображения напишите короткое предложение о том, что на нём показано.
Видит ли инструмент заголовки и изображения, созданные через JavaScript?
Нет, читается только первый HTML, который возвращает сервер. На страницах, которые собирают содержимое в браузере скриптами, структура и список изображений могут оказаться неполными; сравните результат с выводом «просмотр исходного кода страницы» в браузере.
Зачем нужны width и height?
По этим двум значениям браузер вычисляет соотношение сторон и резервирует место до загрузки изображения, поэтому содержимое не сдвигается вниз во время загрузки. Через CSS изображение по-прежнему можно масштабировать; атрибуты лишь объявляют соотношение.
