Как использовать расширение Lighthouse Chrome для SEO

Как бы вы хотели провести быстрый SEO аудит с инструментом, встроенным в ваш браузер Chrome? Вы...
Установка Lighthouse Chrome Extension
Запуск вашего первого отчета маяка
Отчеты о производительности на Lighthouse Chrome
Отчеты о прогрессивных веб-приложениях - Маяк
Маяк проверяет доступность вашего сайта
Лучшая практика Lighthouse Chrome Extension
Проверьте Здоровье Вашего SEO с Маяком
Завершение Хромированного Расширения Маяка

Как бы вы хотели провести быстрый SEO аудит с инструментом, встроенным в ваш браузер Chrome? Вы можете сделать это с расширением Lighthouse.

Если вы не знакомы с Маяк это утилита с открытым исходным кодом, которую профессионалы используют для проверки работоспособности своих сайтов. Он анализирует все: от производительности до доступности и лучших практик.

Маяк Хром Расширение

Инструмент оправдывает свое название: он не дает вам «упасть на камни».

Однако в прошлом вам нужно было запускать Lighthouse в командной строке операционной системы или в качестве модуля Node. Теперь вы можете запустить его в своем браузере.

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

Установка Lighthouse Chrome Extension

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

Во-первых, посетите дополнительная страница , Если он появляется в отдельном окне и выглядит как всплывающее окно, это нормально.

В верхнем правом углу вы должны увидеть кнопку с надписью «Добавить в Chrome» или слова на этот счет. Нажмите на эту кнопку.

Появится всплывающее окно с запросом подтверждения, хотите ли вы установить расширение Lighthouse. Нажмите «Добавить расширение».

Маяк Хром Расширение

После некоторого времени обработки вы увидите сообщение в верхнем правом углу, что расширение было добавлено в ваш браузер Chrome. Закройте это всплывающее окно.

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

Запуск вашего первого отчета маяка

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

Поскольку обычно полезно учиться на примере, мы проведем аудит Домашняя страница SEMRush в этом уроке. Откройте эту страницу в отдельной вкладке.

Затем нажмите на значок Маяк в правом верхнем углу экрана. Появится всплывающее окно.

В середине всплывающего окна вы увидите название расширения (Lighthouse). Чуть ниже вы увидите URL страницы, которую собираетесь оценить. Это должно быть «https://www.semrush.com».

В нижней части всплывающего окна вы увидите две кнопки: «Параметры» и «Создать отчет». Нажмите кнопку «Параметры», чтобы просмотреть некоторые параметры.

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

Производительность - проверяет, насколько быстро загружается страница
Progressive Web App - проверяет такие качества PWA, как скорость отклика и скорость 3G
Доступность - проверяет удобство веб-сайта для нестандартных пользователей (например, для дальтоников)
Best Practices - проверка на лучшие практики разработки веб-приложений
SEO - проверяет, оптимизирована ли страница для эффективной работы на страницах результатов поисковой системы (SERP)

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

Нажмите «ОК» во всплывающем окне «Категории аудита для включения». Затем нажмите «Создать отчет».

Через несколько минут отчет появится в отдельном окне браузера.

Если вы посмотрите сверху, вы увидите числовые оценки для каждой выбранной вами категории аудита:

Маяк Хром Расширение

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

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

Эти оценки являются числами от 0 до 100, где 100 является лучшим. Как видите, низкие баллы получают красный цвет, средние баллы - желтый, а высокие баллы - зеленый. Это следует той схеме, которую вы увидите в других инструментах, таких как PageSpeed Insights ,

SEMRush выглядит хорошо с точки зрения производительности, SEO и передового опыта. Тем не менее, сайт может использовать некоторую работу, когда дело доходит до оценки Progressive Web App. Это необходимо улучшить с точки зрения доступности.

Давайте посмотрим на каждый раздел отчета дальше.

Отчеты о производительности на Lighthouse Chrome

В разделе «Производительность» вы увидите график вверху. Эта временная шкала показывает, сколько времени занимает загрузка страницы.

