Pagespeed insight: Make the Web Faster  |  Google Developers

Содержание

Битрикс — Ускорение загрузки сайта + оптимизация для Google PageSpeed Insights

«Ускорение загрузки сайта + оптимизация для Google PageSpeed Insights» — это решение для 1с-Битрикс, ускоряющее отображение сайта на всех типах  устройств и  положительно влияющее на баллы, скорость и параметры загрузки сайта в Google  PageSpeed Insights.

Обзор возможностей решения в видео-формате: youtube.com

Увеличение баллов в PageSpeed является не самоцелью, а последствием ускорения отображения страницы за счёт её оптимизации решением.

1. Оптимизация css-стилей сайта
Решение оптимизирует работу таблиц стилей, сокращает время отображения страницы. Стили объединяются в один файл и оптимизируются — как следствие уменьшается вес стилей и количество подключений.

Решение оптимизирует не только стандартные стили сайта, но и внешние — например Google Fonts. Сохраняет, оптимизирует и подключает их локально.

Оптимизация стилей устраняет проблему «Устраните ресурсы, блокирующие отображение» в PageSpeed.

2.

Оптимизация изображений
Решение конвертирует изображения в современный формат WebP, позволяющий значительно сократить вес изображений и ускорить работу браузера с изображениями.

Оптимизация изображений устраняет или уменьшает проблемы «Используйте современные форматы изображений» и «Настройте эффективную кодировку изображений» в PageSpeed.

3. Оптимизация JavaScript и счётчиков
В последних версиях   решения добавился функционал работы с JavaScript — теперь вы можете   отложить выбранные скрипты до загрузки страницы или до взаимодействия   пользователя с сайтом

4. Font-display
Решение имеет механизм автоматической установки font-display: swap для шрифтов

Использование font-display устраняет проблему «Настройте показ всего текста во время загрузки веб шрифтов» в PageSpeed

5. Preconnect и Preloading
С помощью решения можно через настройки установить preconnect   (предсоединения), preloading (предзагрузки) без редактирования кода сайта

Использование preloading устраняет проблему «Настройте предварительную загрузку ключевых запросов» в PageSpeed

6. Удаление стандартного OpenSans
Битрикс актуальных версий автоматически подключает шрифт OpenSans — если он вам не нужен, с помощью решения можно удалить данное подключение и сэкономить несколько килобайт загрузки

Простая установка и настройка
Решение не редактирует исходные файлы проекта
Обрабатываемые css-стили оптимизируются и сжимаются
Поддерживается работа с Google Fonts и внешними стилями
Ускоряет работу сайта у реальных пользователей, а не только в PageSpeed Insight
Умеет удалять подключаемый из ядра битрикса Open Sans
▷   Оптимизирует работу с JavaScript и счётчиками
▷  Отдельные настройки для каждого сайта по многосайтовости
✔   Корректно работает на пк, смартфоне и планшете  
Поддерживает механизм многосайтовости
Одинаково хорошо работает с кодировками UTF-8 и Windows-1251
Использует стабильные события и работает на большинстве версий 1с-Битрикс
Поддерживает композитный и автокомпозитный режим
Корректно работает с большинством готовых решений (Аспро, Digital Web, Intec и т.д.) и на сайтах с уникальным дизайном


Дополнительные рекомендации:

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

— Решение «Отложенная загрузка картинок, видео и фоновых изображений», решающее проблему «Отложите загрузку изображений» — смотреть карточку решения

— Решение «Оптимизация и сжатие HTML + CSS», уменьшающее вес отдаваемых html-страниц — смотреть карточку решения

Как устранить влияние Яндекс.Метрики на показатели Google PageSpeed Insights

Сервис Google PageSpeed Insights является одной из «пузомерок» с помощью которых вебмастера проверяют скорость работы сайта. Этот сервис анализирует контент веб-страницы и советует, как ускорить ее загрузку. В идеале все хотят видеть зеленый индикатор со значением 100.

Но как бы тщательно вы не оптимизировали свой сайт сразу после внедрения счетчиков посещений будь то Яндекс.Метрика, LiveInternet или Google Analytics индекс PageSpeed проседает на пару десятков пунктов.

Примеры показателей PageSpeed для моего тестового сайта:

До внедрения Яндекс.Метрики

После установки счетчика Яндекс.Метрики

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

По-совести говоря, счетчик Яндекс.Метрики никак не влияет на скорость загрузки сайта. Но несмотря на то, что код Яндекс.Метрики стал намного быстрее, Google PageSpeed всё равно ругается на него благим матом.

Как снизить влияние Яндекс.Метрики на скорость загрузки сайта

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

Например, можно использовать следующий код:


setTimeout(() => {
// Сюда вставляете метрики без тегов <script>           
}, 3000)

Опытным путем я подобрал значение задержки загрузки кода Метрики равное 3 секундам. После этого Google PageSpeed уже не замечает счетчик и показатели скорости загрузки возвращаются к норме, то есть к состоянию до установки счетчика.

Но у такого решения есть недостаток, не смотря на то, что счетчик работает, индикатор состояний счетчика в панели управления Яндекс.Метрики становится «красным»:

Так же могут вырасти показатели отказов. В прочем, зачем нам посетители которые провели на сайте меньше 3-х секунд ?

Очевидно, что отложенное выполнение JavaScript на странице (а именно так устанавливаются все счетчики и скрипты аналитики) нужно настраивать в зависимости от источника перехода и действий пользователя.

То есть для роботов Яндекс.Метрики отдавать код счетчика сразу и тогда индикатор будет зеленым. Для сервиса Google PageSpeed — с задержкой, чтобы не портить показатель. Пользователям — после совершения действий на странице, например, прокрутке, перемещения мыши и так далее.

Подробно о таком способе загрузке счетчика написано на сайте https://www.kobzarev.com/technical-seo/yandex-metrika-lazy-load/.

Предложенное авторами решение подойдет для всех сайтов. Но если вы используете WordPress, то проще всего воспользоваться бесплатным плагином True Lazy Analytics. Который кроме упомянутой мной Яндекс.Метрики умеет добавлять на WordPress сайт счетчики LiveInternet и Google Analytics.

Основная цель плагина — подключить системы аналитики без снижения баллов в тесте Google PageSpeed Insight.

Внешний вид плагина True Lazy Analytics

