ТОП 10 советов — Chrome DevTools для SEO аудита сайта

google chrome dev tools

SEO аудит проводят обычно с охапкой специальных сервисов и программ, но базовый простой аудит можно провести и проще, с помощью встроенных инструментов разработчика в браузере Google Chrome. Dev Tools в Google Chrome самая продвинутая панель отладки в браузере, и ей очень удобно пользоваться. Наверное не прошло ни дня, чтобы я не открывал консоль браузера с тех пор как начал серьезно заниматься разработкой и маркетингом. Давайте же рассмотрим, что именно поможет нам провести СЕО аудит своими руками.

Во первых нам потребуется открыть инструменты разработчика, для этого можно использовать сочетания клавиш: Ctrl+Shift+I (для Windows) или Cmd+Opt+I (для Mac) или открыть через меню.

включить dev tools

1. Проверить основные элементы страницы

Для поисковых систем важно, чтобы сайт имел прописанные тайтлы, описания и мета теги. Их отсутствие можно проверить открыв код страницы и выполнив поиск. Конечно это не самый удобный способ, но зато не придется прибегать к другим инструментам.

2. Посмотреть скрытый с помощью CSS контент

Последние новости говорят, что поисковые системы сканируют то, что скрыто с помощью CSS во вкладках или под слайдером, однако отдают такой информации меньший вес. Чтобы сканировать всю информацию на странице лучше убрать в CSS файле свойство display:none. Сделать это можно выполнив поиск по соответствующему свойству.

3. Проверить alt теги

Достаточно просмотреть код элемента и проверить значение свойства alt в теге img, как показано на скриншоте ниже.

проверить тег alt wordpress

4. Проверить конфигурации тегов

Chrome DevTools можно использовать и для проверки тех настройки страниц. Например тегов и атрибутов. Для этого нужно ввести в строку «Search» нужные теги и проверить, как они реализованы. Таким образом можно проверить например теги со свойством rel=»canonical»

5. Проверить статус HTTP заголовка

Во вкладке network вы можете проверить статус ответа сервера. Это должен быть статус 200, а если 404 например, а страница открывается нормально — это плохо. Тогда поисковые роботы будут думать что страница, или же сайт не работают.

6. Проверить адаптивность

Это хороший способ узнать как выглядит ваш сайт на мобильном устройстве, да еще и с разными разрешениями, ориентацией, и скоростью интернета.

проверить адаптивность сайта в google chrome

7. Проверить время загрузки страницы

Также полезная фишка — узнать скорость загрузки вашей страницы и увидеть какие файлы тормозят ее загрузку. Также можно проверить скорость загрузки сайта с разной скоростью — имитируя реальные условия использования сайта например при 3G подключении.

проверить скорость загрузки страницы google chrome

8. Найти ресурсы, которые блокируют визуализацию

Можно использовать данные на вкладке «Network», чтобы узнать, какие JS и CSS файлы загружаются перед DOM и тем самым блокируют его. Это одна из самых распространённых проблем, влияющих на скорость загрузки страницы.

9. Найти смешанный HTTP и HTTPS контент

На вкладке security вы можете просмотреть статус вашего https сертификата и было ли все загружено по этому протоколу. Также обычно в консоли показывается если страница содержит смешанный контент и загружает некоторые файлы через незащищенный протокол.

10. Проверить AMP

Если добавить в url «#development=1«, включить проверку адаптивности то можно проверить есть ошибки в ваших AMP страницах.

Оставить отклик

Ваш адрес эл.почты не будет опубликован.