Пускай первый пост в этом канале будет техническим

Пускай первый пост в этом канале будет техническим.

Полезные функции Chrome Dev Tools для SEO`шников. Часть 1.

Про ⌘ + ⌥ + I я писать не буду 🙂 Но пойдем по нарастающей.

Изменить User-Agent

Settings (три точки) -> More Tools -> Network Conditions

Убираем галочку с Select automatically и выбираем нужный User Agent. В списке даже сразу есть GoogleBot`ы.

Иногда при аудите нужно проверить как сайт ведет себя с разными агентами + бывают заблокированные ресурсы только для Google Bot на которые хотелось бы взглянуть. Если они проверяют только по UA без проверки Reverse DNS, то этот метод нам подходит.

Есть аналогичные плагины, но а) не все удобные; б) зачем держать лишний плагин, если уже есть функционал?

Изменяем локацию

Settings -> More Tools -> Sensors

Выбираем в выпадающем меню Location.

Я частенько изучаю международные проекты и мне важно знать как сайты реагируют на смену локации и делают ли редиректы и т.д.

Отключить JavaScript

Вариант 1

Command ⌘ + Shift ⇧ + P для MacOS или Control+Shift+P для WIN

В поле вводим Disable и видим в рекомендациях Disable JavaScript -> Кликаем.

Далее перезагружаем страницу через Command ⌘ + R (Control + R)

После того как проанализировали страницу, то включаем обратно командой Enable JavaScript и перезагрузкой страницы.

Сейчас очень важно! Да, поисковые системы следят за трендами SPA, PWA сайтов и модных React, но все же, например, алгоритм определения того, что рендерить, а что нет (Google же не нужно тратить ресурсы на выполнение кода аналитики. Хотя бывает и такое) - не идеален и лучше пока делать максимум SSR, а потому проверять весь ли важный контент есть сразу в коде без JS.

Вариант 2

Как можно отключить не только JS, а какой-то определенный паттерн.

Settings (три точки) -> More Tools -> Network request blocking

Выбираем Add Pattern и вписываем, например, .js

Кстати, это можно было сделать и немного быстрее.

Command ⌘ + Shift ⇧ + P для MacOS или Control+Shift+P для WIN -> Show Network request blocking.

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

Данный “Вариант 2” крут тем, что вы можете поиграть со скоростью загрузки убирая определенные элементы. Например, отключить с сайта какую-то рекламную сеть и проверить насколько она влияла на скорость загрузки (показатели Lighthouse).

Проверка неиспользуемых ресурсов на странице

Settings (три точки) -> More Tools -> Coverage

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

Больше функций будет завтра 🙂 Если нужно видео о том, как все это делать на практике и кейсы использования, то пишите в комментарии (пока на FB).

by @productseo

Источник новости https://t.me/productseo/7...