перейти к содержанию

Как улучшить скорость сайта, исправляя ошибки Gtmetrix?

gtmetrix

Содержание

Скорость сайта - один из важнейших факторов в критериях оптимизации и SEO. Gtmetrix - один из лучших и наиболее практичных инструментов для измерения скорости сайта.

На самом деле скорость загрузки - один из самых важных факторов для рейтинга Google и SEO. С другой стороны, повышение скорости загрузки помогает улучшить «первое впечатление», которое вы предоставляете пользователям. Таким образом, повышая скорость сайта, вы оптимизируете свой сайт для поисковых систем и факторов UX.

Существует множество различных инструментов для измерения скорости загрузки. GTmetrix, Google Page Speed, Pingdom, тест веб-страниц и так далее.

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

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

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

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

Что такое GTmetrix?

Процитируем сам GTmetrix:

GTmetrix - один из инструментов, который мы все чаще и чаще используем для получения подробных отчетов о производительности нашего сайта. Это бесплатный инструмент, который анализирует скорость вашей страницы с помощью Google Page Speed ​​и YSlow. Затем GTmetrix генерирует оценки для ваших страниц и предлагает действенные рекомендации по их исправлению.

GTmetrix - это не только веб-сервис, но и подключаемый модуль, и для тех, кто не хочет использовать подключаемый модуль, они могут использовать свою веб-версию, перейдя на «gtmetrix.com».

Между тем, вы также можете добавить интерактивную закладку GTmetrix в свой Firefox, Chrome, Сафариили браузеры Internet Explorer.

Важность оптимизированных элементов GTmetrix (PageSpeed ​​и YSlow):

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

Исследования показали, что пользователи не потерпят время загрузки более 4 секунд. Если ваш сайт не реагирует быстро и не загружается оперативно, пользователи покинут его. В контексте SEO Google упоминает использование показателя PageSpeed ​​в своем алгоритме ранжирования. Другими словами, ваш сайт может подняться в рейтинге, если вы используете элемент PageSpeed.

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

Обратите внимание: Как ускорить работу сайта WordPress в 2025 году

PageSpeed

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

YSlow

YSlow оценивает веб-страницу на основе одного из трех предопределенных наборов правил или определенного пользователем набора правил.

Ошибки анализа GTmetrix

Ошибки сетевого подключения

Если вы получаете следующие ошибки:

  • «Таймаут чтения»
  • "Сломанная труба"
  • «Сброс подключения одноранговым узлом»

Между нашим сервером и тестовым сервером GTmetrix могут быть проблемы с подключением.

Ошибки состояния сервера

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

  • Ваше веб-приложение, генерирующее страницу, неправильно возвращает код состояния HTTP с ошибкой, но возвращает содержимое страницы, которое не указывает на ошибку.
  • Ваше веб-приложение блокирует доступ GTmetrix к странице. В WordPress это могло быть связано с такими плагинами, как Bad Behavior или Wordfence. В программном обеспечении электронной коммерции доступ часто блокируется на основе IP-адреса.
  • Вы используете обратный прокси, такой как CloudFlare, и он блокирует GTmetrix доступ к странице.

Ошибки сертификата SSL

GTmetrix анализирует только HTTPS-сайты, у которых есть действующий доверенный сертификат SSL. Этот тип ошибок обычно возникает, когда промежуточные сертификаты / сертификаты цепи установлены неправильно.

Ошибки DNS

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

Ваша страница слишком долго загружалась

Максимальное время ожидания загрузки страницы GTmetrix составляет 2 минуты. Наиболее частые причины этой ошибки:

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

URL-адрес не является HTML-страницей

Чтобы убедиться, что ваша страница является HTML-страницей, GTmetrix проверяет заголовок Content-Type на наличие текста / HTML, поскольку GTmetrix анализирует только HTML-страницы.

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

Перенаправление JavaScript или мета-обновление

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

НИКОГДА не ошибаться

Ошибки 404 - это одна из самых важных ошибок, которые необходимо исправить для повышения производительности. Ошибка 404 вызывает ложные запросы и некоторые серьезные проблемы для скорости вашего сайта. Либо вы должны полностью избавиться от них, превратив их в 410 в консоли поиска, либо перенаправить на действующий URL.

Отключить фрагмент корзины WooCommerce AJAX

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

Измените порядок файлов CSS и Javascript в правильном порядке

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

