Как проводить аудит веб-сайта с помощью Chrome Lighthouse?

Google Chrome — один из лучших доступных браузеров со множеством скрытых функций. В частности, инструменты разработчика имеют такие функции, как красивый вид миниатюрных файлов CSS и JS. Теперь вы можете провести полный аудит своего сайта с помощью инструментов разработчика Chrome с интеграцией Lighthouse. Lighthouse — это программное обеспечение с открытым исходным кодом для автоматического тестирования для повышения производительности веб-сайтов и приложений. В этой статье мы объясним, как проводить аудит веб-сайтов с помощью функции Chrome Lighthouse.

Начало работы с Chrome Audit

Откройте веб-страницу, на которой вы хотите провести аудит. Перейдите в меню «Просмотр»> «Разработчик»> «Инструменты разработчика» или щелкните правой кнопкой мыши и выберите «Проверить». Если вы используете Chrome на ноутбуке с Windows, просто нажмите F12, чтобы открыть инструменты разработчика в Chrome.

  • Перейдите на вкладку «Аудиты» в инструментах разработчика.
  • Нажмите кнопку «Выполнить аудит…», чтобы начать аудит.
  • Вы можете добавить сайт для проведения нового аудита, нажав кнопку «+».
  • После аудита нажмите кнопку загрузки, чтобы получить отчет об аудите на свой компьютер.
SEO-аудит Google Chrome Lighthouse

SEO-аудит Google Chrome Lighthouse

Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)

Проведение аудита веб-сайта

Chrome покажет всплывающий экран со следующими категориями для аудита.

  • Производительность
  • Прогрессивное веб-приложение
  • Лучшие практики
  • Доступность
  • SEO

Выберите нужные категории и нажмите кнопку «Выполнить аудит».

Lighthouse Audits для выполнения

Lighthouse Audits для выполнения

Результаты аудита сайта

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

Отчет об аудите Lighthouse

Отчет об аудите Lighthouse

Просмотрите различные разделы, чтобы найти пройденные результаты и улучшения, необходимые для вашего сайта.

Производительность

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

Отчет об аудите эффективности Lighthouse

Отчет об аудите эффективности Lighthouse

Помимо показателей, в разделе «Производительность» доступно несколько других подразделов. В разделе возможностей будут показаны возможные варианты повышения скорости загрузки страницы. Например, вы можете получить на странице неиспользуемые правила CSS, которые можно удалить, чтобы улучшить загрузку. производительность.

В разделе «Диагностика» будут показаны запросы с наивысшим приоритетом, называемые запросами критической цепи. Вы можете сократить время загрузки запросов критической цепочки, чтобы повысить скорость загрузки страницы.

Прогрессивное веб-приложение

Инструмент Chrome Lighthouse проверит страницу на наличие рекомендации по прогрессивным веб-приложениям. В разделе «Прогрессивное веб-приложение» показаны неуспешные, пройденные и элементы, требующие ручной проверки. Некоторые из факторов, проверенных для прогрессивных веб-приложений, включают скорость загрузки при подключении 3G, загрузку контента в области просмотра, использование HTTPS и перенаправление HTTP на HTTPS.

Отчет о прогрессивном веб-приложении Lighthouse

Отчет о прогрессивном веб-приложении Lighthouse

Доступность

В разделе «Доступность» показаны возможности улучшения доступности вашего сайта. Например, вы можете проверить, указан ли допустимый язык и структурированы элементы. Поскольку все функции доступности не могут быть протестированы автоматически, инструмент также предложит элементы, которые необходимо проверить вручную.

Отчет о доступности маяка

Отчет о доступности маяка

Лучшие практики

Инструмент проверит приложение или сайт на соответствие рекомендациям для современного мира и покажет результаты в разделе «Лучшие практики».

Лучшие практики Lighthouse

Лучшие практики Lighthouse

SEO

SEO — это новая функция, добавленная в аудит Chrome Lighthouse. Поисковая оптимизация важна для любого сайта, чтобы гарантировать, что поисковые системы, такие как Google и Bing, могут индексировать сайт и отображаться в результатах поиска. SEO-аудит проверит выбранный сайт на наличие мета-описания, альтернативных тегов, заголовка страницы, канонического тега. удобство для мобильных устройств и индексируемость страницы.

Отчет об аудите Lighthouse SEO

Отчет об аудите Lighthouse SEO

Средство просмотра отчетов Lighthouse

Вы можете просмотреть загруженный отчет аудита с помощью Блокнота или TextEdit. Но контент не будет в удобочитаемом формате, как вы можете видеть в инструментах разработчика Chrome. Для чтения содержимого отчета вам потребуется дополнительная программа просмотра отчетов. Перейти к Программа просмотра отчетов Lighthouse страница.

Средство просмотра отчетов Lighthouse

Средство просмотра отчетов Lighthouse

Перетащите отчет, загруженный из Chrome, в поле. Вы увидите отчет в Chrome в том же формате, что и в инструментах разработчика.

Просмотр отчета Chrome Lighthouse

Просмотр отчета Chrome Lighthouse

Расширение Chrome Lighthouse

В Chrome также есть отдельное расширение Lighthouse для проведения аудита веб-сайтов. По сути, это тот же инструмент, который интегрирован в инструменты разработчика браузера Chrome. Так что вы можете использовать расширение в случае, если вам не нравятся инструменты разработчика.

Вы можете перейти в Интернет-магазин Chrome и установить Пристройка маяка в браузере Chrome. Он добавит значок маяка рядом с адресной строкой Chrome. Нажмите «Параметры», чтобы выбрать категории для аудита, а затем нажмите кнопку «Создать отчет», чтобы запустить аудит веб-сайта.

"<yoastmark

Отчет об аудите веб-сайта откроется в новом окне после завершения аудита.

Вы можете просмотреть видео ниже, чтобы получить полную информацию о Chrome Lighthouse.

Заключительные слова

Теперь, когда вам не нужно искать несколько инструментов для проверки производительности вашего сайта. Инструмент Chrome Lighthouse позволяет выполнять полный аудит веб-сайта в разделе инструментов разработчика браузера. Это хороший вариант для разработчиков и владельцев сайтов, чтобы проводить аудит и принимать меры по улучшению.

Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *