7 приёмов для увеличения скорости загрузки сайта

Скорость загрузки сайта влияет на посещаемость, показатель отказов и другие важные для бизнеса KPI. При прочих равных условиях пользователь обычно выбирает те веб-ресурсы, которые не заставляют его ждать. Многие исследователи экспериментировали со скоростью загрузки и пришли к единому мнению, что оптимальные показатели — от 1,5 до 3 секунд. Если веб-страница грузится дольше, то более половины пользователей уходит на другие сайты.

Медленный сайт тормозит бизнес

Низкая скорость загрузки веб-страниц приводит к серьёзным проблемам:

• уменьшению конверсии — даже при задержке загрузки сайта на 0,1 секунду показатель падает на 7,1% (к такому выводу пришли аналитики компании Akamai);
• потере клиентов — пользователи возвращаются в поисковик и заходят на другие аналогичные сайты;
• уменьшению вероятности повторного посещения сайта — в мобильных версиях она сокращается более чем вдвое;
• снижению позиций в выдаче — поисковики могут просто не успеть полностью проиндексировать слишком медленные сайты.

Все эти факторы влияют на развитие бизнеса. Даже идеальная маркетинговая стратегия может оказаться малоэффективной именно из-за низкой скорости загрузки сайта.

Приёмы для ускорения загрузки

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

1. Сжатие изображений с помощью онлайн-сервисов

Картинки — одни из самых «‎тяжёлых»‎ элементов на сайте. Если есть возможность, лучше не использовать их слишком много на веб-странице. И все изображения стоит сжимать, но важно, чтобы при этом качество не терялось. Для уменьшения размера уже добавленных на сайт картинок, можно использовать сервис Crush.pics или Image Optimizer. А для новых изображений есть хорошие оптимизаторы tinyjpg и tinypng.

2. Удаление ненужных плагинов

Все загруженные на сайт плагины добавляют JavaScript и CSS файлы, неважно, используются они или нет. Это тоже одна из причин падения скорости загрузки. Мы рекомендуем тщательно проверить весь список и удалить лишние плагины.

Владельцы сайтов на WordPress должны сначала деактивировать плагины и только потом удалять их в админке. Не стоит стирать их и с FTP-сервера, если они не были предварительно отключены. Ещё один важный момент — удалённые таким способом плагины оставляют следы. Это могут быть файлы на FTP-сервере или записи в БД языка SQL. Пользователю нужно подключиться к серверу через FTP-клиента, перейти в папку wp / content, найти папку этого ненужного плагина и удалить её.

3. Использование AMP для мобильных версий

Доля мобильного трафика постоянно растёт, и версии для смартфонов нужно делать максимально удобными. Инструмент AMP — Accelerated Mobile Pages — специально разработан для телефонов. С его помощью даже при низкой скорости сети веб-страницы загружаются быстро.

AMP-страницы сохраняют только основной контент сайта. Для их создания используются специальные теги и асинхронные скрипты. Google кэширует информацию, и пользователь после отправки запроса сразу видит загруженную страницу.

4. Уменьшение количества HTTP-запросов

Даже когда пользователь просматривает простую веб-страницу, браузер отправляет до 10 запросов на сервер. И чем их больше, тем медленнее грузится сайт. Для проведения анализа удобно использовать сервис HTTP Requests Checker, который показывает количество HTTP-запросов от веб-страницы.

Чтобы сократить количество запросов, нужно:

• преобразовать изображения в текст по стандарту кодирования Base64;
• объединить элементы — файлы CSS, библиотеки JavaScript;
• включить кэширование, чтобы быстро получать доступ к данным;
• не увлекаться дизайном и не добавлять анимации и прочие «‎тяжёлые»‎ элементы;
• распределять компоненты между серверами, используя параллельные загрузки.

5. Сокращение количества редиректов

Редирект — это перенаправление пользователя с одного URL на другой. При этом создаётся дополнительная цепочка HTTP-запросов, которые, как мы уже выяснили, замедляют сайт. Лучше не использовать редиректы без особой необходимости. А если они нужны, следует учитывать назначение каждого из них. Постоянный редирект (301) используется при удалении старого контента, когда пользователя нужно перенаправить на новый. Временный редирект (302) актуален для краткосрочных акций и других непродолжительных изменений.

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

6. Устранение битых ссылок

Битые ссылки — это ссылки на несуществующие веб-страницы сайта. Они появляются, если допустить ошибку в написании URL или поменять структуру сайта и при этом не настроить перенаправление со старых ссылок. Есть и другие причины. Битые ссылки тоже увеличивают количество HTTP-запросов, а ещё они раздражают пользователей. Чтобы выявить их, можно использовать бесплатные инструменты Broken Link Checker и Xenu.

7. Добавление кодов отслеживания

Google Tag Manager — это бесплатный сервис, который позволяет хранить все теги в одном месте. Он помогает пользователю менять код, добавлять новые фрагменты, интегрировать веб-ресурс с рекламными сервисами. Нужно один раз установить на сайт код Google Tag Manager, и потом без помощи разработчиков можно выполнять все необходимые настройки в интерфейсе сервиса.

Запомнить

Медленный сайт тормозит бизнес: уменьшается конверсия, посещаемость, сайт теряет позиции в выдаче.

1 приём — сжатие изображений через Crush.pics, Image Optimizer, tinyjpg или tinypng.

2 приём — удаление ненужных плагинов и их следов.

3 приём — уменьшение количества HTTP-запросов с помощью сервиса HTTP Requests Checker.

4 приём — сокращение количества редиректов (301, 302) и удаление цепочек редиректов.

5 приём — устранение битых ссылок с помощью инструментов Broken Link Checker и Xenu.

6 приём — использование AMP для мобильных версий с применением специальных тегов и асинхронных скриптов.

7 приём — добавление кодов отслеживания через Google Tag Manager и отсутствие необходимости обращаться к разработчикам.