Как ускорить работу вашего веб-сайта: 15 быстрых и простых способов уменьшить время загрузки веб-страницы

Опубликовано: 2021-10-10

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

Фактически:

Методы, которые я собираюсь раскрыть, — это те же самые стратегии, которые я использовал для увеличения скорости моей страницы с полной загрузки в 3+ секунды до 1,2 секунды ровно.

Но вот лучшая часть:

Ни одно из этих улучшений загрузки веб-сайта не требует ноу-хау разработчика и может быть реализовано даже новичком в SEO очень быстро.

Если вы хотите увеличить скорость своего сайта, повысить рейтинг, повысить вовлеченность и конвертировать больше трафика, этот пост для вас. Но во-первых, почему важна быстрая загрузка веб-страницы?

Статистика времени загрузки сайта

Статистика времени загрузки сайта

  • 59,2% пользователей покинут сайт в первые 6 секунд, если он загружается медленно — Unbounce
  • По мере того, как время загрузки страницы уменьшается с 1 секунды, вероятность отказа увеличивается на 32% — Think With Google
  • Сокращение времени загрузки на 0,1 секунды приводит к повышению показателя отказов на страницах генерации лидов на 8,3% — Google, Fifty-Five и Deloitte.
  • Когда время загрузки сокращается всего на 0,1 секунды:
    • Вовлечение розничных клиентов увеличилось на 5,2%.
    • Показатели отказов на страницах со списком продуктов в категориях розничной торговли и путешествий улучшились на 5,7% и 5,4% — Google, Fifty-Five и Deloitte.
  • Коэффициенты конверсии веб-сайтов падают в среднем на 4,42% с каждой дополнительной секундой загрузки от нуля до пяти секунд — Portent
  • Увеличение времени загрузки сайта на одну десятую секунды приводит к снижению коэффициента конверсии на 7% — Akamai
  • Сокращение времени загрузки сайта на одну десятую секунды приводит к увеличению коэффициента конверсии на 8,4% для сайтов розничной торговли и на 10,1% для туристических сайтов — Google, Fifty-Five и Deloitte.
  • Если сайт электронной коммерции загружается медленнее, чем ожидалось, более 45% людей признают, что они с меньшей вероятностью совершат покупку — Unbounce
  • Около 70% людей говорят, что скорость страницы влияет на их готовность покупать в интернет-магазине — Unbounce
  • 77% покупателей смартфонов говорят, что они с большей вероятностью совершат покупку на мобильных сайтах, которые предлагают им возможность совершать покупки быстро – Think with Google
  • На сайтах розничной торговли наблюдается увеличение средней стоимости заказа на 9,2%, когда время загрузки сокращается на одну десятую секунды — Deloitte
  • Среднее время, необходимое мобильной веб-странице для визуальной полной загрузки, составляет 21,6 секунды — Backlinko
  • Среднее время, необходимое настольной веб-странице для визуальной полной загрузки, составляет 8,2 секунды — Backlinko
  • Средняя скорость загрузки полностью загруженной веб-страницы на мобильных устройствах составляет 27,3 секунды — Backlinko.
  • Средняя скорость загрузки полностью загруженной веб-страницы на рабочем столе составляет 10,3 секунды — Backlinko
  • Полная загрузка веб-страницы в среднем на мобильных устройствах занимает на 87,84% больше времени, чем на настольных компьютерах — Backlinko
  • Медленная загрузка страниц для мобильных устройств приводит к увеличению показателя отказов в два раза и снижению количества просмотров страниц на 27% по сравнению со страницами для настольных компьютеров.

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

Что такое скорость страницы?

Скорость страницы — это время, необходимое для загрузки веб-страницы.

Определение скорости страницы

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

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

Не говоря уже о сжатии файлов, кэшировании, блокировке рендеринга и десятках других факторов, влияющих на скорость страницы и SEO.

Как вы начинаете говорить, улучшить скорость страницы не так просто, как установить плагин скорости страницы.

Существует множество, иногда сложных факторов, влияющих на скорость — или медленно — ваш сайт загружается.

Мало того, не существует «одного способа» измерить время загрузки страницы, их много.

Вот три самых распространенных:

Время загрузки страницы

Именно столько времени требуется для полной загрузки страницы.

Время до полной загрузки измеряет загрузку всех видимых частей страницы, а также скрытых элементов, таких как скрипты и код — в основном это измеряет время загрузки 100% всех ресурсов на странице.