Вам достаточно указать только номер вашего счетчика Яндекс.Метрики и перед закрывающим тегом </body> на страницах вашего сайта появится примерно следующий код:

После установки счетчика Яндекс.Метрики с помощью плагина True Lazy Analytics показатели Google PageSpeed Insights вернулись к своим первоначальным значениям и в моем случае на тестовом сайте имеют следующий вид:

Индикатор в панели управления Яндекс.Метрики стал «зеленым», что говорит о том, что счетчик работает:

Показатели отказов остались на прежнем уровне, у меня это около 10%:

Выводы

Если вам важны показатели Google PageSpeed Insights, то используйте отложенную загрузку счетчиков, для сайтов на WordPress есть бесплатный плагин.

Конечно, счетчики не единственное «зло» на сайтах за которое понижаются баллы в Google PageSpeed. Но выполняя отложенную загрузку Яндекс.Метрики вы станете немного милее для роботов Google.

Ускорение загрузки сайта + оптимизация для Google PageSpeed Insights: модуль для 1С-Битрикс


  • Подходящие редакции 1С-Битрикс: Первый сайт, Старт, Стандарт, Эксперт, Малый бизнес, Бизнес
  • Включает в себя: Модуль
  • Категории: Для разработчиков, Инструменты, SEO, Маркетинг, реклама, Другое
  • Название компании-партнера: Голубев Артур
  • Последняя версия: 4.1.1
  • Дата обновления: 01.04.2022
  • Дата публикации: 03.04.2019
  • Число установок: Более 1000 раз
  • Адаптивность: Да
  • Поддержка композита: Да
  • Совместимо с Сайты24: Нет

«Ускорение загрузки сайта + оптимизация для Google PageSpeed Insights» — это решение для 1с-Битрикс, ускоряющее отображение сайта на всех типах  устройств и  положительно влияющее на баллы, скорость и параметры загрузки сайта в Google  PageSpeed Insights.

Обзор возможностей решения в видео-формате

: youtube.com

Увеличение баллов в PageSpeed является не самоцелью, а последствием ускорения отображения страницы за счёт её оптимизации решением.

1. Оптимизация css-стилей сайта
Решение оптимизирует работу таблиц стилей, сокращает время отображения страницы. Стили объединяются в один файл и оптимизируются — как следствие уменьшается вес стилей и количество подключений.

Решение оптимизирует не только стандартные стили сайта, но и внешние — например Google Fonts. Сохраняет, оптимизирует и подключает их локально.

Оптимизация стилей устраняет проблему «Устраните ресурсы, блокирующие отображение» в PageSpeed.

2. Оптимизация изображений
Решение конвертирует изображения в современный формат WebP, позволяющий значительно сократить вес изображений и ускорить работу браузера с изображениями.

Оптимизация изображений устраняет или уменьшает проблемы «Используйте современные форматы изображений» и «Настройте эффективную кодировку изображений» в PageSpeed.

3. Оптимизация JavaScript и счётчиков
В последних версиях   решения добавился функционал работы с JavaScript — теперь вы можете   отложить выбранные скрипты до загрузки страницы или до взаимодействия   пользователя с сайтом

4. Font-display
Решение имеет механизм автоматической установки font-display: swap для шрифтов

Использование font-display устраняет проблему «Настройте показ всего текста во время загрузки веб шрифтов» в PageSpeed

5. Preconnect и Preloading
С помощью решения можно через настройки установить preconnect   (предсоединения), preloading (предзагрузки) без редактирования кода сайта

Использование preloading устраняет проблему «Настройте предварительную загрузку ключевых запросов» в PageSpeed

6. Удаление стандартного OpenSans
Битрикс актуальных версий автоматически подключает шрифт OpenSans — если он вам не нужен, с помощью решения можно удалить данное подключение и сэкономить несколько килобайт загрузки

Простая установка и настройка
Решение не редактирует исходные файлы проекта
Обрабатываемые css-стили оптимизируются и сжимаются
Поддерживается работа с Google Fonts и внешними стилями
Ускоряет работу сайта у реальных пользователей, а не только в PageSpeed Insight
Умеет удалять подключаемый из ядра битрикса Open Sans
▷   Оптимизирует работу с JavaScript и счётчиками
▷  Отдельные настройки для каждого сайта по многосайтовости
✔   Корректно работает на пк, смартфоне и планшете  
Поддерживает механизм многосайтовости
Одинаково хорошо работает с кодировками UTF-8 и Windows-1251
Использует стабильные события и работает на большинстве версий 1с-Битрикс
Поддерживает композитный и автокомпозитный режим
Корректно работает с большинством готовых решений (Аспро, Digital Web, Intec и т.д.) и на сайтах с уникальным дизайном


Дополнительные рекомендации:

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

— Решение «Отложенная загрузка картинок, видео и фоновых изображений», решающее проблему «Отложите загрузку изображений» — смотреть карточку решения

— Решение «Оптимизация и сжатие HTML + CSS», уменьшающее вес отдаваемых html-страниц — смотреть карточку решения

Для получения технической поддержки пишите на почту: [email protected]

Перед обращением в поддержку рекомендую проверить:

— Наличие обновлений у решения (20% обращений с проблемами решаются установкой свежих обновлений)

— Проверку системы в админке сайта (35% обращений решаются исправлением ошибок которые она находит)

При обращении в техническую поддержку укажите:

1. Подробное описание проблемы
Постарайтесь максимально подробно описать проблему и укажите какие действия нужно произвести для её обнаружения. Скриншоты приветствуются.

2. Решение с которым связана проблема

3. Адрес сайта

4. Доступы к административный панели (Логин и Пароль)

5. FTP или SFTP доступ (Хост, Логин, Пароль и Порт, если он не стандартный)

Я отвечаю на все вопросы поступающие на email поддержки, если ответа не поступает более суток, проверьте папку спам.

Подробнее о технической поддержке решений и регламент работы — https://arturgolubev.ru/knowledge/course1/

Как понять и использовать PageSpeed ​​Insights для оптимизации вашего веб-сайта

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

Стенограмма видео:

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

Хорошо. Давайте посмотрим, как понять и использовать информацию о скорости страницы для оптимизации наших веб-сайтов.

Почему важна скорость страницы?

Итак, почему скорость страницы важна в первую очередь? Что ж, 15 июня 2021 года обновление интерфейса страницы начало распространяться по всему миру. Он был завершен в августе, и он действительно включает в себя все аспекты того, как пользователь будет взаимодействовать с веб-страницей, а также насколько хорошо она соответствует их ожиданиям.

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

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

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

