Скорость загрузки сайта
Скорость загрузки сайта – один из ключевых факторов, помогающий увеличить количество конверсий и привлечь трафик. Weblium постоянно усовершенствует скорость визуализации вебсайтов, чтобы обеспечить вам наилучший пользовательский опыт. Однако существуют некоторые внешние факторы, которые могут повлиять на время, необходимое для загрузки вашего сайта.
кэш браузера;
подключение к Интернету (например, сайт может загружаться медленнее в 3G, чем с Wi-Fi);
устройство, на котором вы просматриваете сайт (например, старые телефоны загружают сайт медленнее, чем новые);
собственные коды - виджеты, аналитика, CSS (прилагаются как через настройки сайта, так и с помощью блока встроенного кода в редакторе);
видео и тяжелые изображения (преимущественно размещенные на домашней странице и вверху страницы, ведь тогда они загружаются во время открытия сайта);
устаревшие блоки;
тяжелые шрифты;
браузерные расширения.
Вы можете оценить эффективность сайта с помощью различных сервисов проверок скорости страницы. Самыми популярными инструментами являются Google PageSpeed Insights, YSlow и GTmetrix.
Если полученный результат неудовлетворителен, просмотрите шаги ниже.
Очистите кэш-браузер.
Одним из распространенных факторов, которые могут повлиять на скорость вашего сайта, является кэш браузера и файлы cookie. Очистка кэша и файлов cookie удаляет все накопившиеся данные, которые могут замедлять работу вашего сайта или вызывать неисправности.
Подсказка: для более точной проверки реальной скорости загрузки сайта рекомендуем это делать в режиме Incognito.
Проверьте подключение к Интернету.
Попробуйте открыть сайт с помощью различных интернет-сетей – например, из дома, работы, Wi-Fi, мобильного Интернета и т.д. Помните, что некоторые провайдеры могут иметь ограничение на скорость интернета, что влияет на скорость загрузки сайта.
Примечание: вышеуказанные два пункта касаются фактической скорости загрузки сайта. На результаты Google PageSpeed Insights и подобных инструментов практически не влияют.
Оптимизируйте шапку сайта и блок под ней.
Для теста PageSpeed Insights (и других подобных инструментов), а именно для показателей мобильной версии сайта очень важно, чтобы видимый контент, отображаемый при открытии сайта (шапка и первый блок под ней), загружались как можно быстрее — первые блоки загружаются в первую очередь. Поэтому эти блоки желательно сделать "легкими", то есть с наименьшим содержанием контента (особенно без изображений значительного размера с большим весом). Если второй блок (после шапки и первого блока) тоже частично просматривается после открытия сайта — скажем, если первый блок невысокий — тогда этот второй блок также желательно оптимизировать, чтобы в нем не было много изображений, особенно тяжелых. Или активировать переключатель растяжения первого блока на всю высоту экрана.
В случае, если скорость загрузки десктопной (компьютерной) версии сайта вас устраивает, а скорость мобильной нет, то чтобы не редактировать блок для десктопа, вы можете создать два идентичных блока: один для десктопной версии, а другой для мобильной версии, сделать блок для мобильной версии с меньшим количеством изображений или с изображением с меньшим весом, а затем каждый из блоков скрыть от отображения там, где он не нужен.
Усовершенствуйте собственный код и код посторонних сервисов.
Имейте в виду, что собственный HTML, CSS, JS код может снизить оценку производительности вашего сайта, поэтому попробуйте ограничить его использование. Вы можете повысить скорость страницы, оптимизировав свой код (путем использования более лаконичных и технически оптимальных функций CSS-правил, удаления пробелов и других ненужных символов и т.п.).
Важно: поскольку вышеприведённые сервисы по проверке скорости сайтов не имеют доступа ко всему коду конструктора, они могут ошибочно определять тот или иной код нашего редактора как ненужный (хотя на самом деле он важен) и, соответственно, ошибочно отражать это в результатах как ошибку, что также окажет негативное влияние на итоговый балл.
Оптимизируйте мультимедийные файлы.
Weblium автоматически оптимизирует изображения, которые вы добавляете на сайт. Тем не менее, учитывайте количество изображений, которые вы добавляете на страницу, поскольку для загрузки каждого из них требуется время.
Примечание: мы автоматически оптимизируем растровые изображения (jpeg, png), однако векторные (svg) — нет. Они загружаются в медиагалерею в оригинальном размере.
Если вы хотите улучшить скорость загрузки сайта, функция оптимизации для фонового изображения должна быть включена:
Видео с Youtube/Vimeo могут существенно влиять на скорость сайта. Мы не отрицаем использование видеофайлов, но советуем учитывать их количество.
Подсказка: если вы заметили медленную загрузку видео, добавленное через YouTube, можно попробовать загрузить его через Vimeo и наоборот.
Для улучшения фактической скорости загрузки сайта можно отключить опцию автовоспроизведения видео, которое добавлено как элемент:
Обновите блоки.
Для повышения производительности блоков мы выпускаем новые версии, которые мгновенно становятся доступными на вашем сайте. По большей части оптимизация блоков происходит автоматически, но изредка, чтобы воспользоваться этими обновлениями, необходимо нажать кнопку Обновить в правом верхнем углу блока:
Ограничьте использование тяжёлых шрифтов.
Мы рекомендуем уменьшить количество шрифтов на сайте до двух, чтобы поддерживать дизайн согласованным, а страницы легче. Шрифты сайта загружаются во время его открытия, и их большое количество может замедлить загрузку сайта.
Помните, что пользовательские шрифты, которые вы загрузили в редактор, могут ощутимо замедлить скорость загрузки вашего сайта. Мы не отказываем вас их использовать, но рекомендуем учитывать их количество на сайте.
Для уменьшения фактической скорости загрузки сайта, а также для улучшения результатов проверки вышеуказанных сервисов, вы можете отключить опцию предзагрузки шрифтов в их настройках. Для этого вам нужно открыть Стили сайта, затем во вкладке Шрифты нажать кнопку Настройки и перевести переключатель Пререндер в выключенное положение:
Как она работает:
Если эта опция отключена, то показатель будет лучше, но в случае медленной работы интернет-соединения может быть визуально заметна замена стандартных шрифтов браузера на то, что у вас выбрано.
Если она включена, то браузер будет ждать их загрузки и не отобразит шрифты, пока они не будут полностью загружены.
Эта особенность позволяет выбрать между визуальным качеством для устройств с медленным интернетом и лучшими показателями PageSpeed Insights или подобных сервисов.
Прежде чем начать, имейте в виду, что на скорость сайта могут влиять:
кэш браузера;
подключение к Интернету (например, сайт может загружаться медленнее в 3G, чем с Wi-Fi);
устройство, на котором вы просматриваете сайт (например, старые телефоны загружают сайт медленнее, чем новые);
собственные коды - виджеты, аналитика, CSS (прилагаются как через настройки сайта, так и с помощью блока встроенного кода в редакторе);
видео и тяжелые изображения (преимущественно размещенные на домашней странице и вверху страницы, ведь тогда они загружаются во время открытия сайта);
устаревшие блоки;
тяжелые шрифты;
браузерные расширения.
Вы можете оценить эффективность сайта с помощью различных сервисов проверок скорости страницы. Самыми популярными инструментами являются Google PageSpeed Insights, YSlow и GTmetrix.
Если полученный результат неудовлетворителен, просмотрите шаги ниже.
Устранение проблем со скоростью загрузки сайта
Очистите кэш-браузер.
Одним из распространенных факторов, которые могут повлиять на скорость вашего сайта, является кэш браузера и файлы cookie. Очистка кэша и файлов cookie удаляет все накопившиеся данные, которые могут замедлять работу вашего сайта или вызывать неисправности.
Подсказка: для более точной проверки реальной скорости загрузки сайта рекомендуем это делать в режиме Incognito.
Проверьте подключение к Интернету.
Попробуйте открыть сайт с помощью различных интернет-сетей – например, из дома, работы, Wi-Fi, мобильного Интернета и т.д. Помните, что некоторые провайдеры могут иметь ограничение на скорость интернета, что влияет на скорость загрузки сайта.
Примечание: вышеуказанные два пункта касаются фактической скорости загрузки сайта. На результаты Google PageSpeed Insights и подобных инструментов практически не влияют.
Оптимизируйте шапку сайта и блок под ней.
Для теста PageSpeed Insights (и других подобных инструментов), а именно для показателей мобильной версии сайта очень важно, чтобы видимый контент, отображаемый при открытии сайта (шапка и первый блок под ней), загружались как можно быстрее — первые блоки загружаются в первую очередь. Поэтому эти блоки желательно сделать "легкими", то есть с наименьшим содержанием контента (особенно без изображений значительного размера с большим весом). Если второй блок (после шапки и первого блока) тоже частично просматривается после открытия сайта — скажем, если первый блок невысокий — тогда этот второй блок также желательно оптимизировать, чтобы в нем не было много изображений, особенно тяжелых. Или активировать переключатель растяжения первого блока на всю высоту экрана.
В случае, если скорость загрузки десктопной (компьютерной) версии сайта вас устраивает, а скорость мобильной нет, то чтобы не редактировать блок для десктопа, вы можете создать два идентичных блока: один для десктопной версии, а другой для мобильной версии, сделать блок для мобильной версии с меньшим количеством изображений или с изображением с меньшим весом, а затем каждый из блоков скрыть от отображения там, где он не нужен.
Усовершенствуйте собственный код и код посторонних сервисов.
Имейте в виду, что собственный HTML, CSS, JS код может снизить оценку производительности вашего сайта, поэтому попробуйте ограничить его использование. Вы можете повысить скорость страницы, оптимизировав свой код (путем использования более лаконичных и технически оптимальных функций CSS-правил, удаления пробелов и других ненужных символов и т.п.).
Важно: поскольку вышеприведённые сервисы по проверке скорости сайтов не имеют доступа ко всему коду конструктора, они могут ошибочно определять тот или иной код нашего редактора как ненужный (хотя на самом деле он важен) и, соответственно, ошибочно отражать это в результатах как ошибку, что также окажет негативное влияние на итоговый балл.
Оптимизируйте мультимедийные файлы.
Weblium автоматически оптимизирует изображения, которые вы добавляете на сайт. Тем не менее, учитывайте количество изображений, которые вы добавляете на страницу, поскольку для загрузки каждого из них требуется время.
Примечание: мы автоматически оптимизируем растровые изображения (jpeg, png), однако векторные (svg) — нет. Они загружаются в медиагалерею в оригинальном размере.
Если вы хотите улучшить скорость загрузки сайта, функция оптимизации для фонового изображения должна быть включена:
Видео с Youtube/Vimeo могут существенно влиять на скорость сайта. Мы не отрицаем использование видеофайлов, но советуем учитывать их количество.
Подсказка: если вы заметили медленную загрузку видео, добавленное через YouTube, можно попробовать загрузить его через Vimeo и наоборот.
Для улучшения фактической скорости загрузки сайта можно отключить опцию автовоспроизведения видео, которое добавлено как элемент:
Обновите блоки.
Для повышения производительности блоков мы выпускаем новые версии, которые мгновенно становятся доступными на вашем сайте. По большей части оптимизация блоков происходит автоматически, но изредка, чтобы воспользоваться этими обновлениями, необходимо нажать кнопку Обновить в правом верхнем углу блока:
Ограничьте использование тяжёлых шрифтов.
Мы рекомендуем уменьшить количество шрифтов на сайте до двух, чтобы поддерживать дизайн согласованным, а страницы легче. Шрифты сайта загружаются во время его открытия, и их большое количество может замедлить загрузку сайта.
Помните, что пользовательские шрифты, которые вы загрузили в редактор, могут ощутимо замедлить скорость загрузки вашего сайта. Мы не отказываем вас их использовать, но рекомендуем учитывать их количество на сайте.
Для уменьшения фактической скорости загрузки сайта, а также для улучшения результатов проверки вышеуказанных сервисов, вы можете отключить опцию предзагрузки шрифтов в их настройках. Для этого вам нужно открыть Стили сайта, затем во вкладке Шрифты нажать кнопку Настройки и перевести переключатель Пререндер в выключенное положение:
Как она работает:
Если эта опция отключена, то показатель будет лучше, но в случае медленной работы интернет-соединения может быть визуально заметна замена стандартных шрифтов браузера на то, что у вас выбрано.
Если она включена, то браузер будет ждать их загрузки и не отобразит шрифты, пока они не будут полностью загружены.
Эта особенность позволяет выбрать между визуальным качеством для устройств с медленным интернетом и лучшими показателями PageSpeed Insights или подобных сервисов.
Обновлено на: 26/04/2024
Спасибо!