Это самая простая для понимания метрика скорости страницы, но не обязательно самая полезная, поскольку страница может казаться пользователю загруженной (и фактически работать) задолго до того, как страница загрузится полностью.

Самая большая содержательная краска

Самая большая отрисовка содержимого (LCP) — более ценный показатель для определения времени загрузки страницы с точки зрения пользователя.

Он измеряет время, которое требуется веб-странице, чтобы показать пользователю самый большой контент на экране.

Обычно это заголовок страницы, избранное изображение или основной текст.

Короче говоря, LCP измеряет время, в течение которого важный контент в верхней части страницы становится полностью видимым для пользователя.

Самая большая содержательная краска

Например, предположим, что для полной загрузки страницы требуется 10 секунд.

Страница не будет «казаться» медленно загружающейся, пока первая содержательная отрисовка происходит в течение нескольких секунд.

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

Время до первого байта

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

TTFB на самом деле не измеряет, сколько времени требуется для загрузки страницы, однако он влияет на время загрузки страницы.

Чем дольше браузер получает данные с сервера, тем дольше будет отображаться страница.

Как рассчитать время загрузки страницы?

Существует множество различных методов измерения скорости страницы:

  • Время до первого байта (TTFB)
  • Самая большая содержательная краска (LCP)
  • Первая значимая краска (FMP)
  • Время до интерактивности (TTI)
  • Задержка первого ввода (FID)

Список можно продолжить…

И потому что ни одна из этих метрик не лучше другой.

Я рекомендую вам работать над ускорением вашего сайта во всех них.

Не волнуйся. Через мгновение я покажу вам, как это сделать, но сначала:

Почему скорость страницы важна для SEO?

Нельзя отрицать, Google одержим скоростью загрузки страниц.

Семя страницы как сигнал ранжирования

С 2010 года Google использует скорость сайта (и, следовательно, скорость страницы) в качестве фактора ранжирования в алгоритме своей поисковой системы.

Затем в 2018 году Google выпустил «обновление скорости», которое еще больше повлияло на рейтинг медленно загружаемых страниц в поисковых системах.

А совсем недавно, в 2021 году, Google представил Page Experience, основным компонентом которого были основные веб-жизненные показатели и скорость загрузки.

Сигналы ранжирования страницы

Google очень заботится о скорости страницы, а почему бы и нет?

Если Google собирается направить на ваш сайт кучу бесплатного трафика, они хотят, чтобы пользователи наслаждались БОЛЬШИМ опытом. Огромная часть этого — быстро загружаемая веб-страница.

Проще говоря:

Медленно загружаемый веб-сайт повредит вашему рейтингу в Google.

Быстро загружаемый веб-сайт поможет вашему рейтингу Google.

Единственный вопрос в том, как вы собираетесь улучшить время загрузки страницы? Мы рассмотрим это далее.

Как ускорить работу вашего веб-сайта: 15 лучших способов сократить время загрузки веб-страницы

От этого никуда не деться, многое из того, что способствует скорости страницы, глубоко укоренено в коде и является высокотехнологичным.

Создание AMP-страниц, минимизация HTTP-запросов и использование асинхронной загрузки — все это требует ноу-хау на уровне разработчика. И из-за этого я не буду обсуждать эту оптимизацию скорости страницы в этом посте.

Вместо этого я делюсь 15 простыми в реализации (но часто забываемыми) способами повысить скорость вашего сайта, как никогда раньше.

Давайте вскочим:

(1). Выполните тест скорости страницы, чтобы вы могли сравнить время загрузки (и знать, что нужно улучшить)

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

В конце концов, если вы не знаете текущую скорость страницы, как вы узнаете, успешна ли ваша оптимизация скорости?

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

Но быстрое предупреждение:

Ваши оценки будут сильно различаться от инструмента к инструменту.

Это связано с тем, что каждый инструмент тестирования скорости веб-страницы использует разные методы для оценки производительности. Мало того, расположение их серверов находится в разных городах — и, как вы узнаете позже, расположение серверов оказывает ОГРОМНОЕ влияние на время загрузки веб-сайта.

Не нужно зацикливаться на частностях. А пока просто запустите тест с каждым инструментом и запишите свои баллы.

Пингдом

