Содержание
Скорость страницы: как оценить и улучшить скорость страницы
Google указал, что скорость сайта (и, как следствие, скорость страницы) является одним из сигналов, используемых его алгоритмом для ранжирования страниц. И исследования показали, что Google может специально измерять время до первого байта, когда учитывает скорость страницы. Кроме того, низкая скорость страницы означает, что поисковые системы могут сканировать меньше страниц, используя свой краулинговый бюджет, а это может негативно повлиять на вашу индексацию.
Скорость страницы также важна для удобства пользователей. Страницы с более длительным временем загрузки, как правило, имеют более высокий показатель отказов и меньшее среднее время на странице. Также было показано, что более длительное время загрузки негативно влияет на конверсию.
Вот некоторые из многих способов уменьшить время загрузки страницы:
Включить сжатие
Используйте Gzip, программное приложение для сжатия файлов, чтобы уменьшить размер файлов CSS, HTML и JavaScript, размер которых превышает 150 байт.
Не используйте gzip для файлов изображений. Вместо этого сжимайте их в программе, такой как Photoshop, где вы можете сохранить контроль над качеством изображения. См. раздел «Оптимизация изображений» ниже.
Минимизировать CSS, JavaScript и HTML
Оптимизировав код (в том числе удалив пробелы, запятые и другие ненужные символы), вы можете значительно увеличить скорость страницы. Также удалите комментарии к коду, форматирование и неиспользуемый код. Google рекомендует использовать CSSNano и UglifyJS.
Уменьшить число перенаправлений
Каждый раз, когда страница перенаправляется на другую страницу, ваш посетитель сталкивается с дополнительным временем ожидания завершения цикла HTTP-запрос-ответ. Например, если шаблон переадресации для мобильных устройств выглядит так:
example.com -> www.example.com -> m.example.com -> m.example.com/home
…каждое из этих двух дополнительных перенаправлений замедляет загрузку страницы.
Удалить код JavaScript, блокирующий рендеринг
Браузеры должны построить DOM-дерево путем анализа HTML, прежде чем они смогут отобразить страницу.
Если ваш браузер встречает сценарий во время этого процесса, он должен остановить и выполнить его, прежде чем он сможет продолжить.
Google рекомендует избегать и минимизировать использование блокирующего JavaScript.
Использование кэширования браузера
Браузеры кэшируют большое количество информации (таблицы стилей, изображения, файлы JavaScript и т. д.), поэтому, когда посетитель возвращается на ваш сайт, браузеру не нужно перезагружать всю страницу. Используйте такой инструмент, как YSlow, чтобы узнать, установлена ли у вас дата истечения срока действия вашего кеша. Затем установите заголовок «expires» на то, как долго вы хотите, чтобы эта информация кэшировалась. Во многих случаях, если дизайн вашего сайта не меняется часто, год является разумным периодом времени. У Google есть дополнительная информация об использовании кэширования здесь.
Улучшить время отклика сервера
Время отклика вашего сервера зависит от объема получаемого вами трафика, ресурсов, используемых каждой страницей, программного обеспечения, используемого вашим сервером, и используемого вами решения для хостинга.
Чтобы улучшить время отклика сервера, найдите узкие места в производительности, такие как медленные запросы к базе данных, медленная маршрутизация или нехватка памяти, и устраните их. Оптимальное время отклика сервера составляет менее 200 мс. Узнайте больше об оптимизации времени до первого байта.
Использование сети распространения контента
Сети распространения контента (CDN), также называемые сетями доставки контента, представляют собой сети серверов, которые используются для распределения нагрузки по доставке контента. По сути, копии вашего сайта хранятся в нескольких географически разнесенных центрах обработки данных, чтобы пользователи имели более быстрый и надежный доступ к вашему сайту.
Оптимизация изображений
Убедитесь, что ваши изображения не больше, чем должны быть, что они имеют правильный формат файла (PNG обычно лучше для графики с менее чем 16 цветами, а JPEG, как правило, лучше для фотографий) и что они сжаты для Интернета.
Используйте спрайты CSS для создания шаблона изображений, которые вы часто используете на своем сайте, таких как кнопки и значки.
CSS-спрайты объединяют ваши изображения в одно большое изображение, которое загружается сразу (что означает меньше HTTP-запросов), а затем отображает только те разделы, которые вы хотите показать. Это означает, что вы экономите время загрузки, не заставляя пользователей ждать загрузки нескольких изображений.
11 советов о том, как увеличить скорость загрузки веб-сайта в 2023 году
Поисковые системы, такие как Google, отдают приоритет страницам, которые загружаются быстро. Следовательно, позиция веб-страницы в результатах поиска также может отражать скорость ее загрузки.
Если скорость загрузки вашего веб-сайта слишком низкая, вы рискуете потерять внимание посетителя и подорвать потенциальный охват новых посетителей.
Эти 11 эффективных советов помогут ускорить загрузку вашего веб-сайта в 2023 году: 4
Есть масса данных, подтверждающих это утверждение. Например, 79% клиентов, скорее всего, не вернутся на веб-сайт с низкой производительностью, включая медленную загрузку.Источник: Neil Patel
Современные пользователи очень чувствительны даже к малейшим задержкам. Взгляните на изображение ниже, чтобы увидеть, как медленный веб-сайт влияет на показатель отказов. И вы уже должны помнить, что более высокие показатели отказов уменьшают среднее время пребывания на сайте и количество просмотренных страниц.
Источник: Deloitte
Фактически, пользователи посещают в среднем 8,9 страниц, когда время загрузки страницы составляет 2 секунды, по сравнению с 3,3 страницы, когда время загрузки страницы достигает 8 секунд.
Источник: Раздел
Согласно опросу 6255 сайтов, проведенному в июле 2022 года, среднее время, необходимое для полной загрузки веб-страницы, составило 4,2 секунды, что намного хуже рекомендованных Google 2 секунд.
Что это значит для конверсий? Ну, медленные сайты убивают их.
Всего 1-секундная задержка снижает конверсию на 7%. Для веб-сайта электронной коммерции, который зарабатывает 100 000 долларов в день, это потенциальные 2,5 миллиона долларов упущенной выгоды в год.
Источник: Blue Corona
Скорость страницы становится еще более важной с переходом Google к пользовательскому опыту в качестве фактора ранжирования (обновление Page Experience, обычно называемое Core Web Vitals).
UX-сигналы управляют просмотрами страниц и конверсиями и напрямую коррелируют со временем на сайте, просмотренными страницами за сеанс и показателем отказов.
Источник: SocialMediaExplorer
Сравнивая эти данные с недавним исследованием Salesforce, становится ясно, что потребители сегодня больше заботятся о своем опыте.
Источник: Salesforce
Приведу пример из реальной жизни: когда компания Pfizer улучшила время загрузки своих сайтов на 38%, показатель отказов снизился на 20%.
Издатели также нередко жертвуют скоростью загрузки веб-сайта для тяжелого контента, такого как видео и мультимедиа. Они думают, что это обеспечит более восхитительный и интерактивный опыт для их посетителей. Однако большинство людей были бы готовы отказаться от этого контента в пользу более быстрого веб-сайта.
Источник: Unbounce
И давайте не будем забывать о мобильном телефоне. С 2018 года Google работает в первую очередь с мобильных устройств, что означает, что он использует мобильную версию веб-страницы для индексации и ранжирования. Тем не менее, большинство мобильных веб-страниц по-прежнему не достигают цели, когда речь идет о скорости веб-сайта.
Согласно недавнему исследованию Backlinko, среднее время полной загрузки веб-страницы на мобильных устройствах составляет 27,3 секунды.
Источник: Backlinko
Это «немного» больше, чем рекомендуемый Google максимум 5 секунд при подключении 3G.
Это становится еще более тревожным, если учесть, что задержка загрузки мобильной страницы в одну секунду снижает количество конверсий на 20%.
Источник: Google
Мы также можем заметить, что скорость загрузки страниц различается в зависимости от региона. Исследование двух миллионов точек данных показывает, что страницы загружаются значительно быстрее в США и Европе по сравнению с Азией и Африкой. Одной из причин этого может быть то, что западные страны используют более быстрые услуги веб-хостинга.
Важно помнить об этом несоответствии, особенно если большая часть вашего трафика поступает из «более быстрых» регионов.
Источник: cacm.asm.org
Ниже вы можете найти самых больших нарушителей скорости страницы.
Источник: SEMRush
Следующие 11 советов помогут вам решить наиболее распространенные проблемы, которые замедляют работу вашего веб-сайта и наносят ущерб вашему бизнесу. Давай начнем!
1. Реализация отложенной загрузки для рекламы
Концепция отложенной загрузки объявлений проста. С помощью этой техники реклама показывается именно в тот момент, когда ваши зрители, скорее всего, ее увидят.
Этот метод может быть эффективным для оптимизации скорости вашей страницы и улучшения взаимодействия с пользователем (UX).
Почему следует использовать ленивую загрузку для рекламы?
- Повышает показатель видимости рекламы.
- Увеличивает скорость загрузки вашей страницы в среднем на 6-8 мс. Каждая миллисекунда имеет значение.
- Уменьшает задержку страницы.
Пример отложенной загрузки
2. Оптимизация веб-сайта для мобильных устройств
По состоянию на первый квартал 2021 года 54,8 % глобального веб-трафика исходило от мобильных устройств.
Источник: Statista
Благодаря Core Web Vitals и переходу Google на индекс, полностью ориентированный на мобильные устройства, более чем важно, чтобы ваша веб-страница была адаптирована для мобильных устройств и адаптирована под экраны меньшего размера, например iPhone 12. mini или Google Pixel 5.
Как оптимизировать сайт для мобильных устройств?
Вам необходимо:
- подписаться на адаптивный дизайн веб-сайта;
- уменьшить количество плагинов, загружающих неиспользуемый CSS;
- сократить время выполнения JavaScript;
- отложенная загрузка изображений;
- рассмотрите возможность перехода на ускоренные мобильные страницы (AMP) или Cloudflare для мобильных устройств;
- регулярно проверяйте скорость вашего мобильного сайта и отслеживайте его удобство для мобильных устройств в Google Search Console.
3. Оптимизация изображений
Изображения занимают больше всего ресурсов веб-сайта для загрузки, что приводит к увеличению времени загрузки вашего сайта.
Источник: Альманах
В некоторых случаях изображения слишком тяжелые или их слишком много. Другое дело, что формат не тот.
Как уменьшить размер файла изображения?
Приведенные ниже советы помогут вам оптимизировать изображения, чтобы повысить скорость загрузки вашего сайта.
- Сжатие : перед загрузкой любых изображений обязательно сжимайте их с помощью таких инструментов, как TinyPNG. Это уменьшит их размер без ущерба для качества.
- Реализовать ленивую загрузку : с помощью этого метода любое изображение, которое не отображается на странице, может быть загружено позже. Доступно множество плагинов, таких как Native Lazyload.
- Использование правильных форматов : используйте самые популярные форматы изображений. Как правило, PNG лучше подходят для графических изображений, а JPEG — для фотографий. Форматы изображений следующего поколения, такие как WebP, также набирают популярность, но имейте в виду, что такие браузеры, как Internet Explorer и более старые версии Firefox, Sarafi и Edge, их не поддерживают.
Как правило, PNG лучше подходят для графических изображений, а JPEG — для фотографий. Форматы изображений следующего поколения, такие как WebP, также набирают популярность, но имейте в виду, что такие браузеры, как Internet Explorer и более старые версии Firefox, Sarafi и Edge, их не поддерживают.- Использование спрайтов CSS : с помощью спрайтов CSS вы можете комбинировать часто используемые изображения, такие как логотипы и кнопки, и генерировать один код CSS, который загрузит их все сразу. Это улучшит скорость сайта, потому что вместо того, чтобы загружать все изображения одно за другим, они будут загружаться как одно целое.
4. Используйте сеть доставки контента (CDN)
CDN, также известная как сеть распространения контента, представляет собой географически распределенную сеть серверов. Это позволяет получить доступ к веб-контенту независимо от местоположения пользователя.
Скорость загрузки веб-сайта напрямую зависит от местоположения пользователя.
Для пользователей, которые физически находятся дальше от вашего сервера, время загрузки сайта будет больше.
При использовании CDN трафик распределяется между несколькими серверами, что помогает пользователям получать информацию максимально быстро. Это особенно важно для издателей с географически разнородным трафиком.
5. Исправить ошибки 404
Ошибки 404 или популярное сообщение «Страница не найдена» — это уведомление, используемое поисковыми системами для указания на то, что конкретная веб-страница или весь веб-сайт больше не существует. 9Ошибки 0003
404 не только раздражают пользователей, но и существенно ухудшают работу сайта.
Как исправить медленную загрузку веб-страниц?
Чтобы исправить медленную загрузку веб-страниц, используйте инструменты обнаружения ошибок, такие как Google Webmaster Tools (GWT) или аудит сайта Ahrefs.
Эти инструменты помогут вам быстро обнаружить все ошибки, связанные с вашим сайтом.
Профессиональный совет!
Если на веб-странице с ошибкой 404 много внешних обратных ссылок, подумайте о настройке перенаправления 301.
Поисковые системы проиндексируют новый URL-адрес, а старые обратные ссылки будут добавлены к рейтингу нового URL-адреса. Чтобы новая страница проиндексировалась быстрее, попробуйте добавить ее вручную в карту сайта.
6. Уменьшите число перенаправлений
Веб-страница перенаправляет посетителей на другой URL-адрес, отличный от запрашиваемого. Это создает дополнительные HTTP-запросы, требующие дополнительного времени обработки.
Для большинства владельцев веб-сайтов невозможно устранить все переадресации. Однако, чтобы сохранить скорость ваших веб-страниц, рассмотрите возможность сохранения только основных.
Рекомендуется использовать прямые ссылки при перенаправлении страниц вашего сайта. Это сведет к минимуму цепочки перенаправлений и повысит производительность всего вашего сайта.
Пример перенаправления
7. Минимизация CSS, JavaScript и HTML
Минификация означает оптимизацию кода путем удаления ненужных пробелов, разрывов строк, комментариев и т.
д. В результате получается «более короткая» версия файла, для загрузки которой требуется меньше байтов.
Это особенно важно для издателей WordPress, потому что разработчики веб-сайтов иногда могут создавать беспорядочный код, который может замедлить работу веб-сайта.
Эти инструменты помогут вам в этом процессе:
- HTMLMinifier — уменьшает файлы HTML
- CSSNano – уменьшает файлы CSS
- UglifyJS – уменьшает файлы JavaScript
8. Внедрение кэширования браузера
JS-файлы, изображения и т. д.) перед его использованием.
Кэш браузера хранит все эти элементы на стороне посетителя, поэтому в следующий раз, когда пользователь зайдет на вашу страницу, будет меньше запросов. На самом деле кеш может сократить время загрузки сервера на 80%!
Как работает кеш браузера?
Если вы являетесь пользователем WordPress, вам поможет плагин W3 Total Cache. Поскольку он записывает элементы вашего веб-сайта для будущих посещений, скорость загрузки вашего веб-сайта будет намного выше.
Статья по теме: Лучшие бесплатные плагины для WordPress 2021
9. Используйте премиум-сервис DNS
Крайне важно понимать, что все веб-хосты предоставляют бесплатный хостинг DNS. Мы вполне уверены, что ваш бизнес имеет его в данный момент.
DNS является одним из основных факторов, определяющих время отклика сервера. Однако, чтобы улучшить это время, вам нужен быстрый провайдер DNS.
Переход на DNS-хостинг премиум-класса, такой как Cloudflare, может увеличить скорость вашего сайта до 40%. Это определенно стоит учитывать.
10. Сокращение сторонних скриптов
Сторонние скрипты — это любые внешние скрипты, встроенные в ваш веб-сайт с помощью стороннего кода, например встроенное видео Youtube или чат-бот.
Обычно они добавляют функциональности вашему веб-сайту и предлагают множество полезных функций, таких как кнопки социальных сетей, комментарии, аналитика и т. д.
Пример чат-бота
Сторонние скрипты увеличивают время загрузки веб-сайта.
Так что оставьте только действительно важные. Спросите себя, действительно ли вам нужна функциональность чат-бота на всех ваших страницах? Можно ли оставить его только на главной странице?
Это то, что мы сделали в Setupad, и увидели увеличение на 25 баллов в PageSpeed Insights! Довольно хорошо, правда?
Ведущие издатели сегодня используют заголовочные ставки из-за их свойств максимизировать доход от рекламы. Однако эта технология может быть довольно тяжелой и в конечном итоге вызывать задержку страницы.
Торги в заголовке на стороне сервера аналогичны торгам в заголовке на стороне клиента, но вместо проведения аукциона в браузере пользователя на сервер отправляется один запрос, который затем отправляет несколько запросов на рекламные биржи и платформы на стороне предложения. (ССП). Этот подход все еще является относительно новым, но многие издатели теперь переходят исключительно на торги в заголовке на стороне сервера, потому что это намного быстрее.
Гибридные заголовочные торги Setupad включают межсерверные (S2S) подключения к серверу Prebid.
js, Google Open Bidding и Amazon Transparent Marketplace (TAM). В целом на эти S2S-интеграции приходится 35% выигрышных аукционов. Мы прогнозируем, что аукционы S2S вскоре превзойдут большинство аукционов благодаря гораздо более быстрому времени отклика на заявки и более высокой доходности.
Final Word
Вот и все! Помните, что повышение скорости страницы — это непрерывный процесс, и вы не увидите результатов за один день.
Проведите аудит сайта, чтобы найти и исправить страницы, которые снижают скорость загрузки.
Для клиентов Setupad мы предлагаем бесплатный аудит скорости загрузки веб-сайта, в ходе которого наши эксперты предлагают дополнительные рекомендации, адаптированные к их веб-сайтам. Присоединяйтесь к Setupad и получите бесплатный аудит скорости загрузки вашего сайта.
Об Алисе Зайцевой
Алиса — менеджер по контент-маркетингу в Setupad. Она увлечена контентом и помогает издателям масштабировать свой бизнес с помощью мощных стратегий цифрового маркетинга.