SEO аудит проводят обычно с охапкой специальных сервисов и программ, но базовый простой аудит можно провести и проще, с помощью встроенных инструментов разработчика в браузере Google Chrome. Dev Tools в Google Chrome самая продвинутая панель отладки в браузере, и ей очень удобно пользоваться. Наверное не прошло ни дня, чтобы я не открывал консоль браузера с тех пор как начал серьезно заниматься разработкой и маркетингом. Давайте же рассмотрим, что именно поможет нам провести СЕО аудит своими руками.
Во первых нам потребуется открыть инструменты разработчика, для этого можно использовать сочетания клавиш: Ctrl+Shift+I (для Windows) или Cmd+Opt+I (для Mac) или открыть через меню.
Содержание:
- 1. Проверить основные элементы страницы
- 2. Посмотреть скрытый с помощью CSS контент
- 3. Проверить alt теги
- 4. Проверить конфигурации тегов
- 5. Проверить статус HTTP заголовка
- 6. Проверить адаптивность
- 7. Проверить время загрузки страницы
- 8. Найти ресурсы, которые блокируют визуализацию
- 9. Найти смешанный HTTP и HTTPS контент
- 10. Проверить AMP
1. Проверить основные элементы страницы
Для поисковых систем важно, чтобы сайт имел прописанные тайтлы, описания и мета теги. Их отсутствие можно проверить открыв код страницы и выполнив поиск. Конечно это не самый удобный способ, но зато не придется прибегать к другим инструментам.
2. Посмотреть скрытый с помощью CSS контент
Последние новости говорят, что поисковые системы сканируют то, что скрыто с помощью CSS во вкладках или под слайдером, однако отдают такой информации меньший вес. Чтобы сканировать всю информацию на странице лучше убрать в CSS файле свойство display:none. Сделать это можно выполнив поиск по соответствующему свойству.
3. Проверить alt теги
Достаточно просмотреть код элемента и проверить значение свойства alt в теге img, как показано на скриншоте ниже.
4. Проверить конфигурации тегов
Chrome DevTools можно использовать и для проверки тех настройки страниц. Например тегов и атрибутов. Для этого нужно ввести в строку «Search» нужные теги и проверить, как они реализованы. Таким образом можно проверить например теги со свойством rel=»canonical»
5. Проверить статус HTTP заголовка
Во вкладке network вы можете проверить статус ответа сервера. Это должен быть статус 200, а если 404 например, а страница открывается нормально — это плохо. Тогда поисковые роботы будут думать что страница, или же сайт не работают.
6. Проверить адаптивность
Это хороший способ узнать как выглядит ваш сайт на мобильном устройстве, да еще и с разными разрешениями, ориентацией, и скоростью интернета.
7. Проверить время загрузки страницы
Также полезная фишка — узнать скорость загрузки вашей страницы и увидеть какие файлы тормозят ее загрузку. Также можно проверить скорость загрузки сайта с разной скоростью — имитируя реальные условия использования сайта например при 3G подключении.
8. Найти ресурсы, которые блокируют визуализацию
Можно использовать данные на вкладке «Network», чтобы узнать, какие JS и CSS файлы загружаются перед DOM и тем самым блокируют его. Это одна из самых распространённых проблем, влияющих на скорость загрузки страницы.
9. Найти смешанный HTTP и HTTPS контент
На вкладке security вы можете просмотреть статус вашего https сертификата и было ли все загружено по этому протоколу. Также обычно в консоли показывается если страница содержит смешанный контент и загружает некоторые файлы через незащищенный протокол.
10. Проверить AMP
Если добавить в url «#development=1«, включить проверку адаптивности то можно проверить есть ошибки в ваших AMP страницах.