Простой в использовании тест скорости сайта, который имитирует загрузку страницы в веб-браузере. В настоящее время Pingdom предлагает семь местоположений серверов, где вы можете протестировать свой сайт.

В отличие от других инструментов, которые измеряют время загрузки в зависимости от того, когда страница полностью загружена, Pingdom использует время загрузки, которое записывает, когда все ресурсы на странице были загружены. В этот момент страница будет интерактивной, но сценарии могут по-прежнему выполняться в фоновом режиме.

Инструмент тестирования скорости страницы Pingdom

GT Метрика

Инструмент для тестирования скорости страницы, который позволяет измерять как настольные, так и мобильные устройства, а также возможность тестирования в нескольких браузерах. GT Metrix предоставляет различные местоположения серверов, в том числе 7 в бесплатном плане и еще 15 в профессиональном плане.

Измерение по умолчанию — это время полной загрузки, при этом время загрузки может быть необязательным.

Инструмент тестирования скорости веб-сайта GT Metrix

Веб-страницаТест

WebPageTest — еще один отличный инструмент, который показывает скорость и производительность вашего сайта в разных браузерах.

WebPageTest имеет самое большое количество тестовых локаций, всего 38. Как и в GT Metrix, в тесте веб-страницы по умолчанию используется время полной загрузки, а время загрузки (также известное как время завершения документа) не является обязательным.

Веб-страницаТест

Статистика PageSpeed

Это инструмент Google для оценки производительности скорости страницы. В отличие от трех инструментов, упомянутых выше, Google использует полевые данные вместо лабораторных в своих оценках — при условии, что полевые данные доступны.

Что это значит:

Вместо запуска теста, имитирующего время загрузки для реального пользователя, Google PageSpeed ​​Insights собирает реальные пользовательские данные от пользователей браузера Chrome. Эти данные агрегированы за 30 дней, а это означает, что вы не заметите улучшения своей оценки в течение 30 дней после оптимизации времени загрузки.

Статистика PageSpeed

Важно знать оценку Google вашего времени загрузки. Именно эту оценку они используют для Core Web Vitals — ключевой части сигналов Page Experience, которые способствуют ранжированию в поисковых системах.

Тем не менее, три других инструмента (Pingdom, GT Metrix и WebPageTest) более полезны для быстрого измерения производительности вашей страницы до и после.

Пара указателей:

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

Место тестирования Веб-страницаtest

Во-вторых, не делайте ошибку, тестируя ТОЛЬКО свою домашнюю страницу.

Скорость страницы уникальна для каждой страницы.

Я предлагаю вам протестировать все ваши самые важные URL-адреса и использовать Google Analytics, чтобы быстро определить самые медленно загружаемые страницы.

Отчет Google Analytics о времени загрузки страниц

Совет. Вы можете найти «Время страниц» в разделе «Скорость сайта» в меню «Поведение» GA.

Понял? Прохладный.

Давайте начнем оптимизировать скорость нашей страницы.

(2). Замените свою бесплатную систему доменных имен на молниеносный DNS-хост

Думайте о хосте системы доменных имен (DNS) как о телефонной книге.

Он сопоставляет ваше удобочитаемое доменное имя с IP-адресом (где фактически находится ваш веб-сайт).

Хост системы доменных имен

Короче говоря:

Каждый раз, когда пользователь вводит ваш веб-адрес в адресную строку своего браузера, браузер выполняет поиск DNS, который преобразует веб-адрес в IP-адрес и, таким образом, находит сервер, на котором размещен ваш веб-сайт.

По умолчанию вы будете использовать бесплатную службу DNS, предлагаемую вашим регистратором домена.

NameCheap, GoDaddy, Google Domains (и почти любой другой регистратор доменов) предоставляют вам возможность настроить ваши серверы имен и направить ваш домен на IP-адрес вашего веб-хостинга.

Проблема с этими бесплатными службами DNS?

Они очень медленные.

Если вам нужен невероятно быстрый веб-сайт, я рекомендую переключить ваш DNS на Cloudflare.

Я переключился с DNS-сервиса Namecheap и отказался от времени запроса 26 мс:

Производительность Namecheap DNS

До ошеломляющих 13 мс.

Производительность Cloudflare DNS

Другими словами, я сократил время обработки DNS на 50%.

Лучше всего то, что это не стоило мне ни копейки.

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

Измените серверы имен на Cloudflare

И с этим вы закончили.

