Как оптимизировать скорость загрузки сайта

Медленная загрузка — главная причина, по которой клиенты не оформляют заказ, не оставляют заявку и уходят с сайта. Исследования 2024 года показали, что более половины пользователей (53%) покидают ресурс, если он открывается на смартфоне дольше 3 секунд. 

Давайте обсудим, как время загрузки влияет на успех онлайн-проекта и удобство работы с ним. Также мы разберём, как оценить текущие показатели скорости и повысить её, если она не соответствует общепринятым стандартам.

На что влияет скорость загрузки сайта

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

Если время загрузки увеличивается с 1 до 3 секунд, то вероятность отказа повышается на 32%. Когда этот показатель достигает 5 секунд, то риск отказа возрастает уже на 90%. Однако быстродействие страницы влияет не только на число отказов, но и на ряд других важных параметров.

Индексация сайта

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

Ранжирование сайта

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

Пользовательский опыт

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

  • отказы — если пользователь находится на странице менее 15 секунд;
  • длительность сеанса — сколько времени он проводит на сайте;
  • конверсия — когда он выполняет целевое действие, например, добавляет товар в корзину, совершает покупку, заполняет форму, нажимает на кнопку «Позвонить» и так далее.

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

Какая скорость загрузки считается нормальной

Чем оперативнее загружается ваш сайт, тем лучше. Оптимальным считается время, когда страница открывается менее чем за 3 секунды. Это значение основано на исследованиях, которые подтверждают, что пользователи закрывают сайт, если он загружается слишком долго. Давайте сравним показатели:

  • 1 секунда и менее — отлично;  
  • 2–3 секунды — хорошо (вероятность отказа выше на 32%);
  • 4–7 секунд — удовлетворительно (вероятность отказа выше на 90–106%);
  • 8–11 секунд — плохо (вероятность отказа выше на 132% и более).
Скорость загрузки
Эти показатели примерно одинаковы как для мобильных устройств, так и для стационарных компьютеров

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

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

Как проверить скорость загрузки сайта?

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

PageSpeed Insights — бесплатный продукт от Google, который анализирует время загрузки для смартфонов и ПК. По итогам проверки он формирует отчёт по основным показателям, а также список рекомендаций по улучшению показателей.

Проверка скорости в сервисе Гугл
Оптимальным считается результат от 90 баллов

PR-CY — бесплатный инструмент, схожий по функциональности с другими подобными продуктами. Он проверяет оперативность загрузки для мобильных и десктопных устройств, а также выявляет ошибки и предлагает, как их исправить.

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

Pingdom Tools — один раз доступна бесплатная проверка скорости загрузки сайта. Купить платную подписку с территории РФ или Беларуси не получится.

Сервис Pingdom
Этот сервис позволяет выбрать регион для проверки

Loading Express — проверка скорости сайта предоставляется бесплатно. За дополнительную плату можно заказать аудит юзабилити и получить подробные рекомендации по ускорению ресурса.

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

Сервис Loading Express
Отличным показателем считается оценка 9–10 баллов

Sitespeed — бесплатный российский сервис для проверки быстродействия сайта. Полный отчёт и рекомендации по ускорению можно заказать на email.

Сервис Site Speed

Если к вашему проекту подключена система веб-аналитики Яндекс.Метрика, то вам доступна проверка скорости загрузки сайта от Яндекса.

Что значат результаты тестов

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

Время ответа сервера (Time To First Byte, TTFB). Это показатель того, как быстро сервер реагирует на запрос, отправленный браузером. 

Первая отрисовка страницы (First Contentful Paint, FCP). Время до появления на дисплее первого контента, например, очертаний блоков или контуров изображений.

Время загрузки контента (Largest Contentful Paint, LCP). Промежуток, за который отображается самый большой элемент на странице, например, иллюстрация или блок с текстом. 

