Медленные сайты убивают продажи — как это исправить

Давайте это исправлять

Прежде, чем мы начнём, держите в голове такой факт: важно проходить тесты и получать положительные оценку скорости загрузки (до 7-8 секунд). Это улучшает позиции сайта в Гугле и Яндексе, так как это один из ключевых факторов ранжирования. А ещё это увеличивает конверсию: чем быстрее сайт, тем проще на нём делать заказы.

Яндекс и Гугл в требованиях для веб-мастеров рекомендуют (= требуют), чтобы страницы сайта загружались быстрее, чем за 8 секунд, а ещё лучше — за 5. Особенно это критично для мобильной версии сайта, доля мобильного трафика превышает уже 70%.

Результат проверки сайта сервисом testmysite.withgoogle.com — четверть потерянных потенциальных клиентов

Пруфы по теме: https://www.seonews.ru/events/google-skorost-zagruzki-sayta-stala-faktorom-ranzhirovaniya-v-mobile/ http://pr-cy.ru/news/p/5888 https://page-speed.ru/articles/pagespeed-insights/ Как быстро сайт открывается через мобильную сеть: https://testmysite.withgoogle.com/intl/ru-ru ( проверка как бы через 3G) Стандартный тест Гугла: https://developers.google.com/speed/pagespeed/insights/

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

Как не нужно проверять скорость. Тут есть ещё одна проблема. Часто клиент при проверке скорости загрузки открывает свой сайт у себя в кабинете. А чаще всего там высокоскоростной интернет, поэтому клиент не заметит разницы вообще между тяжёлым и лёгким сайтом. И мобильник клиента тоже подключен через этот же вайфай, поэтому на телефоне тоже будет всё быстро. Поэтому все сайты нужно проверять в реальных условиях — а реальность такова, что большинство смотрит всё через смартфон на ходу, используя мобильную сеть. Поэтому проверяйте хотя бы мобильные версии своих сайтов без вайфая, просто через мобильный интернет.

Как можно быстро проверить свои проекты: сервисом webpagetest.org. Если время загрузки превышает 10 секунд, то надо его оптимизировать хотя бы до 8, а ещё лучше — до 5 секунд.

Разберем на собственном примере как можно производить оптимизацию

Вот наш сайт:

Загоняем главную в сервис webpagetest.org и смотрим:
  

По результатам теста видно, какие элементы страницы самые объемные. Оказалось, что у нас одна картинка на главном слайдере просто конского размера: почти четверть мегабайта. А таких картинок в слайдере — 4. В итоге мы заставили пользователя скачать мегабайт на одном только слайдере, ещё не успев показать вообще ничего полезного, только рекламу себя. Вот этот файл в исходнике:

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

И с легкостью оптимизируем его под объем 77 килобайт, в 4 раза меньше. Визуально разницы нет вообще:

После загрузки оптимизированной картинки тестируем снова и получаем скорость 8.2 секунды. Уже лучше, но недостаточно хорошо:

Мы поняли, что сами не уделяли внимание скорости загрузки своего сайта, и это плохо. Сейчас мы догнали скорость загрузки до 7,68 секунды и продолжаем оптимизировать её дальше.

Есть и более упрощенный тест: https://developers.google.com/speed/pagespeed/insights/. Он тоже указывает на конкретные способы оптимизации скорости загрузки сайта, но делает это не настолько подробно.

Вот наши показатели до оптимизации:

... и после:

Не очень круто, но это только после оптимизации размера картинок. А есть ещё оптимизация кода, кеширования, предзагрузки, ресурсов — в общем, нам есть куда стремиться.

Вот еще один пример

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

Смотрим детальный отчет и видим такие вот данные по слайдам:

Смотрим, какие файлы использует страница при загрузке:

Вот файлик слайдера, который весит… барабанная дробь… 1,7 мегабайт!

И таких слайдеров там минимум три. Каждый из них без проблем уменьшается в 6 раз

Что в итоге

Для всех: скорость загрузки ключевой фактор успешной работы проекта:

• по продвижению;

• по обслуживанию;

• и по заявкам.

Для нас: менеджеры проектов и оптимизаторы теперь проверяют скорость своих проектов и лично отвечают за условие загрузки как минимум в желтой зоне (до 10 секунд):

Что дальше

Мы хотим загрузку своего сайта сделать супербыстрой и поделиться с вами способами и результатом. Параллельно мы делаем это для всех клиентских сайтов, которые у нас в работе. А ещё мы принимаем заявки на бесплатный аудит сайтов: расскажем, как сделать его быстрее и подскажем, как можно его улучшить. Для этого позвоните в офис или напишите нам на [email protected].