Обзор встроенных инструментов Яндекс.Браузера для SEO-специалиста. Проверка скорости, заголовков, микроразметки, мобильной версии. Консоль, Network, Lighthouse — что смотреть для быстрой диагностики сайта.
Введение
Яндекс.Браузер — это не просто окно в интернет. Это полноценный SEO-инструмент, который всегда под рукой. Встроенные инструменты разработчика позволяют за минуту проверить заголовки ответа сервера, скорость загрузки, корректность микроразметки, ошибки в консоли и ещё десяток параметров, влияющих на ранжирование. И всё это бесплатно, без установки дополнительных программ и расширений. В этой статье — обзор инструментов Яндекс.Браузера, которые должен знать каждый SEO-специалист. Не про верстку и отладку JavaScript, а именно про SEO-диагностику: что смотреть, куда нажимать и как интерпретировать увиденное.
Как открыть инструменты разработчика
Инструменты разработчика открываются тремя способами: клавиша F12, комбинация Ctrl+Shift+I, или правый клик по странице и пункт «Исследовать элемент». Откроется панель, разделённая на вкладки. Для SEO-аудита важны следующие вкладки: Network (Сеть), Console (Консоль), Lighthouse, Elements (Элементы) и Application (Приложение). Переключаться между ними можно кликом по названию вкладки. Панель можно открепить в отдельное окно кнопкой с тремя точками в правом верхнем углу — это удобно, если у вас два монитора. Важный нюанс: инструменты разработчика должны быть открыты до загрузки страницы, иначе часть данных (особенно сетевые запросы) не запишется. Поэтому сначала открывайте панель, потом вбивайте URL и жмите Enter.
Вкладка Network: что отвечает сервер
Вкладка Network — это сердце SEO-диагностики. Она показывает все запросы, которые делает страница при загрузке: HTML, CSS, JavaScript, изображения, шрифты, API-запросы. Что смотреть SEO-специалисту. Первое: статус главного запроса (обычно первый в списке, сам URL страницы). Код ответа должен быть 200. Если 301 или 302 — страница редиректит. Если 404 или 500 — проблемы с доступностью. Второе: заголовки ответа. Кликаем на главный запрос, переходим на вкладку Headers. Смотрим Response Headers: Content-Type (должен быть text/html), Content-Encoding (gzip или br — значит, сжатие работает), Cache-Control и Expires (настроено ли кеширование), X-Robots-Tag (если есть — страница может быть закрыта от индексации). Третье: время загрузки. На вкладке Timing видно, сколько времени занял каждый этап: DNS-запрос, соединение, ожидание ответа, получение данных. Если Waiting (TTFB) больше 500 миллисекунд — сервер тормозит. Четвёртое: все остальные запросы. Смотрим, нет ли ошибок 404 для CSS, JS или изображений. О том, как анализировать заголовки кеширования, читайте в статье Настройка заголовков Cache-Control и Expires для ускорения сайта.
Вкладка Lighthouse: аудит скорости и не только
Lighthouse — это встроенный в Яндекс.Браузер инструмент аудита, который проверяет сайт по четырём направлениям: Performance (скорость), Accessibility (доступность), Best Practices (лучшие практики) и SEO. Чтобы запустить: открываем инструменты разработчика, находим вкладку Lighthouse, выбираем категории (для SEO-аудита — Performance и SEO), жмём Generate report. Через 30-60 секунд получаем отчёт с оценками и списком проблем. Что смотреть в разделе Performance. First Contentful Paint (FCP) — первая отрисовка контента. Largest Contentful Paint (LCP) — загрузка самого большого элемента. Total Blocking Time (TBT) — время блокировки основного потока. Cumulative Layout Shift (CLS) — визуальная стабильность. Для мобильного SEO важно запускать Lighthouse с эмуляцией мобильного устройства и замедлением сети — эти опции включаются галочками в настройках аудита. Что смотреть в разделе SEO. Lighthouse проверяет: наличие meta description, корректность hreflang (если есть), наличие alt-текстов у изображений, соотношение текста и HTML, валидность canonical, размер шрифтов для мобильных. Это не замена полноценному SEO-аудиту, но быстрый чек, который выявляет очевидные проблемы.
Вкладка Console: ошибки и предупреждения
Консоль показывает ошибки JavaScript, предупреждения безопасности и сообщения от браузера. Для SEO важны следующие сигналы. Ошибки Mixed Content — когда страница на HTTPS загружает ресурсы по HTTP. Это блокируется браузером и ухудшает безопасность сайта. Предупреждения о блокировке ресурсов — если robots.txt запрещает загрузку CSS или JS, браузер может не отрендерить страницу корректно. Ошибки CORS — если ресурсы не загружаются из-за политики кросс-доменных запросов. Сообщения о проблемах с микроразметкой — Lighthouse и другие инструменты выводят в консоль предупреждения о невалидном JSON-LD. Ошибки 404 для ресурсов страницы — если какой-то скрипт или стиль не загрузился, страница может отображаться некорректно. Не все ошибки в консоли критичны для SEO. Но если страница падает с фатальной ошибкой JavaScript, робот Яндекса может не увидеть контент. Поэтому регулярно проверяйте консоль на наличие красных ошибок и разбирайтесь с причинами.
Вкладка Elements: что видит робот в HTML
Вкладка Elements показывает DOM-дерево страницы — то, как браузер интерпретировал HTML после выполнения JavaScript. Это важно для JS-сайтов: вы видите не исходный код, а финальный рендер. Что проверять. Title и description: найдите в дереве теги title и meta description. Совпадает ли их содержимое с тем, что вы задали? Не перезаписывает ли их JavaScript? Canonical: найдите link rel="canonical". Корректный ли URL? Hreflang: если сайт многоязычный, найдите link rel="alternate" с hreflang. Все ли языковые версии прописаны? H1: найдите тег h1. Есть ли он, один ли он, видим ли? Скрытые элементы: иногда вредоносный код вставляет скрытые ссылки или текст, которые видны роботу, но не пользователю. В Elements можно увидеть элементы с display:none или visibility:hidden. Изображения: проверьте alt-тексты у img-тегов. Есть ли они, релевантны ли?
Эмуляция мобильных устройств
Инструменты разработчика позволяют эмулировать мобильное устройство. В верхней панели инструментов есть иконка смартфона — Toggle Device Toolbar. Включаем, и страница отображается так, как её видит пользователь на выбранном устройстве. Можно выбрать конкретную модель (iPhone, Samsung, Pixel) или задать своё разрешение. Для SEO-аудита обязательно проверьте: нет ли горизонтальной прокрутки, читается ли текст без зума, не наползают ли элементы друг на друга, достаточно ли крупные кнопки и ссылки для нажатия пальцем. В этом же режиме можно эмулировать скорость сети. Рядом с выбором устройства есть выпадающий список с вариантами: Online, Fast 3G, Slow 3G, Offline. Выберите Slow 3G и перезагрузите страницу — вы увидите, как сайт грузится у пользователя с плохим интернетом. Если в таких условиях страница грузится дольше 5 секунд — у вас проблемы с мобильной скоростью. О полной методике проверки мобильной версии читайте в статье Мобильная оптимизация сайта и Mobile-First Index.
Регламент быстрой проверки через Яндекс.Браузер
Вот алгоритм, который занимает 5 минут и выявляет 80 процентов проблем. Открываем инструменты разработчика. Переходим на вкладку Network, ставим галочку Disable cache. Загружаем страницу. Смотрим код ответа главного запроса — должен быть 200. Смотрим TTFB — должно быть меньше 500 миллисекунд. Проверяем наличие сжатия (Content-Encoding: gzip или br). Проверяем заголовки кеширования (Cache-Control). Переходим на вкладку Console — смотрим на красные ошибки. Переходим на вкладку Elements — проверяем title, description, canonical, H1. Включаем мобильную эмуляцию — проверяем адаптивность. Запускаем Lighthouse с галочками Performance и SEO. За 5 минут вы знаете о сайте больше, чем 90 процентов его посетителей.
Часто задаваемые вопросы
Отличаются ли инструменты разработчика в Яндекс.Браузере от Chrome? В основе обоих браузеров лежит Chromium, поэтому инструменты разработчика практически идентичны. Отличия в деталях: Яндекс.Браузер может иметь дополнительные интеграции с сервисами Яндекса, но базовый функционал SEO-диагностики одинаков.
Можно ли проверить индексацию страницы через браузер? Напрямую нет. Вы видите, как страница выглядит для пользователя, а не для робота. Чтобы узнать, проиндексирована ли страница, используйте оператор site: в поиске или инструмент «Проверить URL» в Яндекс.Вебмастере.
Почему Lighthouse показывает разные результаты при повторных запусках? На результаты влияет множество факторов: загрузка сервера в момент теста, скорость вашего интернета, кеш браузера, фоновые процессы на компьютере. Для объективной оценки запускайте Lighthouse 2-3 раза и берите среднее значение.
Как проверить, видит ли робот контент, загружаемый через AJAX? Во вкладке Elements вы видите DOM после выполнения JavaScript. Если контент, подгружаемый через AJAX, отображается в Elements, значит, он присутствует в DOM. Но это не гарантирует, что робот его увидит — у робота может не хватить времени на выполнение скрипта. Проверяйте через «Проверить URL» в Вебмастере.
Нужно ли отключать кеш при SEO-аудите через браузер? Да, всегда ставьте галочку Disable cache на вкладке Network. Иначе вы будете проверять закешированную версию страницы, а не реальную загрузку с сервера. Пользователь, который заходит на сайт впервые, кеша не имеет — и вы должны видеть ту же картину.
