Оптимизация скорости сайта на Битрикс в 2022 году
Медленная загрузка сайта — одна из главных причин плохой вовлеченности пользователей. Зачем ждать загрузку, когда можно переключиться на соседнюю вкладку? В условиях глобальной динамичности интернет-пространства, удержать пользователя могут только “быстрые” сайты.
Более того, скорость загрузки влияет и на ранжирование в поисковых системах, особенно в Google. “Медленные” ресурсы обычно не могут дотянуться до топ-10, не говоря о том, чтобы выйти в топ-3.
Как измерить скорость сайта
Чтобы объективно проанализировать скорость сайта, лучше опираться на несколько источников данных.
PageSpeed Insights
Один из самых распространенных сервисов, который подходит для сайтов любого типа — PageSpeed Insights. С его помощью можно определить фактическую производительность сайта, а также выявить проблемы, связанные с производительностью.
Отчеты доступны отдельно для мобильной и десктопной версии. Для каждого параметра есть визуальная демонстрация: если ползунок находится в зеленой зоне, показатель отличный, в желтой — необходимы доработки, в красной — показатель критический.
Параметры, на которые нужно обратить внимание
LCP (Largest Contentful Paint) — Скорость загрузки основного контента
Показатель, который измеряет время отображения самого большого элемента в области просмотра страницы.
При высоких показателях может замедляться индексация сайта в целом: чем дольше робот ждет загрузки конкретной страницы, тем меньшее количество за сеанс он обойдет. Также высокие показатели негативно влияют на поведенческие факторы.
FID (First Input Delay) — Время до первого взаимодействия с контентом
Если предыдущий параметр, LCP, отвечает за отображение информации, то FID — за взаимодействие с сайтом. Условно он показывает время от момента, когда пользователь, например, нажал на кнопку до момента “реакции” сайта на это действие.
CLS (Cumulative Layout Shift) — Совокупное смещение макета
Дословный перевод CLS бывает непонятен. На самом деле, здесь имеется в виду стабильность верстки: “не едут” ли кнопки или другие элементы при нажатии на них, корректно ли отображается контент (нет “прыгающего текста”). На CLS могут влиять: изображения, в которых не указан размер, нестандартные шрифты, динамический контент.
Вышеперечисленные параметры — одни из основных. Но помимо них, PageSpeed Insights анализирует первую отрисовку контента, время до первого байта и прочее.
Встроенный инструмент для сайтов на Битриксе
Функционал учитывает общее качество сайта, хостинга, доступности ресурса. Результат рассчитывается на основании последних 1000 посещений сайта. Главное отличие встроенного инструмента Битрикса от внешних сервисов в том, что скорость загрузки изменяется не из внешних точек, а на хитах реальных пользователей.
Данные мониторинга скорости сайта доступны на рабочем столе в административной части сайта:
В подробном отчете можно ознакомиться с более детальной информацией.
Помимо описанных выше способов, для оценки скорости загрузки сайта можно использовать другие онлайн сервисы, а также отчеты Яндекс.Метрики и Google Analytics.
Окей, проблема обнаружена — что дальше?
Когда стало ясно, что сайт грузится медленно, нужно выполнить детальный анализ. С его помощью будет ясна причина низкой скорости загрузки. Если этого не сделать, а просто пытаться выполнить рекомендации, например PageSpeed Insights, есть вероятность, что работы займут много времени и не принесут желаемого результата. PageSpeed Insights, как и встроенная оценка от Битрикса — это отправная точка, которая помогает разработать поступенчатый план оптимизации скорости сайта.
Проведением подобного анализа, как правило, занимается технический отдел
Как ускорить сайт на Битриксе
Разберем несколько стандартных работ по ускорению загрузки сайта.
Оптимизация картинок
Изображения инфоблоков и других сущностей баз данных можно сжать при генерации шаблонов компонентов. Решение подойдет, например, для оптимизации фото в карточках товаров.
Статичный контент, например, “тяжелые” фото для статей нужно оптимизировать и заменять вручную.
Сокращение JavaScript и CSS
В настройках главного модуля Битрикса есть галочки «Объединять JS файлы» и «Объединять CSS файлы». Они помогут склеить скрипты в один файл и соответственно — стили. Уменьшение объемов файлов позволит сократить общее время загрузки сайта.
Оптимизация загрузки видимого контента
Идея в том, чтобы изменить структуру html кода так, что сначала загружался значимый контент, который находится в верхней части страницы. Для сайтов на Битриксе это может оказаться нетривиальной задачей, так как нужно менять порядок загрузки элементов страницы, а Битрикс не всегда позволяет это сделать. Решение для каждого проекта необходимо искать индивидуально.
Использование правил эффективного кеша для статических объектов
HTTP-кеширование ускорит загрузку сайта при повторных визитах пользователей. То есть для неизменяемых статических ресурсов (шрифтов, изображений, медиафайлов) браузер будет отображать свою локальную копию.
Сокращение времени ответа сервера
Это один из самых трудоемких и долгих пунктов, но чаще всего именно он дает наиболее видимый результат. Трудозатраты, как правило, зависят от масштаба проекта, качества кода, наличия кастомных решений.
Технология “Композитный сайт”
Ускорить загрузку в несколько раз позволит технология, разработанная специально для сайтов на “1С-Битрикс”. Статическая составляющая страниц сайта кешируется и отображается пользователю мгновенно, динамическая подгружается в фоновом режиме. Пользователю не нужно ждать полной загрузки страницы — всю самую важную информацию он видит сразу же.
Однако технология “Композитный сайт” хорошо работает только на проектах, которые соответствуют строгим техническим стандартам. То есть перед ее внедрением сайту может потребоваться несколько доработок. В отдельных случаях это может оказаться экономически нецелесообразным.
Модуль ускорения сайта CDN
Технология подойдет для любой активной коммерческой лицензии “1С Битрикс ”. Система интегрирована с сетью CDN на уровне платформы. На официальном сайте 1С Битрикс утверждается, что дополнительные настройки для ее внедрения не потребуются. Более того, модуль является бесплатным. Однако на данном этапе он функционирует в тестовом режиме, и со стороны компании “1С Битрикс” в любой момент могут быть изменены условия его использования.
Резюме
Быстрая скорость загрузки — важный фактор ранжирования сайта и стабильных показателей конверсии. Зачастую, именно оптимизация загрузки позволяют достичь высоких результатов на этом поле. Если экспресс-проверка загрузки сайта в инструменте PageSpeed Insights показала неутешительные результаты, обращайтесь к специалистам WEBTENSE: мы проведем детальный аудит, найдем причину низкой скорости загрузки и составим план по оптимизации.
Как ускорить загрузку сайта
Фото и видео важны для каждого сайта и приложения. Но если они много весят, это влияет на скорость загрузки страницы. Часто из-за большого размера изображений и видео страницы сайта загружаются медленно, и пользователю приходится ждать, пока все изображения не отобразится на странице. Чтобы избежать такой проблемы, настройте параметры ускорения сайта.
Откройте Сайты и магазины. Выберите сайт, который вы хотите оптимизировать, и перейдите в настройки.
В пункте Ускорение сайта поставьте галочки напротив параметров, которые помогут вашему сайту работать быстрее.
Оптимизируйте время загрузки страницы
Скорость загрузки — ключевой аспект оптимизации сайта. При обычной загрузке страницы браузер сначала загружает весь функционал и потом начинает отрисовывать картинку. В этот момент пользователь видит белый экран.
Если включить функцию оптимизации, порядок загрузки скриптов меняется: они загружаются постепенно, а не все сразу. Пользователь сразу видит текст, а потом и другие элементы, которые к нему подгружаются. Ему не приходится ждать, пока загрузится все оформление сайта.
Используйте отложенную загрузку изображений
Если на странице большое количество изображений, то имеет смысл загружать их непосредственно перед использованием. Часто посетитель не дожидается загрузки всех элементов и покидает сайт. При отложенной загрузке изображения загружаются не сразу при открытии страницы, а только когда появляется необходимость. Сначала загружаются те изображения, которые находятся на экране пользователя, остальные подгружаются позже.
Откладывание загрузки изображений помогает улучшить производительность сайта и экономно использовать ресурсы устройства. Эта функция особенно актуальна для пользователей с медленным интернетом и тех, кто пользуется мобильными приложениями.
Как проверить изменение скорости
Сначала проверьте скорость загрузки страниц на своем интернете: активируйте параметры ускорения и переопубликуйте сайт, чтобы изменения в настройках вступили в силу.
Проанализируйте скорость c помощью специальных площадок: PageSpeed Insights, Pingdom Tools, Uptrends, WebPageTest.
Показатели скорости без настроек ускорения
Показатели с ускорением
Если вы анализируете скорость только на PageSpeed Insights, имейте в виду, что их алгоритмы могут занижать оценки. Для большей достоверности проверьте скорость на нескольких площадках.
Как увеличить скорость работы сайта на 1с-битрикс за несколько кликов
Сегодня поговорим о том, как ускорить сайт на 1С-Битрикс. И в данном уроке основными инструментами для ускорения сайт у нас послужит технология “композитный сайт”, мы посмотрим как ее включить.
Приветствую друзья! Сегодня поговорим о том, как ускорить сайт на 1С битрикс. И в данном уроке основными инструментами для ускорения сайт у нас послужит технология “композитный сайт”, то есть мы посмотрим как ее включить.
И второе, это оптимизация скриптов, но сразу хочу вас предупредить, что никаким программированием мы заниматься не будем, мы только в нужных местах поставим нужные галочки и нужные циферки.
Итак, что нам нужно сделать, зайти в административную панель сайта, и перейти в основной раздел настроек. Далее мы с вами выбираем пункт меню «настройки продукта». Ищем здесь «настройки модулей», и переходим в подпункт «главный модуль».
Здесь, с правой части экрана мы отматываем вниз, и у нас есть здесь такая область с заголовком “CSS”. И здесь у нас есть возможность проставить 5 галочек, мы с вами смело ставим эти все 5 галочек, ничего в результате не сломается.
Бывает, что если сайт у вас на каком-нибудь самодельном дизайне, может в каких-то местах поехать верстка, но в таких случаях вы отключаете пару галочек. В основном это происходит из-за минификации версии CSS и JS файлов, перемещение кода, скрипт в конец страницы. В нашем случае шаблон хороший, Аспро Максимум, мы уже неоднократно проверяли, здесь все работает нормально.
Итак, как мы с вами галочки поставили и нажали кнопочку применить. Можем с вами обновить сайт, посмотреть, все у нас прекрасно работает, нигде ничего не поплыло, сайт стал чуть-чуть шустрее.
Следующий момент, это включение композитного режима сайта. Для этого мы с вами здесь же, где сейчас мы с вами были в пункте настройки модуля, спускаемся чуть-чуть ниже, и у нас есть подпункт называется «композитный сайт».
Переходим сюда, и нажимаем кнопочку настройки. Далее отматываем правую часть страницы вниз, и нажимаем большую кнопку включить автокомпозит. И у нас появилось уведомление «авто композитный режим включён».
Далее проверяем оставшиеся настройки.
Переходим здесь в вкладку настройки, и смотрим, список доменных имён, каждое с новой строки. Здесь, в нашем случае, сейчас доменное имя указано, но бывает такое, что доменное имя не указано. Вот здесь вы должны написать доменное имя своего сайта. Можно допустим добавить ещё версию своего с www например. Это не обязательно, но лишним не будет.
И теперь отматываем в самый низ, здесь у нас самый важный пункт, это механизм хранения кэша. У нас установлено в файлах, и мы увеличиваем дисковую квоту, поставим 2048 мегабайт, то есть 2 гигабайта. И нажимаем кнопочку сохранить настройки.
Все, у нас с вами теперь веб-сайт кэшируется. Подробнее о том, что такое кэш, как его чистить, зачем он нужен, я расскажу в отдельной статье, в данной статье все, основные настройки мы с вами провели, сайт у нас стал работать ещё быстрее, чем раньше, мы с вами можем даже проверить это с помощью сервисов Гугл. Для того, чтобы провести оценку производительности сайта, мы с вами открываем Гугл, пишем в поисковой строке pagespeed и вот у нас прям первая выдача открывается ссылка.
Нажимаем и здесь указываем имя нашего домена. Просто копируем в буфер, вставляем сюда, и нажимаем кнопочку анализировать. Итак, для мобильных устройств у нас показывается 87 очков, из 100 возможных, а для компьютера к нас показывает 100 из 100 возможных. Но я вам рекомендую сделать предварительную оценку. То есть сначала зайти на этот сервис, посмотреть, сколько у вас баллов на мобильном устройстве и на компьютере, потом провести все те настройки, о которых мы выше с вами говорили, и сделать повторный замер.
На этом у меня все, благодарю вас за внимание! В следующих статьях мы с вами разберём как оптимизировать картинки на сайте, как уменьшить их вес. Потому что картинки нередко являются камнем преткновения скорости работы и загрузки сайта.
В случае если у вас проблемы с настройкой композитного сайта или оптимизаций CSS и JS скриптов, то возможно ваш шаблон устарел. В таком случае обратите внимание на готовые сайты из нашего каталога, все они оптимизированны и без проблем поддерживают данные настройки.
Ускорение загрузки страниц сайта на 1С-Битрикс
1С-Битрикс часто встречается среди пациентов нашей услуги ускорение сайта. Это одна из наиболее популярных CMS в России и самая популярная коммерческая CMS в стране.
Интересно, что разработчики Битрикса заявляют о потенциально высокой скорости сайтов, созданных на этой системе. Более того, внутри системы предусмотрен ряд инструментов для ускорения и мониторинга скорости. Однако, несмотря на заявленное внимание к скорости работы, результат в виде реального сайта на этой системе очень часто разочаровывает владельца сайта и его посетителей.
Основная идея разработчиков Битрикс это тотальное кеширование и использование CDN. В ролике мы рассматриваем, как это работает на практике и почему эти методы далеко не всегда помогают ускориться.
Что надо делать, когда сайт на 1С-Битриксе тормозит, смотрите в видео.
Экспертное ускорение сайтов
Ускорение сайтов
Цена от 69 900 Р