Как видите, расширение на самом деле «рисует» уменьшенную версию веб-сайта в том месте, где оно загружается. В данном случае это примерно 2,6-секундная отметка.

Ниже временной шкалы вы увидите некоторые ключевые показатели. Первая значимая статистика Paint показывает, сколько времени занимает загрузка страницы. Индекс скорости восприятия показывает, насколько быстро визуально заполняется содержимое страницы. Предполагаемая задержка показывает, сколько времени требуется сайту для ответа на вводимые пользователем данные.

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

Маяк Хром Расширение

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

Lighthouse также жалуется на закадровые изображения, устаревшие форматы изображений и неиспользуемые правила CSS. Эти нарушения, вместе взятые, составляют примерно 410 мс во время загрузки страницы или почти полсекунды.

Таким образом, сразу видно, что если SEMRush позаботится об этих проблемах, сайт сможет сократить время загрузки более чем на секунду. Пользователи будут в восторге от этого.

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

Наконец, Lighthouse также покажет вам информацию о том, что сайт делает правильно . Это в разделе пройденных аудитов.

Отчеты о прогрессивных веб-приложениях - Маяк

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

К сожалению, это не так.

Маяк Хром Расширение

Зачем? Потому что он провалил четыре важных аудита:

Он не регистрирует сервисного работника, который включает функции PWA, такие как push-уведомления
Пользователи не могут добавлять приложение на домашний экран.
Это не настроено для пользовательского экрана-заставки
Адресная строка не настроена в соответствии с цветами темы

