На сколько важен показатель Google PageSpeed Insights и как правильно рассматривать его результаты
Здравствуйте, дорогие друзья !
К нам часто обращаются клиенты с вопросами о показателях сайтов в Google Pagespeed, поэтому мы решили в этой статье рассказать чуть больше про сам сервис, его предназначение, как относиться к результатам и что делать, чтобы улучшить показатели скорости работы сайта.
И для начала хотелось бы определить, что скорее всего эта статья не будет кладезем новых знаний для разработчиков или SEO-оптимизаторов, она не для тех людей, которые пытаются найти инструменты как оптимизировать свой сайт. Это статья будет полезна тем, кто владеет или управляет сайтом, кого не устраивает скорость и кто проверив свой сайт в Google Pagespeed не знает как правильно читать результаты и что делать дальше.
Один из самых частых вопросов, что мы слышим:
Если я установлю ImageCMS (или любой другой движок) или закажу у вас разработку сайта, вы можете обещать выход сайта в зеленую зону?
Если отвечать коротко — очевидно, что нет. Конечно, на момент запуска сайта, когда это делается на только что настроенном сервере, с чистой базой данных и минимальным количеством кастомных изменений функционала, разработчик может подтянуть сайт в зеленую зону. Но вы ведь не это имеете в виду, когда просите о зеленой зоне, не правда ли? Скорее всего вы хотите чтобы сайт держался в зеленой зоне, когда вы будете активно с ним работать и заниматься продвижением. А обещать такого вам не сможет никто, потому что всё зависит не только от того, какой у вас движок и сервер, но и во многом от действий людей, что работают с сайтом.
Что такое Google Pagespeed
Google Pagespeed — это один из инструментов с помощью которого вы можете проанализировать главные параметры вашего сайта, что влияют на скорость его загрузки. Но важно понимать что цифры, которые вам демонстрирует сервис, как результат проверки — это субъективная оценка одного сервиса, а не реальная скорость загрузки сайта у ваших посетителей. Для получения более объективных данных вы также можете воспользоваться другими инструментами проверки скорости как GTmetrix, Dotcom Monitor, Pingdom Tools и другие. Но, конечно, ни один такой сервис не покажет абсолютной цифры, потому что скорость загрузки страницы разная у всех пользователей и она зависит от многих факторов, таких как местоположение посетителя, а соответственно и разные отдаленность от сервера, разная скорость интернета, каждый пользователь выполняет разные действия на сайте, а соответственно и создает разную нагрузку, а также посетители попадают на сайт в разные периоды (в периоды пиковой нагрузки, выполнения каких-то сложных процессов на бэкенде сайта или DDoS-a скорость отклика сайта будет ниже).
Вот для примера результаты скорости загрузки одной и той же страницы в разных уголках мира:
Вы можете видеть, что результаты отличаются от 3-х до 12-ти секунд, что довольно-таки большой разброс. В большинстве случаев это не волнует владельцев сайтов, потому что их посетители чаще примерно с одного региона. Если вас всё же интересует продвижения сайта в отдаленных друг от друга регионах, тогда на помощь придёт CDN (например, Cloudflare, который интегрирован с нашей системой кэширования), но это история для другого полноценного поста.
Также не стоит думать что хороший показатель в Google pagespeed поднимает ваш сайт в поисковой выдаче. Безусловно скорость загрузки страницы очень важна, особенно если мы говорим про мобильную выдачу, представители компании Google за последний год не устают об этом напоминать, но мы ещё никогда не слышали заявление о том что результат этого теста является частью поисковых алгоритмов Гугла.
Как же работает этот сервис.
Вы вводите адрес своего сайта после чего сервис выставляет две оценки по 100 бальной шкале, первая оценка для мобильной версии, вторая — для полноценной десктопной версии. Если ваша страница набрала больше 80 баллов, значит скорость загрузки вашего сайта вполне приличная и вы выполнили большинство требований сервиса и за это вас награждают попаданием в зелёную зону, но не стоит расслабляться. На этом этапе мы рекомендовали всё равно открыть подсказки, которые вам показывает Google Pagespeed, возможно вы увидите ещё какой-то параметр, что можно легко улучшить.
Учтите, что обычно сайт состоит не из одной страницы, а разные страницы будут показывать разные результаты при прохождении теста. Например, если мы говорим об интернет-магазине, у вас есть несколько ключевых страниц — это главная страница сайта, каталог (категории товаров), страница самого товара, страница оформление заказа, а также специализированные страницы, как страница с акциями, страница с брендами и много информативных страниц, как страницы «о нас», «контакты» и другие, которые наполнены обычным текстом или графическими элементами. Чем больше функционала на странице тем больше запросов обрабатывается и тем позже ваш посетитель увидит желаемый контент.
Казалось бы очень простая мысль, но очень часто мы об этом забываем — страница категории, на которой есть много фильтров, товаров, карусели, пагинация и много других элементов которые помогают вашему пользователю взаимодействовать с сайтом, конечно же будет грузиться куда дольше чем страница на которой у вас несколько строк текста.
Перед тем как обращаться за услугами оптимизации к специалистам, рекомендуем проверить самостоятельно ваш сайт на очень очевидные вещи. Для примера:
- Посмотрите сколько товаров выводятся у вас на одной странице каталога, если у вас на одной странице выводится 100 товаров, задумайтесь действительно ли вам нужно такое количество, возможно ваши посетители никогда и не просматривает все 100 товаров до конца, чаще им удобнее использовать фильтр или обычную пагинацию. Ведь каждый товар на странице — это дополнительные миллисекунды в копилку ожидания ответа сервера.
- В интернет-магазинах часто есть специальные блоки, которые выглядит невинно, а на самом деле могут быть одной из серьезнейших причин задержки ответа сервера. Присмотритесь есть ли у вас на сайте виджеты, как «хиты продаж», «товары новинки», «акционные товары», «просмотренные товары» — это такие дополнительные блоки, которые помогают вам продвигать другие товары. Посмотрите какое максимальное количество таких товаров установленно в настройках этих блоков, в вашей CMS. Возможно, у вас в одном из таких блоков подгружаются ещё 100 товаров, хоть на странице магазина вы видите только 5, а остальные 95 скрыты в карусели, но они есть и на загрузку информации об этих товарах тоже уходит какая-то часть ресурсов.
- Пересмотрите актуальность всего функционала сайта. Знаете, бывает, что пользователи устанавливают скрипты (счетчики, какие-то праздничные элементы и тд), что красиво смотрится, но по-большому счету кроме этого не приносят никакой пользы. Я не предлагаю отказываться от необходимого функционала или важных маркетинговых инструментов, но обязательно пересмотрите, что для вас приоритетнее — скорость загрузки сайта или милый скрипт, который заставляет страницу выглядеть по-новогоднему.
На что чаще всего жалуется Google Pagespeed Insights:
- Reduce server response time — Сократите время ответа сервера
- Optimize images — Оптимизируйте изображения
- Leverage browser caching — Используйте кеш браузера
- Minify HTML, Minify JavaScript, Minify CSS — минифицируйте HTML, JS, CSS
- Enable compression — Включите сжатие
- Avoid landing page redirects — Избегайте переадресации целевой страницы
- Eliminate render-blocking JavaScript and CSS in above-the-fold content — Удалите код JavaScript и CSS, блокирующий отображение верхней части страницы
- Prioritize visible content — Оптимизируйте загрузку видимого контента
Обговорим детальней каждую из этих метрик:
Reduce server response time
Речь идёт о TTFB (Time to First Byte) — это показатель того сколько времени требуется для загрузки необходимого HTML-кода, чтобы начать рендеринг страницы с вашего сервера, вычитая задержку сети между Google и вашим сервером. Обычно это называют временем отдачи первого байта. Pagespeed отличным результатом считает 200мс. Это не значит, что 500мс можно расценивать как провал, потому что не один этот фактор влияет на скорость загрузки страницы, но задуматься о работе над этим показателем можно. Если этот показатель совсем печально выглядит, не нужно спешить менять хостинг, потому что существует очень много параметров, от которых зависит скорость отклика сервера. Виной плохих показателей так же может быть:
- Неправильно подобранный сервер, конечно одна из важнейших причин, во многом потому, что этому уделяется не много значения владельцами сайтов. А также многие из них поддаются маркетингу хостеров, которые часто предлагают «SSD хостинг, 4 ядра, неограниченное место на диске и всё это за 1$ в месяц» и после таких заявлений не готовы тратиться на качественный хостинг, заказывая первый попавшийся по хорошей цене. Выбор хостинга или сервера довольно не простой процесс, потому лучше консультируйтесь с разработчиком и хостером, экспериментируйте и не забывайте, что по мере роста и развития вашего сайта, сервер тоже должен улучшаться.
- Неправильно настроенный сервер или выбраны не оптимальные параметры хостинга ещё одна частая проблема. Железо, которое использует ваш сайт, конечно важно, но не менее важен и софт, который используется на вашем железе. Возможны сотни разных конфигураций ПО и нельзя сказать, что существует какая-то одна оптимальная для всех, каждый сайт требует своего подхода и потому не стесняйтесь спрашивать советов и экспериментировать с настройками сервера. Но например, если по какой-то причине на этом хостинге вы не можете поднять версию PHP до 7-ой, тогда уже есть смысл задуматься о смене провайдера.
- Не оптимизирована работа с базой данных. То, как работает ваш сайт с базой данных также является определяющим фактором в показателе TTFB. Если вы используете движок, который уже много лет развивается, тестируется и обновляется, работа с базой данных в нем будет оптимизирована на сколько это можно. Но это касается только стандартного функционала. Если вы заказали какие-либо индивидуальные разработки у программиста, он может выполнить их разными способами и не факт, что вам попался тот программист, который выбрал оптимальный для работы с базой данных путь. И после, казалось бы, небольшого изменения, на сайте добавили всего один блок с товарами, а количество запросов в базу данных выросло в несколько раз, а соответственно и больше времени требуется серверу, чтобы сформировать ответ.
Есть ещё много показателей, которые могут повлиять на показатель TTFB, мы не будем разбирать каждый из них, потому что лучше это дело доверить опытным разработчикам и администратору сервера. Главное, что вам нужно понимать, что улучшение показателя скорости ответа сервера — это комплексная работа и требует как детального анализа сервера, так и самого сайта.
Optimize images
На большинстве сайтов мы сталкиваемся с этой проблемой, потому что PS просит оптимизировать изображения всегда, когда считает что его качество может быть меньше, а считает он почти всегда. Люди, управляющие сайтом стремятся делать его красивым и часто используют для этого картинки с высоким разрешением, будь то баннера, фото товаров или просто картинка в блог. Не подумайте, мы не против использования картинок высокого качества и действительно существуют ситуации, когда это необходимо. Но часто после оптимизации изображений, вы не увидите никакой разницы, если выбрать разумную степень сжатия.
В первую очередь, за процессом оптимизации картинок должен следить человек, который занимается наполнением сайта и оптимизировать каждую картинку перед тем, как залить её на сайт. Но если вы никогда этим не занимались — не беда, вы можете обратиться к разработчикам, которые смогут выгрузить все картинки с сайта и оптимизировать их, или сделают это напрямую на сервере.
Если вы занялись оптимизацией скорости сайта, то в первую очередь рекомендуем заняться картинками. Во-первых, это самый простой процесс. Во-вторых, если вам предлагают уменьшить размер картинок на странице на несколько мегабайт, то поверьте, после того как это сделаете, вы почувствуете существенное изменение в скорости работы сайта.
Leverage browser caching
Если PageSpeed предлагает вам настроить кеширование для файлов и скриптов вашего сайта, тогда это повод обратиться к разработчику, который сможет правильно это сделать. Но если вы видите что-то похожее на картинку выше, тогда не стоит паниковать. Если у вас хороший движок с встроенной системой кэширования и\или правильно подобраны настройки Nginx\Apache на сервере, тогда PS будет жаловаться только на внешние скрипты, над которыми у вас нет власти. Например, это может быть скрипт Google Analytics или Tag Manager, Яндекс Метрики, Facebook, Twitter и многие другие скрипты, которые обычно используются маркетологами и аналитиками и помогают вам обмениваться информацией со сторонними сервисами. Технически есть способы сделать так, чтобы некоторые из этих скриптов размещались локально и вы получили возможность управлять настройками кэша для них. Но мы бы не рекомендовали идти против логики работы этих сервисов, ведь они не наносят особо вреда и по каким-то причинам их разработчики всё же установили такие параметры кеширования и если корректная работа этих сервисов для вас важна, лучше закройте глаза на это предупреждение.
Minify HTML, Minify JavaScript, Minify CSS
Минификация — это процесс уменьшения исходного кода (html, css, js), путем удаления не обязательных элементов кода (пробелы, табуляция, комментарии и тд). В большинстве современных движков и их темах дизайна весь возможный код уже минифицирован, но если по какой-то причине у вас оказались не минифицированные файлы, это повод обратиться к разработчикам, чтобы почистить код. Для разработчиков существует множество инструментов, с помощью которых это можно сделать. Но как показывает наша практика, чаще эти требования выполняются и даже если есть какие-то недочеты, то они очень маленькие и не принесут большого ускорения сайта. На картинке выше видно, что сократив html можно сэкономить 6.1кб, что не так уж много, если смотреть на то, что несколько мегабайт можно сэкономить на обычном сжатии картинок.
Enable compression
Здесь похожая ситуация, как и с использованием кеша. Если в отчете вы видите, что сжатия требуют файлы вашего сайта, тогда бегите к разработчику, который сможет правильно подключить gzip и существенно ускорить передачу данных. Но если вы видите картину, где вас просят сжать сторонние скрипты и вы боитесь навредить работе этих сервисов, лучше не пытаться с этим экспериментировать.
Avoid landing page redirects
Казалось бы совсем безобидный трюк — переадресация со страницы с\без www и http\https, но любой редирект добавляет ещё один шаг между при отправке запроса и получении ответа. Потому, когда вы видите подобное, лучше проконсультироваться со своим SEO-специалистом и разработчиком, чтобы понять, что у вас за редиректы используются, в каких целях и от каких из них можно отказаться, чтобы сократить количество запросов и улучшить скорость работы сайта.
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Не рекомендуем самостоятельно пытаться исправить эту проблему, потому что подобные манипуляции могут нарушить функциональность вашего сайта. Потому лучшее, что вы можете сделать — обратиться к разработчику, чтобы он проанализировал что можно с этим сделать и если нужно, провел оптимизацию. Но мы не часто сталкиваемся с подобными проблемами, а даже если они есть, то их нельзя назвать значительными и сильно влияющими на производительность сайта. Однако, бывают ситуации, когда при разработке были допущены серьезные ошибки и рендеринг страницы может существенно задерживаться из-за этого.
Prioritize visible content
Последний пункт в наших рекомендациях, но далеко не последний по важности. Очень тяжело дать общие рекомендации, что делать в случае, если вы видите такое предупреждение. Это может быть комплекс серьезных ошибок, которые требуют длительного анализа специалистами, так и небольшая оплошность разработчика, которую можно исправить за несколько минут. Потому, если вы видите подобную ошибку, обратитесь к своему разработчику и попросите проанализировать и исправить это. Ведь подобные ошибки не только влияют на показатель PageSpeed, но и на отношение поисковиков и пользователей к вашему сайту.
Заключение
Итак, какие выводы из этой статье Вы можете сделать.
Если вы занялись оптимизацией скорости вашего сайта, то в первую очередь делайте это не ради показателя 100\100 в Google PageSpeed Insights, а для того, чтобы посетителям было легко и удобно работать с вашим сайтом. Потому всегда ищите компромисс между функциональностью, красотой и скоростью работы и если у вас получится найти эту гармонию, вас будут любить как пользователи, так и поисковики 🙂
И если после прочтения этой статьи вы ушли мерить показатели своего сайта и они вас не устроили, не нужно сразу же пытаться исправить все проблемы. Для начала свяжитесь с опытными разработчиками, проконсультируйтесь, определите самые важные этапы для оптимизации и двигайтесь постепенно, при этом не забывая время от времени перепроверять свои показатели, ведь сайт как живой организм, он растет, развивается и порой болеет, а вам следует за ним внимательно следить.
- Переход существующих клиентов с ImageCMS 4.х на 5.0 «
- Скидки от ImageCMS в последнюю неделю сентября »