(3). Реализуйте этот кеширующий двойной удар и ускорьте время загрузки

Вот что (обычно) происходит, когда пользователь попадает на ваш сайт:

  • Их браузер связывается с вашим веб-сервером
  • Ваша система управления контентом извлекает последние данные из вашей базы данных (например, ваши последние сообщения и страницы).
  • Ваш веб-сервер компилирует данные в HTML-страницу и предоставляет ее посетителю.
Браузер и подключение к базе данных

Плагин кэширования полностью удаляет первые два шага.

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

Как работает кэширование

И при этом он ускоряет время загрузки для пользователей.

Мои рекомендации для плагинов кэширования WordPress:

  • WP Rocket (то, что я использую)
  • Общий кэш W3
  • WP Супер Кэш

Поскольку плагин кэширования удаляет поиск в базе данных, он может сократить время загрузки вашего сайта на 1-3 секунды.

Неплохо.

Но если вы хотите, чтобы ваши страницы загружались безумно быстро, я рекомендую это:

Пограничное кэширование (CDN)

В отличие от кэширования страниц, при котором кешированная версия вашего сайта сохраняется на центральном веб-сервере…

Пограничное кэширование сохраняет целые HTML-страницы на «пограничных узлах», расположенных в сети серверов, охватывающей весь земной шар.

Что это значит:

Вместо запроса к серверу на другой стороне планеты…

Когда посетитель запрашивает открытие страницы, он доставляется с сервера, расположенного поблизости.

Как работает пограничное кэширование

Как и при кэшировании страниц, предварительно созданная версия веб-страницы сохраняется для немедленного доступа, и обращение к базе данных не требуется.

Как вы можете себе представить, если данные должны пройти всего несколько сотен километров, а не тысячи, а страница предварительно создана и готова для пользователей, это приведет к более быстрому времени загрузки.

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

Служба Edge Caching, которую я рекомендую вам использовать, — это CDN Cloudflare:

С более чем 200 серверами по всему миру:

Пограничная кэширующая сеть Cloudflare

И всего за 20 долларов в месяц это абсолютная кража.

(4). Оптимизируйте свои изображения, чтобы уменьшить огромные полезные нагрузки

Ничто так не замедляет работу сайта, как раздутые изображения.

И вряд ли это удивительно.

Изображения составляют огромную часть размера страницы.

Вклад изображений в вес страницы

(Почти 40% от общего веса страницы для нашей страницы услуг SEO).

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

Вопрос только как?

Во-первых, вы хотите изменить размер всех ваших изображений до максимального размера, который им нужен, но не больше.

Например:

Изображения на этой странице имеют максимальную ширину 640 пикселей.

Если бы мне нужно было загрузить изображение шириной 650 пикселей, я бы добавил ненужный вес странице.

Мало того, поскольку моя CMS должна была бы изменить размер изображения до ширины 640 пикселей, чтобы соответствовать размерам страницы, время загрузки замедлилось бы еще больше.

Имея это в виду, я рекомендую вам изменить размер ваших изображений до максимального, который им потребуется, ПЕРЕД их загрузкой на ваш веб-сайт.

Как сжать файлы изображений

Вы можете использовать онлайн-инструмент для редактирования изображений, такой как Pixlr, или инструмент, встроенный в ваш компьютер. Механизм не имеет значения — вам нужны ваши изображения того же размера, что и максимальная видимая область.

Второе, что вам нужно сделать, это выбрать правильный тип файла.

Выбор неправильного формата файла может добавить дополнительный вес или привести к низкому качеству изображений.

Если ваши изображения не анимированы, PNG или JPEG являются самыми легкими и, следовательно, загружаются быстрее.

Вот как узнать, какой тип файла выбрать:

Как выбрать правильный тип файла изображения

В-третьих, вы хотите удалить все лишнее из вашего файла изображения, сохранив при этом максимально возможное качество.

Не беспокойтесь о технических деталях.

Просто установите Imageoptim и позвольте инструменту сделать все остальное.

Оптимизация изображения

Это может помочь уменьшить размер файлов примерно вдвое.

Но ждать!

Что делать, если ваши изображения уже загружены?

Хорошие новости. Если вы используете WordPress, у меня есть решение:

WP Смуш!

WP Smush автоматически сжимает любое изображение, которое вы загружаете в медиатеку WordPress.