Как проверить скорость нашей страницы?

Итак, как мы можем проверить скорость нашей страницы? Вы можете сделать это несколькими способами.

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

Google предоставил нам несколько инструментов, которые позволяют нам видеть, как работают наши страницы, когда речь идет о скорости и интерактивности взаимодействия. Они даже дают нам несколько советов о том, как мы можем улучшить эти страницы. Таким образом, анализ скорости страницы — это действительно инструмент, который делает это за нас. Они работают как на мобильных, так и на настольных компьютерах, и дают нам предложения по улучшению этих страниц. Именно то, что я только что сказал. Подробнее об этом можно прочитать на сайте developer.google.com.

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

Понимание результатов

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

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

Теперь вы заметите одну вещь: в большинстве случаев ваши сайты будут работать намного лучше на настольных компьютерах. Когда речь идет о настольных компьютерах, требования гораздо более мягкие, но, поскольку большинство людей сегодня ищут на мобильных устройствах, особенно когда речь идет о потребителе, Google действительно, очень сильно бьет по мобильным устройствам, и поэтому они перешли на первый мобильный индекс. Таким образом, ваша оценка основана на 100, и прямо под ней вы увидите, что ваша оценка в данном случае равна 18 из 100, так что это неудовлетворительная оценка.И тогда он расскажет нам, почему эта конкретная страница не работает.

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

Полевые данные

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

Сводка происхождения

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

Лабораторные данные

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

Действия

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

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

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

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

Опыт страницы

Два способа оценить эффективность вашего веб-сайта. Один из таких способов — прямо в консоли поиска, где мы можем посмотреть на работу страницы. Теперь главная страница страницы покажет нам количество хороших URL-адресов, то есть это URL-адреса, которые имеют хороший статус в основных веб-показателях, а затем и показы вместе с ними.Теперь, если мы пойдем ниже, мы увидим некоторые другие сигналы, связанные с работой страницы, такие как основные веб-жизненные показатели, удобство использования на мобильных устройствах, а также HTTPS в безопасности.

Core Web Vitals

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

Итак, у нас есть несколько страниц, у которых проблемы со скоростью.Они загружаются дольше четырех секунд. Нам нужно настроить их, поэтому давайте посмотрим, что они из себя представляют. Теперь, как правило, он даст вам самого большого защитника и все, а не весь список страниц, но если вы нажмете, он скажет: «Эй, вот похожие страницы». Итак, если вы посмотрите, все они являются страницами блога, что означает, что у них, вероятно, у всех есть некоторые похожие проблемы, которые можно исправить один раз на сайте, а затем решить все проблемы по всем направлениям.

Инструмент PageSpeed ​​Insights

Если я поднимусь наверх здесь, я могу просто пойти дальше и щелкнуть данные о скорости страницы, и он запустит инструмент анализа скорости страницы с URL-адресом, который у меня был в консоли поиска.Загрузка может занять несколько минут. Это действительно зависит от скорости вашего интернета, размера вашей страницы и нескольких других факторов, но обычно для запуска этого требуется от 20 до 45 секунд.

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

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

Ниже мы видим наш счет, который ужасен. Это 8 из 100, поэтому с треском проваливается, когда дело доходит до этой страницы. Затем у нас есть полевые данные или сводка по происхождению, о которой мы говорили, то есть за последние 28 дней. И, наконец, наши лабораторные данные здесь.

Теперь мы видим, что у нас есть первая содержательная отрисовка, они говорят, что это занимает 3,7 секунды. Время взаимодействия, почти минута. Индекс скорости, 24 секунды. Время блокировки, самая большая содержательная краска, 56 секунд. Совокупно вне смены в 0.378.

Теперь вы можете посмотреть на это и сказать: «Если это была ваша страница, это ужасно. Мы должны просто взорвать ее и начать все сначала». Но сейчас я вам скажу одну вещь: это просмотр с серверов Google с помощью Lighthouse. Если я пойду и вставлю этот URL сюда, вы увидите, что это не займет и семи секунд.

Теперь обратите внимание на то, что произошло. Вы видели, как за секунду грузился экран, брали изображения? Вот эти коробки, прыгали.Вот что вызывает проблемы с кумулятивным сдвигом макета. Несмотря на то, что это произошло в течение нескольких секунд, это то, что Google не хочет видеть, и это то, что нужно решать. Вы также заметите, что для взаимодействия с этой страницей не потребовалось 75 секунд, это все равно было бы далеко за пределами того, что мы делаем прямо сейчас. Итак, вы должны принять это с долей скептицизма, и Google довольно строг, когда дело доходит до этого.

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

Контентное рисование и скорость

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

Я умею многое. Если у меня есть доступ к серверу, я могу работать над временем отклика сервера и тому подобными вещами. Я могу оптимизировать CSS. Я могу минимизировать JavaScript. Итак, есть ряд вещей, которые мы можем сделать здесь. Первая содержательная краска, я могу добавить текстовое впечатление. Вы заметили, что некоторые из них работают в нескольких областях.

Изображения

Но посмотрите на все, самая большая проблема, и самый большой нарушитель — это изображения. Теперь это будет большинство веб-сайтов. И если у вас есть проблемы с изображениями, подобные этой, или ваши изображения, они либо слишком большие, либо не отформатированы в форматах следующего поколения, поэтому что-то вроде WebP, который является форматом, в котором Google Chrome любит изображения, вы можете использовать инструменты. Один из инструментов, который мне больше всего нравится для этого, называется Imagify и позволяет очень быстро оптимизировать ваши изображения без потери качества этих изображений.

Если вы находитесь на сайте WordPress, на самом деле есть ряд вещей, которые вы можете сделать здесь, когда дело доходит до устранения источников блокировки рендеринга. Теперь этот сайт находится на HubSpot, но мы возвращаем его на WordPress, так что у нас больше контроля над этими проблемами здесь. Но когда дело доходит до WordPress, есть плагины, которые могут помочь вам во многом. Такие вещи, как WP Rocket или W3 Total Cache, просто убедитесь, что вы настроили их правильно и делаете это в том порядке, в котором вы ничего не ломаете, потому что иногда, когда вы добавляете эти мидификации или перемещаете код с помощью плагин, он может заставить ваш сайт делать довольно странные вещи.

