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

Существует множество отличных инструментов для тестирования скорости сайта, лучшие из которых – GTmetrix и Pingdom. Эти бесплатные инструменты предоставляют общую оценку производительности, детализацию страницы и подробные отчеты о скорости. Другими словами, это всего лишь инструменты, которые помогут вам определить, где сосредоточить усилия по оптимизации сайта.

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

1.1. Мой отчет GTMetrix

Вы можете видеть, что мой сайт может загружаться за 0,5 секунды после 21 метода оптимизации скорости сайта.

1.2. Параметры GTMetrix

Есть несколько важных параметров, которые вы должны знать от GTMetrix.

Проверка области сервера : будет проверяться URL-адрес, указанный в указанной области. (Только для зарегистрированного пользователя GTMetrix)
Оценка PageSpeed и YSlow : оценки показывают, насколько хорошо ваш интерфейс оптимизирован для загрузки. Это ничего не говорит о вашей производительности, потому что это очень сложно оценить на стандартизированном уровне. (Чем выше, тем лучше)
Время полной загрузки . Это время, необходимое для полной загрузки URL страницы. Чем меньше, тем лучше. Это будет варьироваться в зависимости от региона доступа. Просто выберите тестовый регион рядом с вашей клиентской базой или проведите тестирование в нескольких местах тестирования, если вы настроены на всемирный выбор.
Размер : общий размер файла, загруженного для текущей страницы. Чем меньше, тем лучше.
Количество запросов . Количество запросов, которые вызвала страница. Чем меньше, тем лучше

* Важное примечание: не слишком сосредотачивайтесь на счете, сосредоточьтесь на полностью загруженном времени. Некоторые люди могут получить быстро загруженное время даже с низким счетом. Время загрузки – это то, что влияет на пользовательский опыт.

1.3. Вкладки GTMetrix для анализа

PageSpeed и вкладка YSlow:

После проверки скорости вашего сайта будут предоставлены рекомендации. Ищите рекомендации и выполняйте их.

Пример:

Вкладка «Водопад»:

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

Пример моего предыдущего неоптимизированного водопада.

Вкладка Timings:

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

2. Как оптимизировать скорость сайта – 21 совет

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

2.1. Партнер с быстрым и надежным партнером веб-хостинга

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

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

2.2. Используйте легкую тему WordPress

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

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

Пожалуйста, прочитайте это руководство, узнать больше о WP Astra

WP Astra
Самая быстрая и легкая тема

2,3. Оптимизировать изображения

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

Чтобы избежать этого, измените размер ваших изображений и оптимизируйте качество ваших изображений. Я понял, что этот метод эффективен и всегда дает мне 100 баллов (оптимизировать изображение и обслуживать масштабированное изображение) от GTMetrix.

Я всегда буду изменять размер своих изображений с помощью таких инструментов, как Adobe Photoshop или Skitch, прежде чем загружать их, а затем оптимизировать качество изображений во время загрузки / после загрузки с помощью плагина оптимизации изображений, такого как Swift Performance. Это важный шаг, особенно для сайтов, которые сильно зависят от мультимедиа.

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

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

2,4. Сократите HTTP-запросы, управляя файлами Javascript и CSS

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

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

Чтобы решить эту проблему, рассмотрите возможность сокращения и объединения файлов Javascript и CSS . Swift Performance поставляется со скриптами и стилями. Оптимизация также.

Вот почему мне нравится Swift Performance, это инструмент, созданный для оптимизации скорости. У меня есть только 7 HTTP-запросов для моей домашней страницы, что обеспечивает высокую скорость загрузки.

2.5. Установите плагин Effective Cache

Это ключевой шаг, если не ключевой, для обеспечения оптимизации скорости сайта. Плагин Cache генерирует статические HTML-страницы сайта и сохраняет их на сервере. Этот инструмент позволяет обслуживать эти готовые HTML-файлы, когда пользователь заходит на сайт. Излишне говорить, что это намного быстрее, чем сравнительно тяжелая и медленная обработка PHP-скриптов.

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

2.6. Использовать сети доставки контента (CDN)

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

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

Вы можете использовать несколько CDN для кэширования различных типов контента, таких как медиа-файлы, файлы Javascript и т.д. Я использую и Cloudflare, и BunnyCDN. С этими двумя CDN я могу получить 100 баллов от GTMetrix, а также получить сайт с быстрой загрузкой.

2,7. Выберите расположение сервера рядом с целевыми посетителями

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

Веб-хосты, такие как A2 Hosting и Siteground, имеют несколько центров обработки данных в мире (американский, европейский, азиатский). Не беспокойтесь, если ваши целевые клиенты из WorldWide, настройка CDN поможет вам сократить время загрузки.