Контактная форма Проблема с Captcha

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

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

Отложить парсинг javascript

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

Метод 1:

function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "java.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load",
downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

Метод 2:

Сократите и объедините CSS и минимизируйте Javascript

Это означает уменьшение объема кодов CSS и Javascript. Чтобы исправить эту ошибку, просто удалите лишние пробелы и описания.

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

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

Использовать кеширование браузера

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

Например, GTmetrix сказал, что «http://…/font/calibri.woff” должно сохраняться в кеше пользователя.

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

ExpiresActive On ExpiresByType шрифт/woff «доступ плюс 1 год» ExpiresDefault «доступ 1 месяц»

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

Коды необходимых данных можно найти здесь:


# Сжатие HTML, CSS, JavaScript, текста, XML и шрифтов
AddOutputFilterByType DEFLATE application / javascript
AddOutputFilterByType DEFLATE application / rss + xml
AddOutputFilterByType DEFLATE application / vnd.ms-fontobject
AddOutputFilterByType DEFLATE application / x-font
AddOutputFilterByType DEFLATE application / x-font-opentype
AddOutputFilterByType DEFLATE application / x-font-otf
AddOutputFilterByType DEFLATE application / x-font-truetype
AddOutputFilterByType DEFLATE application / x-font-ttf
AddOutputFilterByType DEFLATE application / x-javascript
AddOutputFilterByType DEFLATE application / xhtml + xml
AddOutputFilterByType DEFLATE приложения / XML
AddOutputFilterByType DEFLATE font / opentype
AddOutputFilterByType DEFLATE font / otf
AddOutputFilterByType DEFLATE font / ttf
AddOutputFilterByType DEFLATE image / svg + xml
AddOutputFilterByType DEFLATE image / x-icon
AddOutputFilterByType DEFLATE text / css
AddOutputFilterByType DEFLATE text / html
AddOutputFilterByType DEFLATE text / javascript
AddOutputFilterByType DEFLATE text / plain
AddOutputFilterByType DEFLATE text / xml

# Удалите ошибки браузера (требуется только для действительно старых браузеров)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE!no-gzip!gzip-only-text/html
Добавить заголовок Vary User-Agent


## ИСКЛЮЧАЕТ КЭШИНГ ЗАГОЛОВКИ ##

ExpiresActive On
ExpiresByType image/jpg "доступ 1 год"
ExpiresByType image/jpeg "доступ 1 год"
ExpiresByType image/gif "доступ 1 год"
ExpiresByType image/png "доступ 1 год"
ExpiresByType image/svg+xml "access 1 month"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "доступ на 1 год"
ExpiresDefault "доступ 2 дня"

Минимизировать HTML

Это означает уменьшение объема HTML-кодов. Для этого вручную измените коды, как показано ниже:



   



или используйте этот сжатый режим:

Встроенный небольшой JavaScript

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

Включить Keep-Alive

Это относится к поддержанию активности файла между сервером и проводником. Просто поместите следующий код в папку htaccess вашего сайта:

Набор заголовков. Поддержание соединения.

Избегайте плохих запросов

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

Количество запросов

GTmetrix утверждает, что на веб-сайте должно быть не более 87 запросов. Это среднее число, и чем меньше у вас запросов, тем выше производительность.

Вы можете использовать плагин WP-Rocket или Lazy Load, чтобы решить эту проблему. Например, отложенная загрузка опускает атрибуты значений тега изображений и позволяет сайту загружаться полностью, а затем снова помещает атрибуты значений изображений в их предыдущем порядке. Таким образом, количество запросов во время загрузки будет уменьшено, а коэффициент «Время до первого байта» будет улучшен.

Укажите размеры изображения

Это означает указание значений ширины и высоты изображений на нашем веб-сайте. Лучше указывать значения для наших изображений не только через CSS, но и в HTML, например:

<img src="#link#"
alt мироописание#"
ширина="Y" высота="X" />

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

Легкие способы увеличить скорость вашей страницы

Плагины

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

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

Фотографии

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

Не загружайте изображения большого размера. Например, если ваш блог создан из изображений размером 800*600, вам следует загрузить изображение такого же размера, но не больше.

хостинг

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

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

JS и CSS-файлы

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

Наши предложения по увеличению скорости загрузки вашего сайта:

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

  • Использование WP-Rocket (платно)
  • Использование бесплатного плагина

