Как ускорить сайт

Быстрый сайт – это необходимое условие попадания сайта в ТОП поисковых систем, высокие конверсии и довольный посетитель (если, конечно, всё в порядке с контентом, юзабилити и ценами). Что сделать, чтобы сайт был быстрым? Мы подготовили руководство для маркетологов, владельцев интернет-магазинов, вебмастеров.

Что такое скорость загрузки сайта

Скорость загрузки страницы сайта определяет промежуток времени, за который веб-страница или медиа-контент скачивается с удаленного сервера и отображается в браузере клиента. Говоря о быстродействии, мы подразумеваем время, за которое после клика по ссылке все запрошенные вашим браузером ресурсы скачиваются к вам на компьютер и отображаются на дисплее.

Звучит просто? Но это очень грубое определение, ничего не значащее без показателей, из которых складывается это время. Надо учитывать, что для быстродействия важны:

• Время получения первого отклика с удаленного сервера (TTFB, Time To First Byte). За это время браузер только получает ответ от удаленного сервера и начинает загружать контент страницы, пользователь взаимодействовать с сайтом пока не может.
• Время, необходимое для первой отрисовки экрана (время первого взаимодействия пользователя с сайтом). С этого момента пользователь видит полученные данные первого экрана, но загрузка всего контента страницы ещё не завершена, и ещё не все возможности страницы пользователю доступны (контент второго экрана, применение фильтров, внутреннего поиска по сайту и т.п.).
• Время, когда посетитель уже может взаимодействовать с сайтом. С этого момента посетитель может выполнять какие-то действия на странице, хотя загрузка ещё не завершена.
• Время полной загрузки страницы, необходимое, чтобы стали доступны все ресурсы, которые использует страница (текстовый контент, графика, оформление, javascript, файлы шрифтов, видео с внешних ресурсов, скрипты аналитики).

Почему быстродействие сайта важно

Медленно загружающийся сайт прямо влияет на место в поисковой выдаче. Если вы собираетесь заниматься продвижением сайта в поисковых системах, вопрос быстродействия становится приоритетным. Даже у опытных SEO-оптимизаторов можно встретить сентенции вроде «Google всё равно, сколько там времени нужно вашему сайту для загрузки. 10, 15 секунд – разницы нет. Не всё равно посетителям, и видя высокий процент отказа, ПС понизит вас в выдаче». – Это лишь часть правды. Быстродействие напрямую влияет на результаты ранжирования, и есть рекомендуемые поисковиками параметры, на которые надо ориентироваться.

Быстродействие сайта – важный фактор ранжирования. Медленный сайт неконкурентоспособен.

Ещё одна важная причина заняться оптимизацией скорости загрузки – это посетители. Каждая секунда времени загрузки сайта увеличивает процент отказов (посетители просто уходят, не дождавшись загрузки), а также снижает шанс конвертировать посетителя в покупателя. И с каждым годом допустимое время загрузки снижается. Если в 90-е годы Интернет называли не иначе как World Wide Wait, и долгое ожидание загрузки страницы никого не смущало, то сейчас 40% посетителей уходят с сайта, если время загрузки страницы занимает более 2 секунд. За это время даже система аналитики не успевает загрузиться, и вы не узнаете, что потеряли потенциального клиента. 74% посетителей с мобильных устройств уйдут, если сайт грузится дольше 5 секунд. И это цифры 2014 года!

Причины «нетерпеливости» пользователей заключаются в физиологии мозга человека. 100 мс хранится визуальная информация в сенсорной памяти. Хранилище такой памяти очищается спустя 0,1 с, а через 10 секунд внимание рассеивается – и не получивший ожидаемого посетитель испытывает фрустрацию, разочарование и даже злость. Это уже не ваш клиент, вы его потеряли.

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

Типы оптимизации загрузки сайта

Оптимизация загрузки сайта может быть двух типов:

• Объективная оптимизация, при которой физически сокращается время отклика сервера, снижается количество запросов к нему, уменьшается количество передаваемой информации за счёт кэширования и архивации файлов, сжатия или сокращения ненужного кода;
• Субъективное ускорение, когда пользователю кажется, что загрузка уже произошла просто за счёт того, что доступ к важному контенту он уже получил до полной загрузки страницы. Второй способ – манипулятивен, это в большей мере психологический трюк, но он тоже работает.

Быстродействие – абсолютный показатель эффективности сайта (в отличие от посещаемости, конверсии и т.д.). Скорость загрузки можно измерить и сравнить со скоростью загрузки любого другого сайта. К сожалению, владельцы сайтов и разработчики уделяют этому вопросу слишком мало внимания уже на стадии проектирования. Это существенно ограничивает возможности оптимизации сайта, в том числе – и поисковой. Но всё же многое можно улучшить и после запуска сайта. Чтобы понять, что оптимизировать в первую очередь, надо провести измерения. Как? – Об этом дальше.