Время задержки блокировки (Total Blocking Time, TBT). Период, когда пользователь не может выполнять какие-либо действия с интерфейсом, например, выделить текст, нажать на кнопку или перейти по ссылке. 

Совокупное смещение макета (Cumulative Layout Shift, CLS). Это показатель смещения элементов на странице в процессе загрузки ресурса. Визуально это выглядит как изменение положения блоков или их габаритов после открытия сайта. Проще говоря, некоторые компоненты съезжают относительно своих привычных мест. 

Время до интерактивности (Time to Interactive, TTI). Период, в течение которого страница становится полностью доступной для взаимодействия пользователя.

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

Факторы, влияющие на скорость загрузки сайта

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

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

Скорость ответа сервера

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

Тип хостинга

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

Количество запросов браузера

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

Проверьте, сколько запросов делает браузер, в сервисах Pingdom Tools и Loading Express. Нужный нам показатель называется Requests или «Число HTTP-запросов».

Запросы к серверу
Чем ниже значение, тем лучше

Вес ресурса

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

  • Откройте «Инструменты разработчика» нажатием клавиши F12 или через меню браузера.  
  • Перейдите в раздел Networks.
  • Нажмите галочку disable cache, чтобы очистить кэш.
  • Обратите внимание на показатели в левом нижнем углу.
Как проверить вес страницы
Таким образом можно проверить только страницу, которая открыта в браузере

Внешние скрипты и плагины

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

Также на быстродействие ресурса влияют версия PHP, кэширование браузера, тип системы управления сайтом (CMS) и другие факторы.

Как улучшить скорость загрузки

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

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

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

Прежде всего, воспользуйесь специализированными инструментами для уменьшения размера файлов, например, Compress PNG. Не забывайте о размере изображений: их ширина и высота должны соответствовать тому, как они будут отображаться на странице.

Сжатие файла для сайта
Чем меньше вес изображения, тем лучше, но при этом качество не должно страдать

В любых интернет-проектах рекомендуется использовать следующие форматы:

  • JPEG — для фотографий;  
  • PNG — для графики с прозрачным фоном;
  • SVG — для простых изображений, таких как иконки;
  • GIF — для коротких роликов.

Перенос встроенных видео

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

Если у вас короткое видео, то сохраните его в формате GIF. Однако имейте в виду, что тяжелые гифки будут загружаться медленнее.

Включение кэширования

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

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

Сокращение кода

Для ускорения загрузки, рекомендуется уменьшить объём кода CSS, JavaScript и HTML, удалив из него все ненужные элементы, такие как пробелы, пустые строки и т. д. Также стоит избавиться от следов старого кода, оставшегося после неиспользуемых плагинов и модулей.

Если вы решили проверить скорость загрузки сайта в сервисе от Google, то Page Speed Insight помогает оптимизировать код. Он предоставляет список файлов, в которых стоит сократить код, не снижая при этом функциональность проекта и отдельных его составляющих.

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

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


Автор статьи

Екатерина Малиновская
Екатерина Малиновская
Журналист Вебфлай

Теги

seo

Понравился материал?

Подписывайтесь и получайте еще больше полезных публикаций.

Хотите консультацию?

Просто напишите нам! Перезвоним в будний день с 9:00 до 19:00
Связаться с нами
Оставьте заявку,
чтобы обсудить проект
Комплекс
CRM
Веб
Сопровождение
Продвижение
Ваше имя *
Компания
Телефон *
E-mail
Коротко о проекте
Нажимая кнопку «Отправить» вы соглашаетесь c правилами обработки ваших персональных данных.
Золотой партнер 1С-Битрикс c 2007 года. ТОП - 100 по РФ
Аккредитованная
IT-компания
Разработка включена в едином реестре российского ПО «МинЦифры» №18127 от 29.06.2023
Digital-интегратор «Вебфлай»
© 2011--2025

Мы используем файлы cookie, чтобы улучшить сайт для вас

Ok