Секция диагностики

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

И одним из способов, которым вы можете это сделать, было использование чего-то, что называется отображением шрифта. Сейчас это работает не во всех браузерах, сейчас работает только с Chrome. Это еще не то, что используется повсеместно, но это то, что вы можете сделать. Вы можете удалить сторонний код со своего сайта.

Это тоже сложно, потому что вы можете заглянуть сюда и сказать: «Ну, частично это Google, частично Facebook Pixel, а частично другие плагины, которые нам нужны.» Так что не бейте себя по голове, делайте все возможное, но не удаляйте то, что вам действительно нужно.

Просто просмотрите их и найдите элементы, явно задающие высоту и ширину для ваших изображений. Это важно. Это помогает сканерам. Это помогает им быстрее выполнять свою работу. Итак, есть ряд вещей, которые вы можете сделать. Одна из вещей, которые мне нравятся больше всего, это то, что я беру их, иду в поиск Google и нахожу кого-то еще, у кого есть проблемы, потому что знаете что, мы не единственные, у кого есть эти проблемы.Все делают. И люди постоянно находят решения.

Итак, ищите эти проблемы, а затем проверяйте их в вашей конкретной настройке. Итак, если вы используете WordPress, посмотрите на проблемы, как вы можете решить это в WordPress. Если вы HubSpot, если вы Squarespace и все остальные, поищите эти варианты в Google.

Это может быть действительно полезным отчетом, если вы используете его и знаете, как его читать, и вы действительно можете предпринять какие-то действия на его основе. Самый большой вывод из этого заключается в том, что PageSpeed ​​Insight — отличный инструмент, помогающий понять, как ваш сайт или, в частности, ваши веб-страницы работают в поиске Google и как сканер взаимодействует с ними.

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

Если у вас есть какие-либо вопросы о PageSpeed ​​Insights, любые вопросы о том, о чем мы говорили в этом видео, пожалуйста, оставьте комментарий ниже.Мы хотели бы продолжить этот разговор с вами. И до следующего раза, счастливого маркетинга.

— Переоценена ли скорость страницы?

В наши дни веб-мастера сходят с ума, когда дело доходит до их оценки Google Page Speed. Хотя хорошо известно, что забота о скорости страницы вашего веб-сайта является хорошей практикой, достоверность оценки Google Pagespeed Insights вызывает споры. Тем не менее, люди, кажется, одержимы максимальным баллом Google Pagespeed Insights.«Если вы хотите, вы можете бесплатно получить отчет о производительности от эксперта ShimmerCat, чтобы найти узкие места и варианты увеличения скорости».

Давайте посмотрим, заслуживает ли он такой переоценки.

Во-первых, высокая оценка Google Page Speed ​​Insights дает ложные надежды. Веб-мастера начинают верить, что реальная скорость страницы намного выше, а повышение рейтинга — это верная вещь. Все это неправда.

PageSpeed ​​Insights не является инструментом Page Speed ​​

Здесь вы можете не согласиться.Хотя реальность такова, что большинство SEO-агентств не используют PageSpeed ​​Insights для определения скорости страницы для своих клиентов.

Что такое «Google Page Speed ​​Insights»

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

Pagespeed Insights — это инструмент отслеживания производительности.Это позволит вам проверить, достаточно ли оптимизирован внешний интерфейс, чтобы обеспечить наилучший веб-сайт с удобным пользовательским интерфейсом и плавной навигацией. Но обратите внимание, что когда вы запускаете этот инструмент, он не требует тестирования скорости страницы.

Скорость страницы завышена?

Ответ на этот вопрос и да, и нет.

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

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

Скорость страницы, безусловно, является фактором ранжирования. Но это один из 200 факторов ранжирования.

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

Такого никогда не бывает.

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

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

Анализ Pagespeed Insights

Вот несколько веб-сайтов из разных ниш. Чтобы проверить взаимосвязь между тремя факторами, мы протестировали эти сайты с помощью двух инструментов.Один из них, безусловно, PageSpeed ​​Insights, а другой — WebPageTest. Факторами, корреляцию которых необходимо было изучить, были WebPageTest Page Speed, PageSpeed ​​Insights и рейтинг.

Обратите внимание, что все эти сайты созданы на WordPress. Есть много веб-сайтов с отличными показателями Page Speed ​​и оптимальным временем загрузки, но не WordPress дает им такую ​​возможность. Платформы имеют большое значение.

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

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

В целях конфиденциальности имена и ссылки веб-сайтов не разглашаются.

Веб-сайт 1: Блог о еде

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

Сайт ранжируется примерно по 186 000 ключевых слов. При этом 4700 из них находятся в первой пятерке. Общее количество обратных ссылок превышает 1000. Несмотря на то, что рейтинг PageSpeed ​​Insights составляет 17 для мобильных устройств и 32 для настольных компьютеров.

Согласно WebPageTest время загрузки составляет 14 секунд. Только представьте веб-сайт, загрузка которого занимает целых четырнадцать секунд. Тем не менее, это убивает его в поиске.

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

Веб-сайт 2: Блог домашних животных

Низкое время загрузки не помешало успеху этого блога.

Блог ранжируется примерно по 101 000 ключевых слов, из которых 2 900 занимают первые пять позиций. Обратных ссылок более 900.

Поразительно, но этот великолепный веб-сайт загружается за семь секунд, согласно тесту веб-страницы. Оценка Google Pagespeed Insights составляет 18 для мобильных устройств и 40 для настольных компьютеров.

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

Веб-сайт 3: Маркетинговый веб-сайт и блог

Оценка Pagespeed Insights не так велика, но скорость отличная.

Блог ранжируется примерно по 1 миллиону ключевых слов, при этом 2900 из них занимают первые пять позиций. Обратные ссылки пересекают 66 000 цифр.

65 для мобильных устройств и 97 для компьютеров. Это оценки Google Pagespeed Insights. Но с помощью WebPage Test оказалось, что сайт загружается всего за 2,7 секунды.

Это должно быть достаточным доказательством того, что оценки Google Pagespeed Insights не следует переоценивать.В этом примере они средние, тем не менее, мы видим, что время загрузки вполне приемлемо.

Проблемы, отмеченные Google PageSpeed ​​Insights