Плагин для оптимизации изображений WP Smush

И уменьшает размер файла более чем в 2 раза, без заметного падения визуального качества.

Довольно круто, правда?

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

(5). Реализуйте ленивую загрузку (но не на свой логотип)!

Даже если ваши изображения легкие как перышко, вес страницы все равно может быть тяжелым, если вы используете тонну графики в своих сообщениях (как я).

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

Введите ленивую загрузку.

Отложенная загрузка — это когда браузер откладывает загрузку изображений до тех пор, пока они не должны быть показаны на экране.

Другими словами, не все изображения загружаются сразу.

Некоторые изображения (и другие активы, такие как видео и вставки) откладываются и загружаются ТОЛЬКО при необходимости, т. е. когда пользователи прокручивают вниз до нужного раздела страницы.

Если вы внимательно посмотрите мои сообщения в блоге, вы увидите отложенную загрузку в действии:

Ленивая загрузка — это мощно. Это действительно может ускорить сайт. Но есть одна БОЛЬШАЯ проблема с ленивой загрузкой:

Когда он включен, он лениво загружает ВСЕ изображения.

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

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

Что значит:

Изображения «вверху» должны дождаться выполнения библиотеки JavaScript с отложенной загрузкой, прежде чем изображения в верхней части страницы смогут загрузиться. Другими словами, отложенная загрузка JavaScript блокирует рендеринг ресурсов, необходимых для быстрой отрисовки с наибольшим содержанием (LCP).

Чтобы решить эту проблему, возьмите URL-адрес вашего логотипа и любых других изображений вверху страницы (Подсказка! Ваше избранное изображение) и добавьте их в качестве исключения в свой плагин отложенной загрузки.

Я использую WP Rocket, и вот настройки:

Исключение логотипа отложенной загрузки

Независимо от того, используете ли вы WP Rocket или Autoptimize (еще один отличный плагин для отложенной загрузки), обязательно отложите загрузку изображений и установите свой логотип в качестве исключения.

При этом перейдем к другой вещи, которая должна быть установлена ​​​​на «отложить загрузку».

(6) Отложите файлы JavaScript и увеличьте скорость страницы

Если вы когда-либо запускали свой сайт через PageSpeed ​​Insights или GT Metrix, вам должно быть знакомо это предупреждение:

Отложить предупреждение о прохождении JavaScript GT Metrix

От этого никуда не деться. JavaScript — один из главных виновников, влияющих на время загрузки сайта.

Но почему?

Когда кто-то посещает ваш сайт, ваш веб-сервер доставляет HTML-контент вашего сайта в браузер пользователя.

Затем браузер пользователя просматривает HTML сверху вниз, чтобы отобразить страницу.

Если во время этого процесса он обнаружит какой-либо JavaScript, он перестанет отображать остальную часть страницы до тех пор, пока не будет получен и проанализирован полный файл JavaScript.

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

И вот сделка:

Большинство файлов JavaScript, таких как Live Chat, всплывающие окна, виджеты или даже сценарии отслеживания, не нужны для правильного отображения страницы.

Именно поэтому я рекомендую вам отложить анализ файлов JavaScript до тех пор, пока страница не загрузится.

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

Если вы используете WordPress, и WP Rocket, и Perfmatters позволяют откладывать рендеринг JavaScript.

Если вам интересно, вот мои настройки Perfmatters:

Задержка JavaScript

Скрипты, которые вы задержите на своем сайте, будут уникальными для вас.

Краткий обзор рекомендаций GT Metrix покажет вам виновников замедления времени загрузки.

(7). Обновите свой хостинг

Не все веб-хосты одинаковы. Отнюдь не.

Разница во времени отклика между быстрым и медленным хостинг-провайдером может легко составить 800 миллисекунд.

Звучит не очень, но разница в 4 раза:

Сравнение скорости хостинга

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

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

Я не могу говорить о производительности большинства хостов, но, как правило, вы получаете то, за что платите.

Тем не менее, если вы ищете предложения по хостингу, вот два хостинга премиум-класса, которые я использую и могу лично порекомендовать:

  • Cloudways — управляемый облачный хостинг на стеке серверов с оптимизированной скоростью для обеспечения более 60 местоположений по всему миру. Мои рекомендации для клиентов.
  • WP Engine — Управляемый хостинг для веб-сайтов WordPress с кэшированием страниц на уровне сервера. Тот же хостинг, на котором размещен этот сайт.