Как узнать показатели быстродействия сайта

Полный технический аудит сайта – задача для профессионалов. Но даже не обладая глубокими знаниями в этой области, вы можете собрать информацию о состоянии своего сайта с помощью веб-сервисов. Один из рекомендуемых – https://www.webpagetest.org/.

Схема работы сервиса проста: вы выбираете физическое расположение сервера, с которого на ваш сайт будут отправляться запросы, определяете тип устройства и браузер, задаёте интересующий URL. Всё, тест можно запускать. Сервис начинает считать запросы и засекать время на получение ответа.

• Зачем определять физическое расположение сервера? – Ваш хостинг должен физически ближе располагаться к месту, где живет целевая аудитория вашего сайта. Если ваша ЦА живет в Москве, но сервер расположен во Владивостоке, стоит задуматься о переносе сайта на другую площадку.
• Зачем определять браузер? – Если ваши клиенты используют преимущественно Chrome, а тесты используют, к примеру, Internet Explorer – вы получите нерелевантные результаты тестов. Зная данные по конкретным браузерам, вы будете понимать, какие проблемы надо решать, и можете определить приоритетность этих проблем.
• Зачем определять тип устройства? – Разница между взаимодействием сайта со смартфона и ПК может быть значительной, а вы должны понимать, с какими трудностями сталкиваются ваши посетители.

После прохождения серии тестов сервис покажет развернутый график, показывающий:

• Количество запросов, определяющих последовательность загрузки;
• Время загрузки контента по каждому запросу;
• Физический размер контента, загружаемого по каждому запросу.

Внимательно изучите этот список. Это – основа для плана будущей оптимизации. Например, вы видите, что загрузку замедляют подгружаемые с вашего сервера файлы шрифтов. Настолько ли они важны для дизайна вашего сайта и можно ли их заменить на стандартные системные шрифты, установленные по умолчанию у каждого посетителя? Или, возможно, стоит использовать web-шрифты с серверов Google, ограничив шрифтовую гарнитуру только необходимыми знаками (например, использовать только кириллические буквы и цифры).

Кроме подробностей по последовательности запросов, сервис покажет, какие рекомендуемые настройки стоит включить на сервере. К ним относятся: кэширование данных, поддержка keep-alive, архивирование передаваемых по сети данных для уменьшения их размера, использование внешнего хранилища файлов (CDN) и т.д. Эти данные можно использовать как основу для постановки технического задания вашему вебмастеру или системному администратору.

Что ещё стоит проверить

Первичный отклик сервера (TTFB)

Проверьте TTFB (первичный отклик сайта). Google Speed Insights рекомендует удерживать это время до 200 мс (https://developers.google.com/speed/docs/insights/Server). Из чего состоит это время?

• Поиск DNS сайта, к которому вы обращаетесь
• Обработка сервером запроса посетителя
• Ответ клиенту на запрос.

Вывод 1. Слишком большое время получения первого байта – медленный сервер, недостаток системных ресурсов, настройки брандмауэра, географическая удаленность сервера, плохо оптимизированный код сайта, обилие запросов сторонних сервисов к внешним ресурсам (виджеты соцсетей, коды аналитик, скрипты коллтрекинга, чаты). Подумайте, от чего можно отказаться, а что нужно оптимизировать.

Второстепенные и ненужные элементы страницы

Посетитель вашей страницы ищет определенную информацию: свойства товара, стоимость, адрес, условия доставки, значение какого-то термина. Именно эта информация должна быть доступна в первую очередь. Посетитель простит задержку загрузки видео с Youtube, но не будет ждать ответа на свой основной вопрос, ради которого он и пришёл из поиска.

Присутствие на странице ненужных элементов замедляет доступ к основным ресурсам, отрицательно влияя на конверсию.

Вывод 2. Разместите важнейшую информацию на первом экране. Удалите лишние или необязательные элементы, замедляющие загрузку. Второстепенные данные сделайте доступными по запросу пользователя, либо сместите их вниз. Особенно это касается тяжёлого медиа-контента (картинки, видео).

Расход системных ресурсов сервера

Нагрузка на сервер непосредственно влияет на быстродействие сайта. Оцените расход системных ресурсов на хостинге. Возможно, проблема заключается именно в том, что серверу не хватает мощности процессора или оперативной памяти.

Ещё один способ снизить нагрузку на сервер – отключить ненужные сервисы, плагины, службы в CMS и интерфейсе сайта. Например, модуль веб-аналитики 1С-Битрикс на многих сайтах включен по умолчанию. Ресурсов он отъедает много, при том, что его данными пользуются далеко не все владельцы и администраторы сайтов.

Вывод 3. Составьте техническое задание вебмастеру на проверку расхода ресурсов сайта. Возможно, стоит изменить тариф на хостинге, или с виртуального хостинга перейти на выделенный виртуальный сервер (VPS), либо достаточно отключить часть ненужных модулей и плагинов.

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