Есть еще одна ошибка: «Не отвечает с 200, когда в автономном режиме.» Это, вероятно, ложное чтение, потому что URL был перенаправлен (с https://www.semrush.com на https://m.semrush.com) ,

Ниже списка жалоб Lighthouse еще раз показывает вам все, что SEMRush делает правильно. В этом случае приложение показывает контент, когда JavaScript недоступен, быстро загружает страницу в 3G и использует мета-тег viewport для адаптивного дизайна.

Наконец, Lighthouse показывает список вещей, которые вам нужно проверить вручную:

Кросс-браузерная совместимость
Плавные переходы со страницы на страницу
Уникальные URL для всех страниц

Маяк проверяет доступность вашего сайта

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

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

Есть несколько причин, по которым один из самых популярных инструментов, используемых цифровыми маркетологами, получил столь низкую оценку доступности:

Маяк Хром Расширение

Есть элементы изображения без атрибутов «alt»
Есть ссылки без различимых имен
Есть элементы формы без ассоциированных меток
Цвет фона и переднего плана недостаточно контрастен
Элемент HTML не имеет атрибута lang

Тем не менее, SEMRush также сделал несколько правильных вещей:

Есть элементы с различимыми именами
Элементы хорошо описывают содержание
Элементы хорошо структурированы

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

Лучшая практика Lighthouse Chrome Extension

Раздел Best Practices покажет вам, что сайт делает правильно и неправильно с точки зрения разработки.

На самом верху вы увидите неудачные проверки. SEMRush имеет три из них:

Использует HTTP v1.1 для некоторых ресурсов вместо HTTP v2.2
Не использует пассивных слушателей для улучшения производительности прокрутки
Short_name приложения длиннее 12 символов

Это единственные три недостатка. Вот почему SEMRush получил высокий балл в этой категории.

SEMRush также многое понял правильно. Всего прошло 13 проверок, таких как:

Использует HTTPS
Избегает document.write ()
Избегает устаревших API

Если вы запустили аудит Best Practices для своего сайта и обнаружили некоторые сбои, важно связаться с командой разработчиков. Большинство из этих проблем слишком сложны для тех, кто не является экспертом в разработке веб-приложений.

Проверьте Здоровье Вашего SEO с Маяком

Наконец, категория SEO показывает здоровье сайта с точки зрения SEO. Это еще одна область, где SEMRush получил отличную оценку.

Это потому, что есть только две неудачные проверки:

Маяк Хром Расширение

Документ не имеет мета описания
Документ не использует четкие размеры шрифта

И то, и другое легко исправить, поэтому SEMRush может получить еще лучший результат с точки зрения SEO.

Приложение также прошло несколько проверок, в том числе:

В документе есть элемент <title>
Страница имеет успешный код статуса HTTP
Страница не заблокирована из индекса с помощью robots.txt

Если вы запустите SEO-отчет на своем веб-сайте и увидите ошибки аудита, вы можете позаботиться о них самостоятельно. Тем не менее, это, вероятно, хорошая идея проверить связь с вашей командой разработчиков.

Завершение Хромированного Расширения Маяка

Маяк был только что выпущен. Это означает, что Google, скорее всего, со временем дополнит свой набор функций.

Так что, хотя расширение кажется довольно легким (особенно по сравнению с более сложными инструментами, такими как «Кричащая лягушка»), на данный момент оно находится только в стадии становления. Ищите его для более тщательного анализа вашего сайта в будущем.

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

Вы не знаете, как использовать SEO в своем блоге или что SEO приносит вам как блогеру?
Вы не знаете, как использовать SEO в своем блоге или что SEO приносит вам как блогеру? Ниже я написал краткое и понятное для начинающих руководство по SEO, которое должно пролить свет на темноту и ответить на 4 самых важных вопроса о SEO. По мере того, как вы становитесь лучше на практическом примере, я просто предполагаю, что вы блогер или блогер по путешествиям, и вы хотите использовать статью блога, чтобы достичь верхней позиции в рюкзаках с ключевыми словами в Google.

И если, например, «урок плавания» конвертируется намного лучше, чем «уроки плавания», разве вы не хотели бы знать, что ДО того, как вы инвестируете в SEO для этих ключевых слов?
И если, например, «урок плавания» конвертируется намного лучше, чем «уроки плавания», разве вы не хотели бы знать, что ДО того, как вы инвестируете в SEO для этих ключевых слов? С AdWords вы можете сделать это. Просто начните отправлять трафик с ключевых слов, которые вы хотите протестировать, на свой сайт. И обязательно используйте точное совпадение, чтобы тщательно контролировать поиски, по которым показываются ваши объявления. На этом этапе нужно просто убедиться, что у вас есть хорошее

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

Какой ваш любимый инструмент SEO или совет вы бы дали новичку в SEO?
Какой ваш любимый инструмент SEO или совет вы бы дали новичку в SEO? Поделитесь своими комментариями ниже или пообщайтесь с нами на щебет ,

Знаете ли вы, что правильное SEO на странице (также известное как SEO на сайте) может привести ваш сайт от потери в результатах поиска на 1-й странице основных поисковых систем?
Знаете ли вы, что правильное SEO на странице (также известное как SEO на сайте) может привести ваш сайт от потери в результатах поиска на 1-й странице основных поисковых систем? Откровенно говоря, проанализировав и оптимизировав тысячи веб-сайтов за эти годы, мы обнаружили, что оптимизация на страницах была смехотворно недооценена как SEO-агентствами, так и владельцами веб-сайтов. На самом деле, многие «так называемые» SEO-компании очень мало или вообще не имеют представления

Единственная причина, по которой вы ищете помощь SEO, заключается в том, что вы хотите получить больше бизнеса с вашего сайта, верно?
Единственная причина, по которой вы ищете помощь SEO, заключается в том, что вы хотите получить больше бизнеса с вашего сайта, верно? Но это произойдет только тогда, когда у вас будет полная ясность в том, как вы будете преобразовывать SEO трафик вы генерируете. Если нет, то какой смысл вкладывать свое драгоценное время и деньги в SEO? Помните, что посетители вашего бизнес-сайта ценны только тогда, когда они взаимодействуют

Как вы думаете, вы могли бы оптимизировать конверсию своего сайта, не работая над теми ключевыми словами, которые составляют 80% ваших посещений?
Как вы думаете, вы могли бы оптимизировать конверсию своего сайта, не работая над теми ключевыми словами, которые составляют 80% ваших посещений? Эти очень специфические поиски становятся длинным хвостом. И хотя это правда, что каждый из них генерирует едва ли какой-либо трафик, они являются самым большим источником посещений вашего сайта. Почему длинный хвост так важен для оптимизации конверсии вашего сайта?

Хотели бы вы получать больше контента Как это на ваш почтовый лоток?
Как вы думаете, вы могли бы оптимизировать конверсию своего сайта, не работая над теми ключевыми словами, которые составляют 80% ваших посещений? Эти очень специфические поиски становятся длинным хвостом. И хотя это правда, что каждый из них генерирует едва ли какой-либо трафик, они являются самым большим источником посещений вашего сайта. Почему длинный хвост так важен для оптимизации конверсии вашего сайта?

Вы знаете, как вы всегда хотели бы получить свой собственный совет?
Вы знаете, как вы всегда хотели бы получить свой собственный совет? Приближается 2020 год, и он решил вашу проблему. Хорошо, это, вероятно, не придет, но об этом интересно думать. Что еще более убедительно, так это причина того, что повествование не так сложно поверить. Частично это связано с тем фактом, что большинство из нас так глубоко напуганы, что потеряли нашу человечность, нашу связь с другими и окружающим миром - существуя через слои пластика, металла и густые

Хотели бы вы получить больше информации, хотите ли вы цитату, хотите ли вы увидеть примеры историй болезни, возможно, в вашем секторе или в близком к вам секторе?
Хотели бы вы получить больше информации, хотите ли вы цитату, хотите ли вы увидеть примеры историй болезни, возможно, в вашем секторе или в близком к вам секторе? Напиши мне также [email protected] Выводы: Почему копирайтер SEO-специалиста лучше веб-писателя или копирайтера? Даже лучший копирайтер , не могу предложить вам

Если бы вы были Google, как бы вы сказали, какие 10 страниц показывать в результатах поиска?
Если бы вы были Google, как бы вы сказали, какие 10 страниц показывать в результатах поиска? Ответ на удивление прост и объясняет нам, что нам нужно делать в нашей работе по SEO. Ищите страницы, которые говорят о предмете поиска - очевидно, страница должна фокусироваться на конкретной теме. Если мы ищем «корм для кошек», на хорошей странице будет много информации о «кошачьей еде». Если в нем говорится о «кормах для домашних животных» и кратко упоминается о «кормах

Как бы вы хотели провести быстрый SEO аудит с инструментом, встроенным в ваш браузер Chrome?
Вы не знаете, как использовать SEO в своем блоге или что SEO приносит вам как блогеру?
И если, например, «урок плавания» конвертируется намного лучше, чем «уроки плавания», разве вы не хотели бы знать, что ДО того, как вы инвестируете в SEO для этих ключевых слов?
И если, например, «урок плавания» конвертируется намного лучше, чем «уроки плавания», разве вы не хотели бы знать, что ДО того, как вы инвестируете в SEO для этих ключевых слов?
Вам иногда кажется, что было бы замечательно, если бы вы могли чаще получать отзывы о позиции вашего сайта?
Какой ваш любимый инструмент SEO или совет вы бы дали новичку в SEO?
Знаете ли вы, что правильное SEO на странице (также известное как SEO на сайте) может привести ваш сайт от потери в результатах поиска на 1-й странице основных поисковых систем?
Единственная причина, по которой вы ищете помощь SEO, заключается в том, что вы хотите получить больше бизнеса с вашего сайта, верно?
Если нет, то какой смысл вкладывать свое драгоценное время и деньги в SEO?
Как вы думаете, вы могли бы оптимизировать конверсию своего сайта, не работая над теми ключевыми словами, которые составляют 80% ваших посещений?

Как использовать расширение Lighthouse Chrome для SEO

Как бы вы хотели провести быстрый SEO аудит с инструментом, встроенным в ваш браузер Chrome? Вы можете сделать это с расширением Lighthouse.

Установка Lighthouse Chrome Extension

Запуск вашего первого отчета маяка

Отчеты о производительности на Lighthouse Chrome

Отчеты о прогрессивных веб-приложениях - Маяк

Маяк проверяет доступность вашего сайта

Лучшая практика Lighthouse Chrome Extension

Проверьте Здоровье Вашего SEO с Маяком

Завершение Хромированного Расширения Маяка

Похожие

Комментарии