Независимо от того, следуете ли вы моим рекомендациям или другим, вы должны обратить внимание на несколько факторов.

Во-первых, вам нужен хостинг-провайдер, который использует твердотельный накопитель (SSD).

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

Во-вторых, выберите хост с сервером, расположенным в вашей стране или, по крайней мере, на вашем континенте.

Как местоположение сервера влияет на скорость страницы

Веб-сайты обычно работают на 1+ секунду медленнее за пределами страны, где расположен сервер.

Имея в виду эту статистику, если вы в настоящее время используете дешевый общий сервер, расположенный далеко-далеко, пришло время перейти на выделенный локальный сервер SSD.

(8). Очистите и сожмите свой код

Короче говоря, вы хотите минимизировать ресурсы, найденные на вашей странице.

Минификация (если это вообще слово) — это процесс удаления ненужных пробелов, символов и комментариев — фактически любых ненужных элементов — для уменьшения размера файлов.

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

Процесс минимизации файлов обычно ориентирован на JavaScript и CSS, но может также включать HTML.

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

Вы можете легко минимизировать свой код, установив WP Rocket и отметив пару флажков:

Настройки WP Rocket Minify

WP Rocket автоматически уменьшит ваш код!

Второй метод уменьшения размера файлов — сжатие GZIP.

GZIP работает аналогично сжатию ZIP и RAR, которое вы используете на своем компьютере, но обрабатывается вашим сервером.

По сути, когда посетитель попадает на ваш веб-сайт, его браузер запрашивает файлы сайта с вашего веб-сервера. Когда GZIP включен, ваш сервер будет сжимать эти файлы перед их отправкой в ​​браузер пользователя.

А поскольку эти файлы сжаты и легче, передача происходит быстрее.

Поскольку я использую хостинг WP Engine, GZIP уже включен.

Если ваш хостинг не поддерживает сжатие GZIP, вы можете включить его через WP Rocket или W3 Total Cache.

Или сделайте это вручную, если вы разбираетесь в подобных вещах.

(9). Откажитесь от устаревшего HTTP, чтобы воспользоваться преимуществом более быстрого протокола HTTP2

Не могу поверить, что говорю это в наше время.

Но если вы все еще используете свой веб-сайт по протоколу HTTP (в отличие от HTTPS), сделайте это сейчас.

Вы, наверное, знаете, что HTTPS — это сигнал ранжирования.

HTTPS как сигнал ранжирования

По сути, если ваш веб-сайт использует безопасный и зашифрованный протокол HTTPS, Google немного повысит рейтинг вашего сайта. Наоборот, если вы используете HTTP, эффективность ранжирования немного снижается.

Но это не единственная причина получить SSL-сертификат и перейти на HTTPS-хостинг.

Знаете ли вы, что HTTPS также быстрее?

Когда ваш сайт работает в режиме HTTPS (с шифрованием), ваш веб-браузер будет использовать более новый протокол HTTP2 (при условии, что ваш хост поддерживает его), который значительно быстрее, чем более ранний протокол HTTP 1.1.

На самом деле использование HTTPS позволит вашему сайту загружаться на 14,3% быстрее:

HTTP против HTTP2 скорости

Не так уж и плохо!

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

Если у вас нет, это верный признак того, что их инфраструктура устарела, и еще одна причина перейти к первоклассной хостинговой компании, такой как Cloudways, WP Engine или Kinsta.

СОВЕТ ПРОФЕССИОНАЛА: Подпишитесь на функцию Cloudflare 0-RTT (нулевое время приема-передачи), которая еще больше ускоряет согласование шифрования HTTPS!

(10). Используйте самую высокую версию PHP, которую позволяет ваш веб-сайт (и зафиксируйте более быстрое время обработки)

PHP — это язык программирования, используемый популярными CMS, такими как Joomla, Drupal и WordPress.

Хотите верьте, хотите нет, но это кодовая база, используемая 4 из каждых 5 веб-сайтов:

Использование языка программирования веб-сайта

Одна хорошая вещь в PHP заключается в том, что он постоянно обновляется для повышения безопасности и повышения производительности.

На самом деле, новые версии PHP выпускаются каждые 6-12 месяцев или около того, и каждое новое обновление PHP обычно на 10-30% быстрее, чем предыдущая версия.