Удалите источники, блокирующие рендеринг. Некоторые файлы CSS и JS можно переделать, чтобы они были отложены или асинхронизированы. Убедитесь, что текст остается видимым. Это одна из самых серьезных проблем, о которых сообщается. Хотя это не то, с чем сталкивается большинство людей. Многие из нас загружают свои шрифты из Google, и сейчас нет способа решить эту проблему с помощью библиотеки шрифтов Google.
Решение состоит в том, чтобы добавить шрифты непосредственно на ваш веб-сайт или использовать webfont.js, но в обоих случаях вам нужны разработчики.

Веб-сайт 4: SEO-компания

Оценка Insights очень низкая. Время загрузки также очень мало.

Тем не менее, веб-сайт ранжируется примерно по 13 000 ключевых слов, а 423 из них занимают первые пять позиций. Обратных ссылок более 4000.

25 для мобильных устройств и 58 для настольных компьютеров — это оценки Google Pagespeed Insight. Согласно тесту WebPage, для загрузки документа требуется 6,5 секунд.

Разве это не звучит иронично? SEO-компания с медленной скоростью.

Скажем вам, что они по-прежнему хорошо ранжируются, когда речь идет о самых основных SEO-терминах в Google. Ужасные параметры, упомянутые выше, имеют нулевое значение, когда дело доходит до SEO-рейтинга.

Веб-сайт 5: Программное обеспечение для тестирования конверсии

Довольно быстрая загрузка, несмотря на жалкие оценки. Блог ранжируется примерно по 44 000 ключевых слов, а 1500 из них занимают первые пять позиций. Обратных ссылок более 13000.

балла Pagespeed Insights такие же плачевные, как 7 для мобильных устройств и 48 для компьютеров. Время тестовой загрузки веб-страницы по-прежнему не превышает четырех секунд. Представьте, насколько скрыта оценка Google Pagespeed Insights.

Веб-сайт 6: Образ жизни старше 40 лет Blogger

Невероятный рейтинг с разочаровывающей оценкой Google Pagespeed Insights.

Этот блог о стиле жизни оценивается примерно по 52000 ключевых слов, и 3700 из них занимают первые пять позиций. Количество обратных ссылок превышает 1000.

Вот как плохо он оценивается. Время тестовой загрузки веб-страницы составляет 14 секунд. Оценки Pagespeed Insights составляют 16 для мобильных устройств и 45 для компьютеров.

Веб-сайт 7: Мама-блогер

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

Этот блог о стиле жизни ранжируется примерно по миллиону ключевых слов, и 28 400 из них занимают первые пять позиций. Количество обратных ссылок блоггера Мамочки превышает 16000.

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

Веб-сайт 8: Хостинговая компания (движок WP)

Это должно быть включено, чтобы подчеркнуть. Даже компании, которые продают свои услуги на основе Pagespeed, не получают хороших результатов в Google Pagespeed Insights. Документ завершается за 4,8 секунды.

Принимая во внимание, что 34 мобильных и 72 настольных компьютера — это показатель Insights.

Веб-сайт 9: Хостинговая компания ( GetFlyWheel )

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

Что ж, их оценка аналитики составляет 21 для мобильных устройств и 68 для настольных компьютеров. А время завершения документа составляет 6,2 секунды.

Теперь, надеюсь, вы нашли ответ на вопрос, заданный в начале. Google Pagespeed Insights в современном мире становится важнее, чем это должно быть на самом деле.

То же самое рекомендует WPRocket. Компания известна оптимизацией скорости.Они не хотят, чтобы вы переживали из-за оценки Pagespeed Insights.

Хостинг: самая большая проблема со скоростью

Именно по этой причине низкие оценки в Pagespeed Insights, а также в других инструментах. Например, GTMetrix и WebPageTest. Ваша оценка всегда будет плохой, независимо от того, сколько других вещей вы успешно исправите.

Если вы страдаете от проблем со скоростью, смена хоста будет первой и главной рекомендацией всех SEO-компаний. Тем более, что других причин нет.Вы пытаетесь, но не можете найти.

Для чего нужна Pagespeed Insights?

Есть много вещей.

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

Устранение ресурсов, блокирующих рендеринг. Такие файлы, как CSS и JS, в большинстве случаев блокируют быструю загрузку вашей страницы. В большинстве случаев достаточно перенести их в нижние колонтитулы. Избавьтесь от неиспользуемого CSS — это сложная и деликатная задача.Незначительное неправильное управление может сломать ваш сайт. Может быть любой CSS, который не вызывается или вызывается слишком рано при загрузке страницы. Например, CSS для нижнего колонтитула. Решение состоит в том, чтобы разделить ваш CSS на разные файлы и обслуживать их по-разному. Это также увеличит скорость страницы и оценку.

Уменьшить время ответа сервера. Это скорость, с которой ваш сервер отправляет ответ Google для доставки страницы. Ваш код, хост, плагины и многое другое может повредить его.

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

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

Скорость страницы, когда Google наказывает

Нет точной скорости, которая действует как триггер, и вы теряете свой ранг. Вот собственные слова Google из обновления скорости за июль 2018 года.

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

Подведение итогов

Наконец, мы знаем, что Google PageSpeed ​​Insights — слишком разрекламированный критерий. Мы видели почти дюжину веб-сайтов, которые преуспевают во всем. Несмотря на то, что им не удалось получить хорошие оценки в Google PageSpeed ​​Insights.

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

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

Не хмурьтесь, если у вас мало очков. Лучше поработайте над теми областями, на которых он говорит вам сосредоточиться. Также продолжайте работать над контентом и обратными ссылками. Знайте свои другие приоритеты.

Следовательно, Google PageSpeed ​​Insights не заслуживает того особого значения, которое веб-мастера придают ему в наши дни.Чтобы быть более точным, скорость — это еще не все для Всемирной паутины.

Расширение Google PageSpeed ​​Insights — Plesk

Сделайте свой сайт быстрее и удобнее для мобильных устройств с помощью расширения Google PageSpeed ​​Insights для Plesk

Ключом к достижению хорошей видимости в поисковых системах является создание веб-сайтов, которые будут быстрыми, полезными для ваших посетителей и оптимизированными для любого трафика, особенно мобильного трафика. Инструмент Google PageSpeed ​​Insights анализирует содержание вашего веб-сайта и его производительность, чтобы предложить конкретные улучшения.

