Как увеличить скорость загрузки и количество лояльных пользователей

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

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

Так ли важна скорость

Начнём с того, что по сей день значительная часть SEO-специалистов продолжают публиковать успешные кейсы, в которых фигурирует оптимизация скорости загрузки сайта. И просевшие позиции при сокращении времени даже на тысячные доли секунды приводят к тому, что Яндекс реагирует положительно. И это всё в рамках того, что скорость давно списали со счетов как многие гуру оптимизации, так и сами представители поисковых систем. В Google регулярно говорят лишь о технической исправности и качественном контенте, что ближе всего к заботе о пользователях. Как раз удобство и удовлетворённость во время визитов на онлайн-площадки должны ставиться во главу угла.

Но это заявления с некоторой долей лукавства. Связана она в первую очередь с Page Experience, тем самым набором требований, ориентированных на удобство для пользователей. В этот перечень входит время загрузки страниц. В июне 2021 года Google начал детально оценивать как скорость, так и этапы открывания просматриваемых документов. Google Core Vitals — это как набор показателей, который официально заявлен как фактор ранжирования. Вот такая несостыковка.

Google Core Vitals — фактор ранжирования, поэтому недооценивать показатели скорости, с которой идёт загрузка страницы, нельзя. Чем они выше, тем больше шансы ресурса нравиться пользователям и поисковым системам одновременно.

Оцениваются три базовых параметра.

1. Скорость появления контента.

Время, за которое браузер на 100 % отрисовывает и отображает крупный объект в активном экране.

1. Отзывчивость.

Время ответа браузера после первого взаимодействия пользователя со страницей.

2. Визуальная стабильность.

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

Единственный момент, по которому нет споров и разногласий, — это оценка скорости инструментами Google.

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

Самые распространенные способы оптимизации

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

Вот этапы, которые не замечают пользователи, но на них может тратиться критически большое количество времени:

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

Глобальные изменения: хостинг или сервер

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

Оптимизация загрузки визуального контента

Чтобы понять, насколько «тяжелы» размещённые на сайте изображения, желательно спарсить галерею и посмотреть, сколько весит каждое. Больше 300 Кб — слишком много, но и сильно меньше 100 — это неуважение к пользователю, которому придется увеличивать картинки и смотреть в итоге на набор цветных пикселей.

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

Например, TinyPNG (https://tinypng.com/) отлично справляется даже с облегчением анимации, при этом изменений в качестве совсем не ощущается. Можно уверенно облегчить изображения на 60 или даже 90%. Бесплатно можно изменить изображения размером до 5 Мб, а вот по подписке уже до 75.

Optimizilla (https://imagecompressor.com/) совместим с большинством современных форматов изображений. Причем можно совершенно бесплатно загружать до 20 изображений одновременно. Очень удобно, когда предстоит обработать много материала.

Imagify (https://imagify.io/optimizer/#image) – еще один инструмент, который доступен бесплатно, но подписка значительно расширяет функционал. Присутствует 3 степени сжатия, варианты изменения размера, процентное соотношение изменений и другие виды удобных быстрых настроек, которые стоит попробовать.

Конвертация форматов тоже способна помочь, например, WebP — более современный и лёгкий, причём с отличным качеством картинки без лишнего веса. Однако есть одно «но»: не все браузеры к нему лояльны. Понадобится регулярная аналитика.

Упорядочивание и чистка кода

Чистый код JS и CSS без лишних символов и слишком длинных комментариев тоже влияет на скорость. Придётся убрать избыточные элементы, названия функций. Вот здесь подсказки по сервисам будут актуальны. Например, Online Javascript Compression Tool или Online JavaScript/CSS Compression отлично подойдут для автоматизации этой работы.

Также не помешает верно расположить код на странице. Например, можно добиться ускорения, разместив CSS наверху, а JS внизу.

Если нужно подтянуть ещё

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

Шрифты

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

Отложенная загрузка изображений

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

Деактивация ненужного

Часто на старте работ в CMS не спешат удалять предустановленные плагины — вдруг пригодятся. Но чаще выбирают либо новые более совершенные платные варианты, либо пишут собственные, решающие индивидуальные задачи. А вот ненужное продолжает накапливаться, замедлять открывание страниц.

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

GZIP

Сжать большой объём данных — значит облегчить задачу серверу и позволить пользователю не подгружать огромный массив информации. Таким образом, вес открываемых страниц удаётся снизить на 50 % и даже больше. Это непременно заметят не только роботы и асессоры, но и люди, пришедшие на сайт из поиска.

Перенос видео на сторонние площадки

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

Платные решения

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

Adwex.Minified самостоятельно настроит ленивую загрузку изображений на Bitrix, ту самую, при которой пока фрагмента с картинкой нет — она не участвует в стартовой отрисовке контента.

Модуль результативен при оптимизации кода LS и CSS, сжимает файлы скриптов и работает с пробелами, убирает лишние и пустые строки.

Стоимость: около 3900 рублей (на момент написания статьи).

WP-Optimize — плагин для WordPress. Оптимизирует данные, а также позволяет сжать изображения, удалить лишние и уже неактуальные резервные копии. Также можно установить регулярные очистки в автоматическом режиме, когда всё неиспользуемое и неэффективное будет удаляться, что также поможет ускорять загрузку контента.

Стоимость: условно бесплатен, однако премиум-версия уже предполагает оплату.

PageSpeed Ninja — тоже разработка для WP, которая отлично справляется с увеличением скорости как на мобильной, так и на десктопной версии сайта.

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

Стоимость: в зависимости от набора функций — от условно бесплатной до 1500 рублей.

PageSpeed Module. Подойдёт для большинства популярных CMS, имеет версии, адаптированные для работы с разными движками. В SEO плагин любят за покладистость, неконфликность. Кроме того, он значительно улучшает показатели большинства характеристик:

Устанавливается плагин быстро и без проблем — справится и SEO-специалист, и владелец ресурса.

Стоимость: от 5199 рублей.

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

Вся соль

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

1. Правильный выбор сервера. Он не должен быть на другом континенте, и крайне желательно, чтобы уже имел отзывы о достаточно высокой скорости.
2. Для увеличения производительности визуальный контент стоит разместить на сторонних площадках. Изображения можно подгружать из облака, а видео — хранить на популярных видеохостингах.
3. Страницы смогут быстро загружаться, если контент не будет тяжёлым. Изображения, если они не в облаке, необходимо сжимать. Заливать фотографии весом в десятки Мб нерационально.
4. Оптимизировать скорость можно и путём чистки кода, сокращения в JS и CSS лишних пробелов и символов, пустых строк.
5. Увеличивает время стартовой подгрузки хранилище ненужных плагинов и расширений в CMS.
6. Сжатие всего, что поддаётся ему, также улучшает работу сайта и ускоряет открывание контента. GZIP — отличное решение для этого.
7. Установка дополнительных плагинов для оптимизации способна стать самым простым решением по повышению скорости загрузки сайта, но потребует вложений.

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