Скорость обработки версии PHP

Каждая версия работает быстрее предыдущей из-за увеличения количества запросов к базе данных, которые она может обрабатывать одновременно.

Например, если сравнивать PHP 7.3 с PHP 5.6, более поздняя версия может обрабатывать в 3 раза больше транзакций в секунду.

Если ваш сайт находится на WordPress, это легкое решение обновить ваш сайт до последней версии PHP.

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

Кроме того, вы можете проверить настройки работоспособности сайта в меню «Инструменты» в WordPress. Оттуда вы увидите версию PHP, которую вы используете:

PHP-версия WordPress

И может обновить его соответственно.

(11). Используйте этот сервис для видео — он значительно ускорит ваш сайт

Этого нельзя отрицать; видео — исключительно хороший способ привлечь аудиторию.

Но проблема в том, что для загрузки они занимают огромное количество ресурсов сервера.

И, как вы начинаете понимать, чем меньше нагрузка на ваш сервер, тем лучше, потому что тем выше будет скорость вашей страницы.

Итак, в случае с видео…

Вместо самостоятельного размещения видео на своем сайте используйте отдельный сервис видеохостинга, такой как YouTube, Vimeo или Wistia.

Затем добавьте видео на свой сайт, используя код для встраивания.

Код для вставки Wista

Таким образом, ваш сервер не будет загружен загрузкой тяжелых видеофайлов и сможет использовать время для обработки других элементов на странице.

Но какой из этих сервисов лучше?

Согласно WP Rocket, Vimeo немного быстрее, чем YouTube и Wistia, и НАМНОГО быстрее, чем Daily Motion, самый медленный проигрыватель.

Тем не менее, разница между этими топ-3 минимальна, поэтому я выбираю Wistia для большинства своих видео.

Он имеет выдающуюся аналитику и поддерживает видеокарты сайта, что является отличной функцией для SEO.

(12). Найти (и исправить) переадресацию 3XX

301 и 302 редиректы полезны.

Они используются для перенаправления избыточной страницы на альтернативный рабочий URL.

Объяснение 301 и 302 редиректов

Беда в том, что они подлы для скорости страницы.

Почему?

Потому что всякий раз, когда пользователь пытается получить доступ к кодовой странице состояния 3XX, на сервер отправляются два запроса.

Один для исходного (перенаправленного) URL-адреса, а другой — для конечного URL-адреса назначения.

Это может означать значительное увеличение времени загрузки сайта.

Но вот в чем дело…

Вы не можете полностью отказаться от редиректов 3XX. Это нанесет серьезный ущерб вашему SEO.

Однако вы можете свести к минимуму ненужные коды состояния 3XX:

(а). Внутренние перенаправления

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

Например:

На своей домашней странице вы размещаете ссылку на статью о кето-диете (например,healthfitness.com/keto-diet/)

Позже вы решите создать новую статью на эту тему и перенаправить старую статью на новую. (301 перенаправление с сайтаhealthfitness.com/keto-diet/наhealthfitness.com/new-keto-diet/)

Отличная работа — это хорошая практика для SEO.

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

Цепочка перенаправлений

К счастью, есть простое решение. Просто обновите исходную ссылку до конечного целевого URL.

Простой способ найти редиректы на вашем сайте — установить Check My Links. Это расширение для браузера будет сканировать вашу страницу и выделять все ссылки, которые перенаправляют.

Быстрый просмотр домашней страницы SEO Sherpa позволяет обнаружить несколько внутренних перенаправлений в нижнем колонтитуле:

Найдите и исправьте внутренние перенаправления с помощью Check My Links

Все, что мне нужно сделать, это войти в WordPress и обновить эти ссылки в нижнем колонтитуле до конечного пункта назначения.

(б). Цепочки перенаправления

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

Цепочки перенаправлений случаются, когда одна перенаправляемая страница перенаправляет на другую перенаправляемую страницу и так далее.

Обычно они являются результатом изменений, внесенных в сайт с течением времени.

Например:

  • domain.com/about/ обновлен и 301 перенаправлен на:
  • domain.com/about-us/ обновлен и 301 перенаправлен на:
  • domain.com/about-our-company/ обновлен и 301 перенаправлен на:
  • домен.com/company-history/

Теперь любой, кто попытается получить доступ к исходной странице, будет перенаправлен не один, а три раза.