Как работает расширение Google PageSpeed ​​Insights:

  • Анализирует производительность веб-сайтов, размещенных на вашем сервере Plesk.
  • Присваивает каждому проанализированному веб-сайту оценку для ПК и мобильных устройств, соответствующую его производительности.
  • Создает отчет на основе результатов анализа.
  • Отображает предложения по оптимизации производительности ваших веб-сайтов.
  • Предоставляет ссылки в пользовательском интерфейсе расширения на предлагаемые инструменты, направленные на повышение производительности веб-сайтов (например, модуль mod_pagespeed Apache).
  • Предоставляет уже сжатые файлы для уменьшения размера статических файлов (требуется бесплатный ключ API).
  • Устанавливает модуль Apache mod_pagespeed и позволяет настроить его для ваших нужд.

Обновление до Pro!

С Google PageSpeed ​​Insights Pro вы получаете дополнительные расширенные функции для профессионального использования PageSpeed ​​Insights в Plesk!

Дополнительные функции расширенного расширения:

  • Пользовательская конфигурация по домену для модуля PageSpeed ​​Apache (не только конфигурация для всего сервера).
  • Ежедневное обновление просканированных доменов для обеспечения актуальности всех результатов.
  • Массовая операция для запуска сканирования каждого домена одним щелчком мыши (домены ставятся в очередь и последовательно анализируются).
  • Подробная страница мобильных результатов со всеми предложениями и проблемами.

Нужна дополнительная информация?

Узнайте больше о Google PageSpeed ​​Insights и расширении Plesk.

Узнайте, как повысить производительность вашего веб-сайта с помощью Google PageSpeed ​​Insights.

PageSpeed ​​Insights, инструмент для повышения производительности

Что, если мы нажмем на газ! Сегодня пользователи покидают ваш сайт, если он не загружается через 3 секунды.С помощью PageSpeed ​​Insights вы можете определить, что замедляет работу вашего сайта, и перейти к следующему шагу.

Содержимое

Что такое PageSpeed ​​Insights?

PageSpeed ​​Insights API (PSI) — это бесплатное приложение, предлагаемое Google для измерения производительности страницы на мобильных устройствах, планшетах и ​​компьютерах. Собранные данные сопровождаются рекомендациями по улучшению страницы.
Эти улучшения могут помочь сократить время загрузки страниц, а также показатели отказов. Оба фактора имеют решающее значение для SEO вашего сайта.

Как интерпретировать данные, рассчитанные PageSpeed ​​Insights?

При анализе URL-адреса вы получаете подробный отчет в течение нескольких секунд, который учитывает два параметра:
— FCP: время, необходимое для отображения страницы для пользователя.
— FID: время, необходимое для полной загрузки страницы (DOM). Это соответствует времени, которое требуется браузеру для полной загрузки страницы. Он указывает время, прошедшее между моментом взаимодействия пользователя с элементом вашей страницы и моментом, когда браузер готов ответить на его запрос.
Page Speed ​​Insights извлекает URL-адрес дважды: первый раз с помощью своего пользовательского агента для настольных компьютеров (= своего робота для ранжирования настольных компьютеров) и второй раз с помощью своего мобильного пользовательского агента.

Отображаемые баллы варьируются от 0 до 100 баллов. Не волнуйтесь, если ваш сайт не везде на 100%, это нормально! Немногим сайтам удается это сделать, потому что критерии очень строгие. Но вы должны попытаться получить как можно более высокий балл.
Если вы видите много красного и желтого в своем отчете, это означает, что ваш сайт испытывает серьезные проблемы при загрузке страницы.

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

Избегайте перенаправления целевых страниц

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

Включить сжатие gzip

Такие браузеры, как Chrome и Firefox, могут предлагать уменьшенную версию страницы. Включив сжатие gzip, эти страницы можно уменьшить на 90%. Таким образом, вместо того, чтобы показывать пользователю всю страницу, браузер напрямую извлекает сжатую версию на маленьких экранах.

Свернуть CSS, HTML и JavaScript

Минификация кода означает удаление ненужных или повторяющихся данных без изменения их загрузки и отображения страницы в браузере.Плохой код часто является причиной этой проблемы, но не паникуйте, есть решения для минимизации вашего кода, не начиная с нуля:
— минимизатор HTML для минимизации HTML
— CSSNano и csso.
— UglifyJS2 и закрывающий компилятор для минимизации JavaScript
Другой вариант — использовать формат AMP, чтобы предлагать поисковым системам упрощенную версию ваших страниц, которая загружается за несколько миллисекунд и сохраняется в кеше Google.

Оптимизировать и уменьшить вес изображений

Изображения могут составлять большую часть общего веса страницы.Они повсюду: от вашего логотипа до слайдеров. Поэтому они должны быть максимально оптимизированы, чтобы уменьшить их влияние на время загрузки. Это наименее сложная техническая оптимизация. Просто конвертируйте их в JPEG и максимально сожмите (стараясь не изменить их качество). Существуют инструменты сжатия, такие как Compressor, ezGIF, TinyJPG…

Уменьшить использование JavaScript

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

Увеличить время отклика сервера

Сервер играет важную роль во времени загрузки страницы. Это может быть замедлено несколькими факторами, такими как количество вызванных запросов, медленная маршрутизация, нехватка памяти и т. д.Если Page Speed ​​Insights показывает, что ваш сервер работает медленно, вам следует обратиться к своему хостинг-решению. Иногда возникает соблазн поддаться привлекательности низких цен, выбрав общий пакет, но в зависимости от типа сайта предпочтительнее остановить свой выбор на выделенном сервере, который покажет лучшую производительность.

Обновление PageSpeed ​​Insights

Недавно Page Speed ​​Insights претерпела серьезное обновление своих функций. До сих пор Google полагался на несколько инструментов для оценки производительности сайтов, которые давали разные рекомендации, не всегда простые для понимания.Вот почему Google объединил данные из своих инструментов, чтобы веб-мастера везде получали одинаковые результаты. Отныне Page Speed ​​Insights использует Lighthouse — автоматизированный инструмент с открытым исходным кодом для улучшения качества веб-страниц. Он доступен из Chrome DevTools, командной строки или в виде модуля Node.
Таким образом, это изменение привело к большим изменениям в Page Speed ​​Insights, которая теперь различает лабораторные данные и «полевые» данные. Лабораторные данные предназначены для целей отладки, поскольку они получены из контролируемой среды.Полевые данные фиксируют фактическое взаимодействие с пользователем, особенно на мобильных устройствах. Lighthouse эмулирует сеть 3G, чтобы имитировать время загрузки в стандартной мобильной сети. Именно этот элемент является настоящей революцией!

