Медлительность и настойчивость помогли черепахе выиграть гонку, но когда дело доходит до сайта, то даже секундная задержка может стоить потери трафика и доверия пользователей. Веб-сайт, который быстро загружается кажется свежим, здоровым и надежным, в то время как медленный оставляет негативные впечатления.
Это значит, что каждый веб-ресурс должен быть оптимизирован для достижения максимальной скорости загрузки, независимо от того, с какого устройства или браузера на него заходят. Чтобы понять, как увеличить скорость загрузки сайта, прочитайте нашу статью.
Сколько секунд должен загружаться сайт?
В отчете Google говорится, что более половины пользователей мобильных сайтов покидают страницу, загрузка которой занимает более 3 секунд. Так что в идеале скорость вашего сайта должна соответствовать этим рамкам. Даже 5-секундная задержка, которая считается допустимой в этот день, увеличивает показатель отказов до 90%.
Платформа бизнес-аналитики Databox провела опрос ожиданий пользователей в связи с оптимизацией скорости веб-сайта, и они пришли к следующим выводам:
Зачем оптимизировать сайт?
- Это делает пользователей счастливее. Как упоминалось выше, медленные сайты имеют очень высокий показатель отказов. Чем лучше работает сайт, тем больше контента пользователи получат и проведут на нем времени;
- Это делает поисковые системы счастливее. Два года назад Google включил скорость мобильных страниц в список параметров рейтинга SERP (даже для поиска на компьютере). Медленные сайты занимают низкие позиции.
Оба пункта приводят к общему выводу: чем быстрее загружается страница, тем выше ее конверсия. Новость заключается и в том, что сайты с долгой загрузкой будут попадать под фильтры Chrome. В Google говорят, что это сделали для улучшения пользовательского опыта.
Как измерить время загрузки сайта
Существуют инструменты, такие как Pingdom, GTmetrix или Google PageSpeed Insights. Они достаточно просты в использовании, с цветовой шкалой, которая указывает, является ли показатель скорости ваших страниц быстрым, средним или медленным. Они также предоставят информацию о том, как можно сократить время загрузки сайта.
Как ускорить скорость загрузки сайта?
Дадим проверенные советы, которые помогут оптимизировать скорость загрузки сайта.
1. Управление изображениями и видео
По данным HTTP Archive, большую часть веса составляют такие графические элементы, как большие неоптимизированные изображения, гифки и видео. Так что в первую очередь стоит обратить внимание на эти моменты. Тем не менее, нет необходимости отказываться от ваших фотографий, даже если ваш сайт перегружен изображениями.
Во-первых, рассмотрите возможность сохранения изображений в виде файлов jpg, а не png. Это может уменьшить размер файла более чем на 50%. Вы также можете подумать о сжатии изображений. Самое сложное — свести к минимуму эти элементы и сохранить их качество. Для файла jpg стремитесь к степени сжатия 60–70%.
Затем вы можете попробовать некоторые доступные плагины для оптимизации изображений, такие как EWWW, Smush, ShortPixel.
Если ваш веб-сайт в значительной степени зависит от изображений, убедитесь, что они оптимизированы:
- Уникальность фото;
- Уменьшение его размера (сжатие);
- Удаление метаданных (ненужных);
- Правильное масштабирование фото на сайте;
- Использование оптимальных форматов картинок;
- Разумная цветность.
Узнать, насколько изображения подходят под перечисленные выше параметры можно с помощью специальных инструментов, например Google Page Speed Insights.
2. Используйте сервисы CDN
Если люди со всего мира посещают ваш сайт, рассмотрите возможность использования CDN (сети доставки контента). Дело в том, что размещение сайта на одном сервере означает, что все запросы пользователей отправляются на один и тот же сервер, что часто приводит к очередям. Чем дальше пользователь находится от сервера, тем хуже дольше загрузка. CDN - это набор веб-серверов, разбросанных по разным географическим точкам. Он хранит копию сайта в центрах обработки данных и перенаправляет запросы пользователей на ближайший сервер, что приводит к более быстрой доставке контента.
Есть много компаний, которые предлагают услуги CDN. G-CoreLabs и Cloudflare являются одними из наиболее часто используемых.
3. Используйте быструю технологию React
Если вы думаете о внедрении более быстрого решения в целом и если ваш сайт использует библиотеку JavaScript, то подумайте о выборе более быстрой технологии React. Например, сейчас это Gatsby JS. Он написан на React и является частью этой библиотеки. Собственно, Gatsby — это фреймворк React, с помощью которого веб-разработчики могут быстро создавать приложения React. Он генерирует предварительные статические веб-страницы и выдает их пользователям, минимизируя задержку.
Когда пользователь переходит на страницу через файл HTML, браузер доставляет содержимое. Без какой-либо соответствующей технологии следующий запрос загрузит другой HTML-файл при нажатии. Пользователь может дождаться или увидеть пустую страницу. Гэтсби решает эту проблему. Он создает HTML-файлы для каждой страницы сайта без предварительного рендеринга контента. Вся загрузка страницы и переход измеряются в миллисекундах, а не в секундах. Использование этой структуры приводит к:
- SEO-улучшения производительности;
- Сокращению отказов;
- Устойчивость к большим нагрузкам.
4. Будьте разборчивы в своих объявлениях
Исследование, проведенное бывшим инженером Google Патриком Халсом предполагает, что реклама отвечает за снижение скорости страниц. Он проанализировал миллион популярных веб-сайтов и обнаружил, что скрипты, используемые рекламными платформами, такими как WordAds и AdSense, вызывают около 60% общего времени загрузки страницы. Худшие результаты показал скрипт WordAds для блогов WordPress. Он может замедлить работу страницы на 2,5 секунды.
5. Сократите HTML, CSS и JavaScript
Очевидно, что файл меньшего размера будет загружаться быстрее. Это значит, что разработчикам следует сосредоточиться на минимизации кода, удаляя ненужные строки, пробелы, запятые и другие ненужные символы. Для того, чтобы выполнить эту операцию, достаточно использовать инструмент jscompress.
6. Включите кеширование браузера
Использование функции кэширования помогает браузеру хранить данные о последних просмотренных страницах. Сюда входят изображения, таблицы стилей, javascript и многое другое. Оптимизируйте скорость загрузки данных с помощью кэширования последней страницы. Браузеру не придется снова перезагружать всю страницу, чтобы пользователь вернулся на сайт.
7. Сократите редиректы (перенаправление домена)
Переадресация обязательна при значительных изменениях контента (миграция на другой адрес, удаление страниц). Однако слишком большое количество может привести к созданию дополнительных HTTP-запросов. Это может негативно сказаться на скорости загрузки страниц, особенно на мобильных устройствах.
Подведем итоги
Люди хотят как можно быстрее получить то, за чем они пришли: оплатить счета, прочитать обзор или статью в блоге, заказать товар или получить необходимую информацию. В случае с сайтом электронной коммерции оптимизация скорости сайта играет еще большую роль. Большинство потенциальных покупателей признают, что время загрузки интернет-магазина напрямую влияет на их решение совершить покупку.
Когда Amazon провела A/B-тестирование, чтобы наблюдать за изменениями в поведении пользователей, вызванными задержкой загрузки всего в 100 миллисекунд, они обнаружили значительное снижение доходов, поэтому обязательно регулярно пробуйте различные методы ускорения работы вашего инструмента. Теперь вы знаете, как увеличить скорость загрузки сайта и можете использовать советы из статьи для оптимизации вашего ресурса.