Мне нравится использовать Ahrefs Site Audit для поиска цепочек редиректов. После сканирования вашего сайта он определит количество проблем с цепочкой перенаправлений, которые у вас есть (наряду с другими ошибками).

Цепочка редиректов в Ahrefs

Вы можете углубиться в список цепочек перенаправления, чтобы увидеть цепочки, которые происходят:

Цепочки редиректов Ahrefs

Чтобы исправить каждую цепочку, обновите перенаправления 301 в исходном URL-адресе с абсолютной ссылкой на конечный пункт назначения, тем самым удалив цепочку перенаправлений в середине.

(13). Устранение ошибок 404

Бывает!

Файлы перемещаются (или пропадают), а ссылки перестают работать.

Битые ссылки влияют на скорость страницы

В этом случае пользователи будут испытывать более длительное время загрузки страниц из-за дополнительных запросов веб-сервера на поиск отсутствующих файлов.

В итоге это приводит к ошибке 404.

Причины этих ошибок многочисленны и несущественны.

Все, что вам нужно знать, это как их найти:

Один из способов — использовать консоль поиска Google, чтобы найти и исправить их.

После входа в свою учетную запись GSC нажмите «Покрытие», а затем «Ошибка».

Нажмите « Отправленный URL-адрес не найден », и вы увидите список всех ссылок, приводящих к ошибке 404:

404 Страница не найдена Google Search Console

В качестве альтернативы вы можете использовать инструмент аудита сайта, такой как Ahrefs или Screaming Frog.

Какой бы инструмент вы ни использовали, знайте, что вам необходимо идентифицировать ссылки на страницы 404 и медиафайлы.

Затем замените или удалите эти неработающие ссылки.

Это ускорит ваш сайт.

(14). Сокращение, обновление и обновление — три шага для повышения скорости вашей страницы с помощью плагинов

Когда дело доходит до плагинов и расширений, чем меньше, тем лучше.

Большинство надстроек загружают JavaScript и CSS.

И, как я уже говорил, эти две вещи могут замедлить работу вашего сайта.

Поэтому, где это возможно, я рекомендую вам удалить ваши плагины и использовать ТОЛЬКО то, что (абсолютно) необходимо.

Все, что не нужно для работы вашего сайта, отключите, а затем удалите.

Конечно, некоторые плагины влияют на скорость сайта больше, чем другие.

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

Медленные плагины WordPress
New Relic можно использовать для выявления медленных плагинов на вашем сайте.

В этом посте от ServeBolt перечислены плагины WordPress, которые больше всего влияют на время загрузки, а также лучшие и более быстрые варианты.

Вам следует переключиться, если вы найдете более быстрые альтернативы.

The third step in speeding up your website via plugins is to ensure you are running the latest plugin versions.

Very often, older plugins have incompatibilities with the current version of WordPress or PHP.

These incompatibilities almost always impact page speed performance.

Thankfully, the plugin menu in WordPress makes it easy to spot outdated plugins:

Плагин производительности

From there, you can simply upgrade to the latest version.

(15). Use This Little Known Google Tag Manager Trick to Speed up Your Website

You've probably heard of Google Tag Manager? And, hopefully, you are using it on your website.

Google Tag Manager is a container for all your pixels and tracking scripts, which makes deploying codes simple – and bypasses the need for a developer.

Simply moving your tracking pixels from embedded in your website code to Google Tag Manager can shave up to 2 seconds off your load time.

This is a great page speed improvement, but it doesn't stop there…

Did you know that Google Tag Manager, allows you to control when your tags are fired and thus speed up your load times even further?

As you've learned already, any code that's not required for a fast largest contentful paint should be delayed until after the main content has loaded.

By default, Google Tag Manager will fire your tags on page view.

GTM Window Loaded Trigger

But, by selecting the 'Window Loaded” trigger your tags are fired once the entire content of the page has been fully loaded, including any embedded resources such as images and scripts.

SEO Sherpa Tags

I set this up on the SEO Sherpa website, and because I have a bunch of tracking set up, it boosted load times significantly.

To implement this page speed trick on your own website, login to GTM and select 'New Trigger' and then 'Window Loaded.'

And once you've done that, you're done.

What Did You Think?

Now I'd like to hear from you:

Which technique from today's post are you going to implement first?

Are you going to fix broken links? Or implement lazy loading?

Either way, let me know by leaving a comment below.