Заключение

PageSpeed ​​Insights — отличный инструмент для измерения производительности страниц, и после его обновления он предлагает гораздо более надежные данные о времени загрузки на мобильных устройствах. Тем не менее, он остается недостаточным в качестве инструмента чистого анализа. Он не объединяет данные о совместимости с мобильными устройствами или возможные факторы блокировки (тег noindex, неверные канонические URL-адреса и т. д.).). Поэтому важно сопоставить его с несколькими другими анализами, чтобы получить точное представление о реальной производительности страницы.

   Статья написана Луи Шеваном

Скорость страницы | Дизайн веб-сайта

В начале ноября компания Google объявила о внесении некоторых изменений в инструмент создания отчетов о скорости загрузки сайта PageSpeed ​​Insights (PSI). PSI — это инструмент, используемый менеджерами веб-сайтов и разработчиками для оценки скорости их сайта, а также для предложений о том, как его можно улучшить.

Итак, что нового…

 

Новый URL

Одним из самых больших изменений является новый URL. Инструмент теперь доступен по адресу https://pagespeed.web.dev/.

Лабораторные и полевые данные 

Целью Google при новом запуске PSI является «улучшение представления данных отчета и добавление ясности и детализации данных, доступных в результатах». С новым макетом пользователи теперь могут различать лабораторных данных и полевых данных .

  • Лабораторные данные: данные, собранные в контролируемой среде с предопределенными устройствами и настройками сети.
  • Полевые данные: данные, собранные при реальных загрузках страниц теми, кто посещает ваш веб-сайт.

Core Web Vitals

В новом обновлении также четко указано, как рассчитывается оценка Core Web Vitals с помощью системы «годен/не годен». Несмотря на то, что процесс оценки не изменился, ваш веб-сайт пройдет или не пройдет, если он соответствует 75-му процентилю всех трех показателей (FID, LCP, CLS).

Новые данные

В отчетах также есть новые сведения о выборочных данных. Теперь вы можете увидеть:

  • Срок сбора данных
  • Посещение Длительность
  • Устройства
  • Сетевые соединения
  • Размер выборки
  • 2 Chrome Versions

5 Mobile и Desktop

6

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

До: 

После: 

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

 

Page Speed ​​Insights vs Lighthouse 

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

Основное различие между PageSpeed ​​Insights заключается в том, что если PSI измеряет только показатели производительности, то Lighthouse проверяет другие аспекты производительности веб-сайта, такие как SEO и доступность. Кроме того, PSI использовала комбинацию лабораторных и полевых данных, в то время как Lighthouse использует только лабораторные данные для построения своих отчетов.

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

 

В Dental Design наши технические специалисты по поисковой оптимизации и веб-разработчики являются экспертами в области скорости сайта и могут помочь вашему сайту полностью раскрыть свой потенциал.Свяжитесь с нашей командой для веб-оценки сегодня!

 

Поделиться на Facebook Поделиться в Твиттере

Другие сообщения от нашей команды


Назад ко всем новостям

Как использовать Google PageSpeed ​​Insights

Скорость загрузки веб-сайта является важным параметром взаимодействия с пользователем. Как владелец веб-сайта, вы будете постоянно следить за производительностью своего сайта и пытаться найти любые потенциальные проблемы, влияющие на него.Google PageSpeed ​​Insights — отличный инструмент, который поможет вам определить любые проблемы, которые могут снизить производительность вашего сайта. В этой статье мы обсудим, как вы можете использовать Google PageSpeed ​​Insights, чтобы обеспечить неизменно высокую производительность вашего сайта.

Google PageSpeed ​​Insights — обзор

Google PageSpeed ​​Insights — это инструмент, который предлагает подробные отчеты о производительности вашего сайта на мобильных и настольных устройствах. Он предлагает данные из контролируемых сред, а также из реальных сценариев.Это даст вам лучшее представление о фактических показателях эффективности вашего сайта. Чтобы легко получить представление после теста скорости, вы можете положиться на оценку производительности, которая будет отображаться на странице отчетов. Оценка производительности выше 90 является идеальной, в то время как оценка 50-90 требует улучшения, а оценка ниже 50 считается плохой оценкой.

С помощью Google PageSpeed ​​Insights вы можете понять, есть ли проблемы с производительностью вашего сайта.

Как использовать Google PageSpeed ​​Insights?

Получить информацию довольно просто.Перейдите на веб-сайт, введите URL-адрес, который вы хотите проанализировать, и нажмите кнопку «Анализ».

Вы можете начать работу с Google PageSpeed ​​Insights, введя URL-адрес, который хотите проанализировать.

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

Страница результатов Google PageSpeed ​​Insights предлагает ряд различных показателей, которые помогут вам определить производительность сайта одним взглядом.

Как интерпретировать данные поля Google PageSpeed ​​Insights

Google PageSpeed ​​Insights просматривает отчет об опыте использования Chrome, чтобы предоставить вам подробный отчет о данных поля. В отчете будут следующие метрики:

  • Первая отрисовка содержимого (FCP) — обозначает время, необходимое для первого рендеринга текста или изображения браузером
  • Первая задержка ввода (FID) — количественно определяет взаимодействие с пользователем при работе с неотвечающей страницей
  • Largest Contentful Paint (LCP) — обозначает время, необходимое для загрузки основного содержимого на странице.
  • Кумулятивное смещение макета (CLS) — указывает на неожиданное изменение макета пользователем.

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

Хорошо

Data
Data Оценка
FCP [0, 1800 мс]
FID [0, 100 мс]
LCP [0, 2500 мс]
CLS [0, 0.1]
Хороший показатель PSI

Требуется улучшение

данных Оценка +
FCP [1800ms, 3000ms]
ПЕД [100 мс, 300 мс]
LCP [2500ms, 4000ms]
CLS [0,1, 0,25]
Оценка PSI, требующая улучшения

Плохо

Данные Score
FCP над 3000ms
FID над 300мс
LCP над 4000ms
CLS больше 0.25
Оценка PSI считается плохой

Как интерпретировать данные Google PageSpeed ​​Insights Lab?

