Когда мы решаем что-то купить, чаще всего процесс происходит так: забиваем товар в поиск и открываем одновременно все вкладки подряд в фоне, чтобы было из чего выбирать. Потом щёлкаем по вкладкам с предложениями и сразу закрываем те, которые ещё не загрузились. Ну а что, хуже всё равно не будет, предложений-то вон сколько — целый экран. Нам время дорого, поэтому мы не ждём всех загрузок, а выбираем из того, что быстрее открылось.
Если ваш сайт не успел загрузиться к этому моменту — всё, вы проиграли. Клиенту некогда ждать, пока появится страница, ему нужно решить проблему здесь и сейчас. Даже если у вас лучшая цена или уникальные условия доставки — всё это неважно, если сайт открывается медленно. Быстрый интернет приучил нас к моментальному доступу к чему угодно, а те, кто не даёт такой быстрый доступ воспринимаются как неудачники.
Давайте это исправлять
Прежде, чем мы начнём, держите в голове такой факт: важно проходить тесты и получать положительные оценку скорости загрузки (до 7-8 секунд). Это улучшает позиции сайта в Гугле и Яндексе, так как это один из ключевых факторов ранжирования. А ещё это увеличивает конверсию: чем быстрее сайт, тем проще на нём делать заказы.
Яндекс и Гугл в требованиях для веб-мастеров рекомендуют (= требуют), чтобы страницы сайта загружались быстрее, чем за 8 секунд, а ещё лучше — за 5. Особенно это критично для мобильной версии сайта, доля мобильного трафика превышает уже 70%.
|
Пруфы по теме: https://www.seonews.ru/events/google-skorost-zagruzki-sayta-stala-faktorom-ranzhirovaniya-v-mobile/ https://page-speed.ru/articles/pagespeed-insights/
Как быстро сайт открывается через мобильную сеть: https://testmysite.withgoogle.com/intl/ru-ru ( проверка как бы через 3G) Стандартный тест Гугла: |
Как не нужно проверять скорость. Тут есть ещё одна проблема. Часто клиент при проверке скорости загрузки открывает свой сайт у себя в кабинете. А чаще всего там высокоскоростной интернет, поэтому клиент не заметит разницы вообще между тяжёлым и лёгким сайтом. И мобильник клиента тоже подключен через этот же вайфай, поэтому на телефоне тоже будет всё быстро. Поэтому все сайты нужно проверять в реальных условиях — а реальность такова, что большинство смотрит всё через смартфон на ходу, используя мобильную сеть. Поэтому проверяйте хотя бы мобильные версии своих сайтов без вайфая, просто через мобильный интернет.
Как можно быстро проверить свои проекты: сервисом webpagetest.org. Если время загрузки превышает 10 секунд, то надо его оптимизировать хотя бы до 8, а ещё лучше — до 5 секунд.
Разберем на собственном примере как можно производить оптимизацию
Вот наш сайт:
Загоняем главную в сервис webpagetest.org и смотрим:
По результатам теста видно, какие элементы страницы самые объемные. Оказалось, что у нас одна картинка на главном слайдере просто конского размера: почти четверть мегабайта. А таких картинок в слайдере — 4. В итоге мы заставили пользователя скачать мегабайт на одном только слайдере, ещё не успев показать вообще ничего полезного, только рекламу себя. Вот этот файл в исходнике:
Начинаем исправлять: загружаем фотошоп и выбираем сохранение файла с оптимизацией под веб:
И с легкостью оптимизируем его под объем 77 килобайт, в 4 раза меньше. Визуально разницы нет вообще:
После загрузки оптимизированной картинки тестируем снова и получаем скорость 8.2 секунды. Уже лучше, но недостаточно хорошо:
Мы поняли, что сами не уделяли внимание скорости загрузки своего сайта, и это плохо. Сейчас мы догнали скорость загрузки до 7,68 секунды и продолжаем оптимизировать её дальше.
Вот наши показатели до оптимизации:
... и после:
Не очень круто, но это только после оптимизации размера картинок. А есть ещё оптимизация кода, кеширования, предзагрузки, ресурсов — в общем, нам есть куда стремиться.
Вот еще один пример
Загоняем в тот же тест сайт одного из наших клиентов. До оптимизации результат печальный:
Смотрим детальный отчет и видим такие вот данные по слайдам:
Смотрим, какие файлы использует страница при загрузке:
Вот файлик слайдера, который весит… барабанная дробь… 1,7 мегабайт!
Что в итоге
Для всех: скорость загрузки ключевой фактор успешной работы проекта:
-
по продвижению;
-
по обслуживанию;
-
и по заявкам.
Для нас: менеджеры проектов и оптимизаторы теперь проверяют скорость своих проектов и лично отвечают за условие загрузки как минимум в желтой зоне (до 10 секунд):
- аккаунт проверяет на входе;
-
оптимизатор проверяет при составлении технического задания;
-
менеджер-проектов по обслуживанию проверяет наполнение сайта;
-
менеджер разработки следит, чтобы при разработке проекта с нуля контент сразу оптимизировался под веб;
- аккаунт на этапе обучения дает клиенту рекомендации и фиксирует все в инструкциях.
Что дальше
Мы хотим загрузку своего сайта сделать супербыстрой и поделиться с вами способами и результатом. Параллельно мы делаем это для всех клиентских сайтов, которые у нас в работе. А ещё мы принимаем заявки на бесплатный аудит сайтов: расскажем, как сделать его быстрее и подскажем, как можно его улучшить. Для этого позвоните в офис или напишите нам на [email protected].