2,8. Включить сжатие GZIP

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

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

2.9. Используйте последнюю версию PHP

Обновление версии PHP, которую использует ваш веб-сайт WordPress, является одним из самых простых шагов, которые можно предпринять для оптимизации веб-сайта. В настоящее время последней версией PHP, поддерживаемой WordPress, является PHP 7.4.

Однако, учитывая сказанное, важно отметить, что это не выполняется автоматически ни вашим хостинг-партнером, ни самим WordPress. Это связано с тем, что не все темы и плагины совместимы с современным PHP.

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

2.10. Отключить неиспользуемые плагины

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

2,11. Оптимизировать базу данных

Оптимизация базы данных – отличный способ увеличить скорость и производительность сайта. Если размер базы данных вашего сайта увеличивается, она, как правило, уменьшается в скорости и производительности. С помощью функции управления базами данных плагина Swift Performance вы можете легко очистить свою базу данных от просроченных переходных процессов, дублированных метаданных и других неоптимальных артефактов.

2.12. Загрузить Google Font из локального хранилища

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

Чтобы оптимизировать скорость, вы можете разместить шрифт Google локально на своем хостинге.

2.13. Не используйте слишком много вариантов шрифтов

Не используйте слишком много вариантов шрифта. Каждое font-family или font-weight представляет собой 1 дополнительный запрос. Я использую только 1 семейство шрифтов с 2 шрифтами (жирным шрифтом и обычным шрифтом) на всем моем веб-сайте.

2,14. Используйте оптимизированный Font-Awesome

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

Благодаря этому вы получаете меньший размер файла по сравнению с исходным файлом Font Awesome (~ 120 КБ). Функция Critical Font из Swift Performance может сделать это без проблем, что я редко вижу в других плагинах кэша.

2,15. Загрузить иконку сайта из URI данных

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

Решение состоит в том, чтобы закодировать значок сайта в изображение base64 . Кодирование Base64 – это метод кодирования двоичных данных в текст. Он используется для встраивания изображений в HTML, чтобы уменьшить количество запросов к серверу, необходимых для отображения страницы.

Вы можете создать изображение base64 ( URI данных ) для вашего значка (рекомендуем формат .ico), а затем заменить значок сайта следующим кодом. Ссылка на ссылку – это ваш сгенерированный Data Uri.

Наконец, удалите оригинальный значок сайта из вашей темы. ( Внешний вид -> Настройка -> Макет -> Заголовок -> Идентификация сайта -> Значок сайта )

2,16. Отключить Hotlinking

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

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

2,17. Ленивая загрузка Google Maps и видео

Ленивая загрузка – это мощный инструмент оптимизации скорости сайта, который не позволяет загружать такие функции, как Google Карты или встроенные видео, до тех пор, пока пользователи не прокрутят страницу вниз, чтобы увидеть их. Это также может быть сделано с изображениями, но не рекомендуется, так как предлагает только минимальное повышение производительности. Это можно включить с помощью вашего плагина кеша.

2,18. Отключить пингбэки и трекбеки

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

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

Отключить для новых статей.
Настройки-> Обсуждение-> Настройки статьи по умолчанию-> ОТКЛЮЧИТЬ «Разрешить ссылки ссылок из других блогов (пингбэки и трекбеки) на новые статьи».

Отключить для существующих статей.
Сообщения-> Все сообщения-> Выбрать все существующие сообщения -> Массовое действие (Изменить) -> Применить -> Пинги -> Не разрешать -> Применить.

2,19. Удалите функции WordPress, которые вам не нужны

Точно так же, если вам не нужна функция WordPress для определенного сайта, мы советуем полностью ее удалить. Например, удаление смайликов и функций gravatar может привести к заметным улучшениям в скорости веб-сайта. Хотя эти изменения могут быть внесены вручную, Swift Performance имеет отличный инструмент для избавления от функций WordPress, которые на самом деле не нужны вашему сайту.

2,20. Только хост один сайт на учетную запись хостинга

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

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

2,21. Отключить повторные запросы HTTP для компоновщика страниц

Этот совет особенно полезен для пользователя компоновщика страниц, например, Elementor. Компоновщик страниц будет запрашивать собственные запросы Google Font и Font Awesome, даже если они размещаются локально. Пожалуйста, проверьте ваш конструктор страниц, не вызывает ли он еще один повторный HTTP-запрос в GTMetrix’s Waterfall.

Завершение

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

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

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

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

Источник записи: https://wpbuildermaster.com