С помощью Lighthouse, автоматизированного инструмента, который помогает повысить качество веб-страниц, PageSpeed ​​Insights предлагает определенные показатели, отнесенные к категории лабораторных данных на странице результатов. Это:

  • Первая отрисовка по содержанию — время, необходимое для рендеринга первого текста или изображения
  • Самая большая отрисовка по содержанию — время, необходимое для отрисовки самого большого текста или изображения
  • Индекс скорости — указывает, насколько быстро содержимое веб-страницы заполняется.
  • Кумулятивное смещение макета — указывает на неожиданное изменение макета пользователем.
  • Время до интерактивности — время, необходимое для того, чтобы веб-страница стала полностью интерактивной.
  • Общее время блокировки — общий период времени между FCP и временем до взаимодействия

Оценка производительности веб-страницы рассчитывается на основе этих данных.

Аудит

Данные аудитов доступны в трех разных разделах — «Возможности», «Диагностика» и «Пройденные аудиты».

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

Эти рекомендации помогут улучшить скорость загрузки страницы.

Диагностика — это список дополнительных сведений, которые показывают, насколько веб-страница соответствует передовым методам веб-разработки.

Вы можете понять, как ваша страница соответствует лучшим практикам веб-разработки.

Пройденные аудиты — в этом разделе отображаются все различные аудиты, которые прошла веб-страница.

Вы можете просмотреть пройденные проверки.

Как улучшить Google PageSpeed ​​Insights Score

Теперь мы обсудим несколько стратегий, которые вы можете использовать для улучшения оценки Google PageSpeed ​​Insights. Это:

Оптимизация изображения

Одним из важных аспектов, способствующих получению более высоких результатов с помощью Google PageSpeed ​​Insights, является оптимизация изображений. Вы должны убедиться, что изображения, загруженные на ваши веб-сайты, имеют правильный размер.Использование «отзывчивых изображений», оптимизированных для устройства. «Отложенная загрузка» или загрузка только тех изображений, которые в данный момент видны на экране, в значительной степени способствует повышению производительности сайта.

Сжатие изображений — еще один важный фактор, который поможет улучшить оценку Google PageSpeed ​​Insights. Если вы ищете инструменты для сжатия изображений, вам может помочь наша статья о лучших плагинах сжатия изображений WordPress для ускорения работы вашего сайта. Кроме того, использование форматов файлов, таких как WebP, для изображений может помочь повысить производительность сайта.

Уменьшить время отклика сервера

Еще одна рекомендация экспертов по улучшению оценки Google PageSpeed ​​Insights — сокращение времени отклика сервера. Существует несколько стратегий, которые можно реализовать для сокращения времени отклика сервера. К ним относятся:

Минификация

Вы можете уменьшить размер файлов CSS, JavaScript и HTML, удалив несущественные символы, дубликаты и т. д. Также, если на сайте есть неиспользуемые файлы CSS, вы можете полностью удалить их.

АМП

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

Уменьшить количество перенаправлений

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

Мы надеемся, что эта статья дала вам хорошее представление о том, как использовать Google PageSpeed ​​Insights для выявления и устранения проблем с производительностью сайта. Не стесняйтесь оставлять нам комментарии, если у вас есть какие-либо вопросы или проблемы.

Дальнейшее чтение

Инструмент для тестирования скорости веб-сайта: PageSpeed ​​Insights

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

Ваш бесплатный тест скорости веб-сайта включает оценку страницы и возможности повышения производительности от Google PageSpeed ​​Insights. Мы включили информацию Google вместе с результатами тестирования Uptrends, чтобы предоставить вам всю информацию, необходимую для улучшения взаимодействия с пользователем вашей страницы. Uptrends предоставляет вам подробную информацию о странице поэлементно, чтобы помочь вам найти проблемные элементы страницы, и показать вам прогресс загрузки вашей страницы с помощью удобного для чтения каскадного отчета.

Что такое PageSpeed ​​Insights?

PageSpeed ​​Insights — это инструмент, предоставляемый Google веб-разработчикам (и всем пытливым умом), которым нужен обзор производительности их страницы с точки зрения Google. Google также предлагает возможности повышения производительности, которые помогут вам сосредоточить усилия на оптимизации скорости.

Почему мой показатель PageSpeed ​​Insights изменился?

Если вы использовали наш бесплатный инструмент для проверки скорости в прошлом, вы можете заметить, что ваш результат изменился.Uptrends получает оценку PageSpeed ​​Insight и последующие рекомендации от Google. Ваша оценка изменилась, потому что Google изменил способ расчета оценки в пятой версии API PageSpeed ​​Insights.

Ранее оценка PageSpeed ​​Insights основывалась главным образом на соглашениях, используемых для уменьшения размера страницы и ускорения процесса рендеринга. Новая версия учитывает эти вещи, но также корректирует оценку на основе других факторов, полученных от диагностических инструментов Lighthouse (лабораторные данные) и полевых данных (реальный опыт).

Как Google рассчитывает рейтинг моей страницы?

PageSpeed ​​Insights извлекает данные о скорости мобильных и настольных компьютеров из нескольких источников, что приводит к оценке страницы и рекомендациям по ее улучшению.

Лабораторные данные

Lighthouse собирает и анализирует данные о времени загрузки страниц и присваивает им оценку: ≥90 быстро, 50–89 в среднем, ≤ 50 медленно. Маяк основывает счет на:

Полевые данные

Пользователи браузера Google Chrome могут выбрать, чтобы браузер Chrome собирал данные о производительности страниц во время навигации в Интернете.Когда Google подсчитывает оценку сайта, он обращается к этим данным, чтобы увидеть, как реальные пользователи восприняли вашу страницу на основе:

.
  • Первая отрисовка содержимого: момент, когда браузер впервые отображает содержимое DOM.
  • Задержка первого ввода: время, прошедшее между взаимодействием пользователя с первой страницей и ответом страницы.

Google также сравнивает скорость вашей страницы со скоростью конкурирующих страниц и соответствующим образом корректирует оценку страницы.

Аудит страниц

Google проверяет существующую страницу и предоставляет вам список элементов, с которыми ваша страница справляется хорошо, а также те детали, которые требуют дополнительного внимания.На странице аудитов вы найдете информацию о:

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

Для более подробного обсуждения Google PageSpeed ​​Insights посетите Stack Overflow.

Почему вас должна волновать оценка PageSpeed ​​Insights?

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

Leave a Reply