Использование плагина WP-Rocket (рекомендуется)

Вернуться обратно

  • Прежде всего, мы получаем резервную копию файлов, которые могут измениться.
  • Такие файлы, как изображения и основные файлы темы. Для этого зайдите в панель хостинга в wp-content / uploads / и получите резервную копию указанных файлов.
  • Также получите резервную копию из папки темы и назовите ее. до-minify.zip в каталоге: WP-содержание / темы /

Купите и установите WP Rocket

Первым шагом будет покупка и установка плагина WP Rocket с их сайта.

Примечание: все параметры плагина кеширования (wp-rocket), такие как HTML, CSS Minify, JS Minify, CDN, Cache и Minify, и все, что связано с плагином, должны быть деактивированы, поскольку плагин свежий.

Оптимизация файлов

Перейдите в настройки плагина и на вкладке Оптимизация файлов включите все 3 варианта основных настроек. Как на изображении ниже:

Очистить кэш

Вы должны очистить кеш на вкладке Dashboard.

Получить CSS-контент

Откройте сайт в гостевом режиме браузера, затем нажмите CTRL + U, чтобы отобразить источник сайта. Над HTML есть файл CSS, созданный WP-Rocket, щелкните и откройте файл.

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

Важно: Вы не должны использовать @import в CSS, потому что запрос будет отправлен на другой сайт, и время загрузки увеличится. @import имеет URL-адрес, который вы должны открыть, скопировать его содержимое и поместить в Оптимизацию доставки CSS, а затем удалить @import вместе с его URL-адресом.

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

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

Javascript-файлы

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

Ленивая загрузка

Чтобы использовать LazyLoad для изображения, перейдите на вкладку «Медиа» и настройте его параметры, как показано на изображении ниже:

CDN

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

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

Использование бесплатных плагинов

Загрузить и установить Autoptimize

Перейдите в администраторскую панель WordPress > Настройки > Автооптимизация. Затем нажмите «Показать дополнительные настройки» и действуйте так же, как в этом примере:

Загрузить и установить LazyLoad от WP Rocket

Админ WordPress> Настройки> LazyLoad и включите ленивую загрузку для ваших изображений и видео.

Загрузить и установить Включить сжатие Gzip

Перейдите в админку WordPress > Настройки > сжатие gzip и включите сжатие Gzip.

Загрузить и установить WP Super Cache

Перейдите в админку WordPress > Настройки > WP Super Cache и включите опцию кэширования.

Слайдер революция

Если вы используете плагины Slider Revolution, перейдите в Глобальные настройки и действуйте так же, как в этом примере:

Общие вопросы

Исправить ошибку 404

Если вы видите 404 на веб-сайте GTMetrix на вкладке «Водопад», создайте файл с тем же именем и загрузите его в тот же каталог.

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

МЫ ИСПОЛЬЗУЕМ Плагин WP Smush для оптимизации изображений. Если вы видите, что на веб-сайте GTMetrix на вкладке «Водопад» изображение загружается долго, вам следует использовать следующее решение:

Для оптимизации изображений мы используем бесплатные инструменты, предоставляемые сайтом http://compressjpeg.com/.

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

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

Отключить фрагменты корзины WooCommerce AJAX

  • Файл AJAX WooCommerce занимает много времени загрузки сайта, и чтобы отключить этот AJAX, вы должны использовать плагин Disable Cart Fragments. Вы можете скачать плагин здесь.
  • Если вы используете плагин Polylang вместе с WP Rocket, установите wp-rocket-cache-donotchangepage Также и плагин.
  • Если вы видите Refill, связанный с плагином Contact Form 7 в GTMetrix на вкладке Waterfall, перейдите по следующему адресу:
/wp-content/plugins/contact-form-7/includes/controller.php :: Строка :: 69–71
  • И закомментируйте (отключите) этот код, поместив его между /**/:
/ * если (определено ('WP_CACHE') && WP_CACHE) {$ wpcf7 ['cached'] = 1; } * /
  • Помните, что после каждого выполненного задания необходимо очищать кэш плагина.
  • В конце концов, всегда помните, что после обновления сайта, которое включает добавление новых изображений, подумайте о том, что было объяснено для них выше.
  • После обновления плагинов ваши изменения будут отменены, и вам нужно будет повторять шаги после каждого обновления. Например, плагин Contact Form 7.

Дорис Купер

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