Медленные сайты не устраивают ни пользователей, ни поисковые системы. Благодаря современным технологиям и высокоскоростному интернету люди отвыкли ждать. Оптимизация скорости загрузки сайта должна стать первоочередной задачей для создателей интернет-проектов.
В настоящее время поисковые движки стали гораздо сложнее. Эти интеллектуальные алгоритмы больше не принимают во внимание искусственные количественные показатели наподобие ссылочной массы или высокой частоты ключевых слов, о чём мы говорили в статье Как определить релевантность страниц сайта.
Ведущую роль сейчас играют поведенческие факторы, отражающие характер взаимодействия пользователей с сайтом. К ним относятся:
И несколько других. Подробнее об этом читайте в статье Поведенческие факторы на сайте.
Как раз показатель отказов, а вслед за ним и остальные параметры зависят от первых миллисекунд пользовательского опыта. Если конкретно — от скорости загрузки сайта. Если вы только начинаете свой путь, и сайт только недавно заработал, вам может разобраться в верности ваших шагов продукты Calltouch.
В пору сверхскоростного интернета, доступного почти везде, а в крупных городах — повсеместно, время загрузки сайта становится одним из определяющих факторов при работе с ним. Пользователи привыкли к скорости.
Во время выбора среди нескольких поставщиков товара, услуги и информации велика вероятность моментального отсеивания посетителем сайтов, которые начинают зависать при переходе на них.
За скорость загрузки веб-разработчики ведут нешуточную борьбу, прибегая к различным инструментам анализа и повышения качества данного параметра. Как это происходит на практике — далее.
Загрузка производится путем обмена данными между двух сторон — браузером (со стороны пользователя) и сервером (на нем хранятся все файлы). Замедление может происходить из-за:
Чтобы устранить эти проблемы необходимы методы оптимизации сайта.
Современный пользователь нетерпелив — если сайт моментально не открылся, он его покидает. Также скорость загрузки влияет на факторы СЕО.
Это процесс внесения информации о сайте в базу данных поисковой системы. Робот поочередно открывает страницы, анализирует их и распределяет в выдаче. Если создатель сайта хочет, чтобы покупатели легко находили его продукт, ему нужно попасть в топ поисковых систем. Это невозможно без быстрой индексации.
На скорость обновления информации влияет много факторов: правильный файл robots.txt, ошибки в коде, в том числе и скорость загрузки сайта. Робот учитывает показатели оптимизации как для мобильных устройств, так и для компьютеров. Более удобные сайты индексируются быстрее остальных и, соответственно, занимают более высокие позиции в ранжировании.
Поисковая система развивается, чтобы улучшить качество интернет-сервиса. Если сайт загружается быстро, то пользователю не приходится ждать, пока материал отобразится в браузере (скорость особенно актуальна для мобильных телефонов).
Google официально объявил, что если портал отображается с задержками, то он будет терять позиции ранжирования в системе. Официальных публикаций от Яндекс на этот счет не было, но оптимизаторы сходятся во мнении, что при ранжировании в любой поисковой системе скорость играет важнейшую роль.
В 2019 году Коли Лафран (редактор Unbounce) опубликовал исследование о скорости загрузки страниц. Согласно опросам, проведенными его командой, были сделаны выводы:
Исходя из исследований Лафрана, задержки в открытии страницы негативно отражаются на готовности пользователя совершить целевое действие (просмотреть видео, изучить материал, купить товар или др.).
Нормы загрузки сайта:
Если сайт перестанет обращать внимание на скорость отображения страницы, то до 60% пользователей начнут уходить (если загрузка длится дольше трех секунд).
Продукт от Google, работает и для десктопных сайтов, и для мобильных. В начале общий результат отображается по шкале от 1 до 100, где 100 — идеальная ситуация, в которой скорость загрузки стремится к нулю, причём иногда его достижение реально. В обоих случаях даётся развёрнутая аналитика по перечню значимых факторов и рекомендации по каждому:
С помощью Lighthouse инструмент эмулирует 3G-сеть для загрузки сайта. В разделе имитации загрузки отмечаются следующие параметры:
Они оцениваются в секундах, а иконка показывает, является ли значение высоким, средним или низким по качеству. Каждый показатель снабжён пояснением.
В разделах Оптимизация, Диагностика и Успешные аудиты приведены детальные рекомендации по улучшению факторов загрузки сайта.
Бесплатный инструмент в рамках комплексного сервиса Pingdom. Имеется лишь англоязычная версия, но это не существенный аспект, ведь функционал довольно продвинутый и даёт ясное понимание положения дел.
Сперва пользователь должен ввести адрес страницы в строку и выбрать регион, из которого будут поступать запросы к сайту. После этого можно приступать непосредственно к анализу.
Результатом будет балльная оценка и категория качества — от A до F, где A — наилучший результат. Также в списке главных параметров система отображает размер страницы, скорость загрузки и каким количеством запросов тестировалось подключение.
Далее последует раздел Improve page performance, в котором будут даны чёткие рекомендации по улучшению содержимого страницы с точки зрения кода, необходимые для оптимизации скорости загрузки.
После тестирования Response code 200 — кода ответа страницы — располагается раздел с указанием веса элементов сайта по категориям:
Тут же имеется таблица с размерами разных категорий загружаемой страницы и количество обращений к категориям контента.
В заключении пользователя знакомят с последовательностью загрузки элементов в виде диаграммы, где в секундах отмечено время загрузки каждого из них в хронологическом порядке.
Наглядная информация вкупе с детальными рекомендациями делает сервис одним из самых полезных инструментов анализа скорости загрузки сайта и улучшения показателя.
Запуск осуществляется после указания адреса страницы, ввода геолокации и браузера.
Инструмент для профессиональных веб-аналитиков, разработчиков и оптимизаторов. Даёт развёрнутую информацию по многим специфическим показателям, из которых время загрузки страницы и количество запросов — самые малозначимые и дилетантские.
Основные инструменты анализа — диаграммы, где отображена последовательность загрузки всех элементов с разбивкой на этапы. На некоторой позиции устанавливается фиолетовая вертикальная линия — момент полной отрисовки сайта. Затем — синяя линия — окончательная загрузка. Соответственно, их расположение не должно превышать 2-3 секундной отметки. Показатели весьма условные и предостерегают только от экстремальных случаев. В целом, следует минимизировать и то, и другое время.
Детальный анализ даётся по всем запросам, что позволяет вместо усреднения посмотреть картину загрузок в динамике и понять, какие запросы отражают реальное положение дел, а какие не вписываются в общую тенденцию.
Было перечислено ограниченное количество наиболее востребованных и профессиональных инструментов, которые дают максимальный эффект от использования. Но существуют и аналогичные сервисы, каждый со своими достоинствами и недостатками, которые могут заинтересовать пользователей. В частности:
Один из бывших сотрудников Facebook и основатель Pave Д. Митчел описал начало оптимизационной деятельности: прежде чем начинать что-то ремонтировать, нужно понять, что сломалось.
Есть несколько весомых метрик скорости загрузки. Одна из них — время до первого байта, которое отображает, как быстро браузер получает сведения от сервера после отправки запроса. Также можно изучать старт рендеринга сайта и время отображения, серверные работы.
Если причина плохой работы в сервере, то эффекта от клиентской оптимизации не будет.
При возрастании трафика на сайте торможения начинаются из-за нехватки ресурсов хранилища. Одно из решений — докупить больше мощности. Это могут быть более вместительные хранилища, производительные сервера. Без особых манипуляций владелец сайта сможет улучшить скорость отклика.
Но этот способ будет действенен до определенного момента, а потом расходы на оплату слишком возрастают и становятся неподъемными. Тогда появляется смысл воспользоваться методами оптимизации.
От обработки базы данных зависит отклик ресурса на запросы. Если запрос приходит с задержками, это сказывается на PHP. В итоге в системе скапливаются операции, которые не могут быть обработаны сервером.
Управление этим процессом происходит путем применения СУБД. Одна из наиболее эффективных и популярных — MySQL. Это ПО с открытым исходным кодом. Его разработала компания Oracle в 1995 году. Владельцу сайта стоит заняться оптимизацией таблиц MySQL: это поможет обойти ошибки в обработке данных и сильно ускорит отображение контента на сайте.
Некоторые владельцы порталов ошибочно делят CMS на быстрые и медленные. Нагрузка на сервер зависит от кода движка, но большинство систем оптимизированы для максимальной эффективности и не должны влиять на скорость загрузки.
Но кроме общего кода CMS, есть также дополнительные элементы (плагины, расширения и др.). Именно они плохо сказываются на производительности. Проблемы могут начаться и при неправильной эксплуатации движка. Например, CMS для блога применяется при создании магазина. Владелец должен проверить совместимость дополнений и назначение движка. Это поможет улучшить загрузку.
Одно из мощнейших средств увеличения скорости загрузки. Кэширование производится на сервере, а не на заголовках. Если для вычисления задействуются серьезные ресурсы, то нужно перенести результат в кэш и обновлять его регулярно. Идея простая, но трудная в воплощении. Алгоритмы кэширования встроены в языки программирования, CMS и серверы.
Процедура помогает уменьшить рендеринг страницы (сократить до миллисекунд). В такой ситуации на сервер могут пойти пики трафика. Тут возникают трудности: не все удается кэшировать или кэш неправильно удален. Если с ними справиться, то процедуру можно назвать эффективной.
Регулировка TCP полезна для масштабных проектов и серверов со скоростью от 10G. Нужно понимать: сетевая подсистема постоянно обновляется с выпуском новых ядер Linux, поэтому нужно произвести обновление.
Корректировка TLS (HTTPS) помогает повысить безопасность и снизить время на подключение защищенного соединения. Рекомендации по настройке были выпущены компанией Mozilla.
HTTP — HTTP/2 нужен для ускорения работы ресурса. Протокол был придуман совсем недавно, но уже используется в 20% случаев. Однако полагаться только на HTTP — HTTP/2 не стоит, так как ускорение не слишком успешно.
Процесс ориентирован на все, что происходит со стороны клиента (в браузере). Это усложняет контроль (нужно учитывать разные браузеры, устройства) и формирует несколько направлений. Рассмотрим самые эффективные из них.
Критический путь — это группа ресурсов для запуска рендеринга сайта. Обычно он состоит из HTML, CSS, шрифтов и JS. Оптимизатор должен уменьшить этот путь по показателям трафика и времени.
Самый простой метод — запустить аудит в браузере от Google (панель разработчика) и подключить Lighthouse (вычисляет состав и время загрузки с учетом слабого соединения).
Критический путь уменьшается благодаря удалению всего лишнего. Например, значительная часть JS без проблем отлагается до загрузки.
Сегодня шрифты стали шаблоном для дизайна. Однако они плохо сказываются на загрузке. Проблема обостряется, потому что некоторые указатели на файлы с кодом скрыты в CSS. Разработчики еще любят применять свободные веб-службы шрифтов, что приводит к еще большим замедлениям.
Правила улучшения эффективности устраняют лишний объем трафика и получать файлы максимально быстро. Трафик удается урезать путем применения новых форматов: WOFF2 или WOFF (с целью совместимости). Также стоит активировать только наборы, которые применяются на ресурсе (латиницы и кириллица или др.).
Картинки занимают серьезную часть веса каждого сайта. Владельцам проекта не рекомендуется пересекать пределы среднего размера. Картинки не всегда играют ту же роль, что CSS и JS. Но для некоторых сайтов изображения выходят на первый план контента.
Для оптимизации нужно уменьшить размер картинок. Подойдут инструменты сжатия и форматирования:
В качестве дополнения могут использоваться и новые форматы: WebP или др. Этот файл может охватывать области применения PNG и JPEG.
Наиболее простой способ повышения эффективности загрузки. Владелец сайта должен кэшировать в браузере редкие ресурсы: картинки, CSS и JS, шрифты или документ. В итоге только единожды посылается запрос на сервер.
Если портал работает с Nginx, то стоит добавить: add_header Cache-Control «max-age=31536000, immutable. Это позволяет браузеру кэшировать сайты на период до 12 месяцев. Для изменения такого ресурса можно корректировать URL-адрес. Например, к имени файла добавляется версия.
Обязательно требуется сжатие любой текстовой информации при отправке с сервера. Большинство серверов предусматривают посылание ответа при помощи gzip. Но обычной активации процедуры не хватает.
Уровень сжатия можно настроить — он должен быть почти максимальным. Также разрешается применять статистическое сжатие. Затем сервер будет искать меньшую на сервере версию и сразу выдает ее.
Также можно пользоваться более полезными системами сжатия: zopfli и brotli.
CDN — это сеть доставки материалов, позволяющая ускорить страницу. Благодаря уменьшению расстояния от сервера до клиента, производительность ресурса улучшается. Другое преимущество CDN — возможность не только раздавать первичное содержимое, но и эффективно применить контент: сжать изображения и компрессировать тексты.
Рассмотрим популярные CMS:
Для увеличения скорости загрузки сайта необходимо принять ряд мер, которые касаются как работы с контентом, так и серьёзных манипуляций в коде и структуре.
Результаты проделанной на сайте работы помогут проанализировать продукты Calltouch.
Для постоянного качества функционирования сервиса показатели нужно поддерживать, мониторить и налаживать.
Все веб-ресурсы находятся в постоянной доработке. Меняются шаблоны, контент, шрифты и даже программный код. Любое изменение может отразиться на скорости.
Владелец должен ввести систему мониторинга, чтобы сразу определять динамику, выявлять причины падения трафика.
Чтобы постоянно публиковать «правильный контент» в системы управления требуется ввести оптимизирующие процедуры. Особенно это касается картинок.
Постоянное тестирование в идеальных серверных условиях полезно для отслеживания эффекта от изменений в коде, но этого мало. Любой владелец сайта хочет, чтобы страница работала не только у него, но и у пользователя. Для сбора нужной информации есть специальные сервисы (RUM).
Для введения системы нужно подключить одну из аналитик ПС и изучить отчеты о времени открытия страницы. Для подробных и точных сведений можно воспользоваться полноценными ресурсами.
Ускорение загрузки сайтов — это довольно молодое направление оптимизации. Процедура важна в конкурентной борьбе. Владелец сайта всегда должен помнить о пользователях и их удобстве. Тогда проект будет развиваться и зарабатывать деньги.
Хочу получать интересные новости блога
9 октября 2020
24 сентября 2021
7 сентября 2021
10 сентября 2021
31 августа 2021
30 августа 2021
