Доброго всем времени суток! В сегодняшнем посте я хочу рассказать о том, как проверить скорость загрузки страниц сайта, и какую она играет роль в развитии и продвижении вашего web-сайта. Главные поисковые системы Yandex и Google учитывают такой параметр, как скорость загрузки сайта при ранжировании его страниц в поисковой выдаче. Медленному блогу достанутся более низкие позиции.
Как известно, медленная загрузка сайта не по душе и посетителям. А от поведения посетителей зависят поведенческие факторы. Если они будут просматривать меньше постов, это повлечет за собой ухудшения такого параметра, как глубина просмотра. Ухудшится показатель отказов, поскольку люди будут меньше времени проводить на сайте. А снижение поведенческих факторов приведет к тому, что если конкурент, при одинаковых других параметрах, имеет лучшую скорость загрузки, он поднимется выше вашего сайта в выдаче.
Список онлайн сервисов для проверки скорости загрузки сайта, который будет приведен ниже, поможет вам, не только узнать с какой скоростью грузится ваш сайт, но и подскажет, какие следует сделать улучшения на сайте для его ускорения.
Дополнительно проанализируйте свой сайт плагином Plugin Performance Profiler и узнайте, какие установленные дополнения создают большую нагрузку и возможно от них стоит отказаться. Вот ссылка на статью https://inetsovety.ru/blog-na-wordpress-dolgo-gruzitsya/
Проверка скорости загрузки сайта с помощью онлайн сервисов
Чтобы запустить анализ вашего сайта, введите его адрес в специальное поле, и подождите несколько секунд.
По окончании проверки, Вы увидите 4 основных параметра: оценку скорости (сколько из 100 возможных балов получил ваш сайт); сколько запросов было сделано к базе данных; за сколько секунд ваш блог загружается; размер в мегабайтах анализируемой страницы.
Ниже, на вкладке Waterfall будет приведен весь список запросов. В списке будут файлы скриптов, картинок, CSS и прочих файлов. Вы можете определить, какие картинки чересчур большие и тормозят загрузку сайта. В моем случае это шапка. Также подгружался файл нестандартного шрифта весом более 500 кб., заменив шрифт на стандартный и удалив этот файл, мне удалось уменьшить размер загружаемой страницы на пол мегабайта.
В отличии от предыдущего сервиса, этот на русском. Полный отчет о проверке отсылают на почту. Для этого введите свой имейл в специальную форму.
Сразу после проверки вам также покажут время загрузки, размер страницы, а также по разделам укажут, что требует оптимизации. В моем случае сервис рекомендует сократить количество загружаемых файлов, уменьшить число CSS- и JS-файлов, и оптимизировать изображения. Значки и иконки, которых у меня в шаблоне не мало, можно объединить в CSS спрайт, который будет грузиться одним файлом. Красочный шаблон - это красиво, но он сильно влияет на скорость загрузки.
Как можно ускорить загрузку сайта на WordPress
Как Вы уже заметили, что украшения блога, не оптимизированные изображения, дополнительный функционал, скрипты приводят к снижению скорости сайта. При разработке технического задания дизайна сайта, следует на этом акцентировать внимание дизайнера и программиста.
По возможности реализовывать те или иные украшения с помощью CSS, а не картинками. Не так давно я нашла отличный сервис оптимизации изображений .
С его помощью мне удалось сжать размер шапки в 3 раза! До этого эта красочная шапка весила 353 Кб. Все изображения, которые я добавляю в свои посты, я предварительно сжимаю в фотошопе. У каждого поста есть миниатюра 200*200. Так вот, я не загружаю картинок 500*500 или других размеров, а скажу же сжимаю в Фотошопе исходную картинку до нужного мне размера. Подробную инструкцию смотрите в статье "Как изменить размер картинки без потери качества". Если я добавляю в статью скрин, то его также подгоняю под размер контентной колонки, а если есть возможность, обрезаю лишнее на нем.
Включение кэш браузера и Gzip сжатия файлов
Технически можно добавить ряд фишек для ускорения сайта. Одна из таких фишек – включение кэша браузера на стороне пользователя. Это означает, что на компьютере вашего посетителя будут сохраняться такие статические файлы, как изображения, скрипты, которые при последующем заходе не будут заново загружаться с хостинга, а подгрузятся из кэша браузера. При первом заходе пользователь не заметит никакого ускорения, а вот при последующих переходах ваши страницы будут летать быстрее.
Чтобы включить кэш браузера нужно в файл .htaccess прописать вот такой код:
# Кэш в браузерах посетителей FileETag MTime Size <ifmodule mod_expires.c> <filesmatch ".(jpg|jpeg|gif|png|ico|css|js)$"> ExpiresActive on ExpiresDefault "access plus 1 year" </filesmatch> </ifmodule>
Еще одна фишка для ускорения загрузки сайта - Gzip сжатие для Js, Html и Css. В тот же файл .htaccess добавляется небольшой код. Gzip сжатие работает следующим образом: при загрузке сайта на сервере хостинга происходит архивирование (сжатие) всех файлов, необходимых для передачи и корректного отображения информации у пользователя. А в браузере посетителя происходит обратный процесс – разархивирование этих файлов. Все это происходит в считанные секунды и для вас этот процесс не заметен.
Но у Gzip сжатия есть существенный минус – увеличение нагрузки на сервер хостера. При хорошей посещаемости, слабый хостинг просто ляжет. Так как его процессор не сможет одновременно выполнить много операций по архивированию передаваемых файлов.
Последите несколько дней, как изменилась нагрузка на хостинг, если она превышает допустимую хостером нагрузку, выхода два: сменить тарифный план или хостинг провайдера, или отключить Gzip сжатие.
Вот код для включения Gzip сжатия, который был у меня в .htaccess:
# Сжатие данных Gzip <IfModule mod_deflate.c> AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/javascript text/css application/x-javascript BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4.0[678] no-gzip BrowserMatch bMSIE !no-gzip !gzip-only-text/html <ifmodule mod_gzip.c> mod_gzip_on Yes mod_gzip_item_include file \.js$ mod_gzip_item_include file \.css$ </ifmodule> </IfModule>
Возможно эти коды не всем помогут включить кэширование и Gzip сжатие, тогда вам придется поискать альтернативы.
Чтобы оптимизировать коды и скрипты, которые замедляют загрузку сайта, нужно обращаться в веб-программистам. В некоторых случаях, следует убрать из шапки коды, которые сразу же после открытия страницы начинают подгружать скрипты, а не содержимое сайта. Еще есть сервисы, которые помогают сократить CSS и Java Script файлы. Например в файле CSS можно сократить число строк, прописав все стили в одну строчку. Безусловно, для редактирования и внесения изменений в стили, такой файл станет не удобным.
Это лишь некоторые меры, которые помогут ускорить блог на WordPress. Кто желает, может самостоятельно продолжить изучать тему ускорения сайта, или же обратиться к фрилансерам программистам, которые хорошо знают свое дело, и сделают работу за несколько часов. В то время, как попытки настроить все самостоятельно займут у многих дни.
На этом у меня все, до встречи!
Почему то сервис sitespeed зависает, или это он так долго анализирует?
Для оптимизации сайта на WordPress и очистки кэша я использую плагин под названием «Autoptimize». С помощью данного плагина можно не только очистить кэш, но и оптимизировать JavaScript, html и код css, достаточно просто в настройках плагина проставить галочки напротив необходимого пункта и нажать сохранить и на этом всё. С другой стороны этот плагин не ко всем темам (шаблонам) Вордпресс подойдет, потому что есть темы, которые уже оптимизированы изначально как например тема «Basic» от WP-Puzzle и если вкупе с ней запустить этот плагин, о котором я написал выше, а точнее пункт по оптимизации JavaScript, то тогда перестанет работать всплывающая форма авторизации от другого плагина. )))
В целом — да, лучше использовать поменьше плагинов, потому что перебор еще ни к чему хорошему и никогда не приводил. Но если владелец интернет-ресурса смутно представляет куда и что надо вносить, то лучше не рисковать. Имхо.
Тоже стараюсь следить за скоростью загрузки страниц сайта. Но я привык использовать сервис от гугл — pageSpeedInsight. Он показывает скорость загрузки как на ПК так и на мобильной версии в баллах.
Ниже всегда приводятся рекомендации по ускорению загрузки
Я через Pingdom проверяю Uptime сайта. Если он в течении месяца меньше заявленного хостингом, то можно требовать компенсацию. Хотя на Хостпро грех жаловаться. Именно с ним проблем лично у меня ни разу не было.
У вас галочка «подписаться на обновления» слишком низко стоит, сразу не видно. Подавляющее большинство наверно и не подписываются на обновления из за этого
У кого появится интерес к блогу после прочтения статей, тот обязательно подпишется и на подобные мелочи не будет обращать внимания.
Добавил коды в файл .htaccess и никаких изменений в ответах сервисов для проверки не обнаружил. Как думаете, в чем причина?
Возможно дело в хостинге и для него эти коды не подошли. Бывает такое. В данном случае вам следует поискать в сети другие варианты кодов.
Виктория, а может быть такое что эти коды блокируют работу плагина Hyper Cache? Не знаю почему, но кеширование куда-то исчезло с блога, хотя плагин на месте. Пока не могу понять в чем причина
Возможно они конфликтуют с плагином Hyper Cache. У меня Hyper Cache не стоит не на одном сайте, поэтому не могу ничего сказать из своего опыта.
Я пока не буду пробовать что-то менять. Как сменю шаблон буду более детально настраивать, потом отпишусь чего из этого вышло, происходит конфликт или проблема еще где. Мож кому полезно будет
Если сайт грузится достаточно быстро, то не стоит заморачиваться по этому поводу. А если с загрузкой есть проблема, то стоит попробовать различные варианты или обратиться к специалистам.
По умолчанию после установки браузера кэш и так включён, Если пользователь выключил кэш, включение кэша помимо воли пользователя не будет рассматриваться как противозаконное действие?
Вот это статья так статья, Вы как будто знали что мне сейчас нужно. Виктория, а у Вас нет статьи о том, как оптимизировать изображения без потери качества. Сделал шапку с подвалом, пробовал через фотошоп уменьшить размер, качество страдает сильно….а скорость от размера зависит напрямую, не так ли?
Блин, не дочитал статью а написал комментарий….уже увидел, сейчас попробую уменьшить через сервис и отпишусь о результатах
Уменьшил шапку на 16%, не много конечно однако оч полезно, сейчас по другим изображениям пробегусь. Спасибо Виктория
Блин, залил на хостинг, все таки ухудшение качества видно, если присмотреться, как считаете, стоит так делать для шапки или нет?
Если качество сильно пострадало, то может имеет смысл оставить прежнее изображение. Тем более, как вы написали ранее, оно уменьшилось всего на 16%.
Я заметил что страдают надписи, где применялись всякие интересные стили для текста. Остальное изображение не страдает. А 16% это тоже много!
Виталий, дочитывай статьи и комментарии до конца- вдруг найдешь для себя еще что-нибудь интересное и полезное.
Согласен, часто в комментариях находится развяка.
Кто заинтересован, тот прочтёт статью до конца. Насчёт комментариев есть сомнения.
Да многие участники конкурсов, не дочитывают статьи до конца, а скорей бегут писать комментарии)))
Попробуйте сжать изображение сервисом, ссылку на который я давала в статье. Он сжимает получше фотошопа и качество не страдает.
Я именно этим сервисом и сжимал…сначала фотошопом, а потом сервисом. Спасибо, кстати, за него. Сейчас постоянно пользуюсь ним прежде чем залить картинку на хостинг. Даже после крутого сжатия фотошопом сервис сжимает еще минимум на 5% (ато и 15-20), при этом качество вообще не теряется
Я тоже сжимаю изображения именно при помощи этого сервиса. Тоже ним постоянно пользуюсь, так что сделал неплохой выбор.
Виктория, я тоже пользуюсь сервисом по вашей ссылке, спасибо за нее.
Получше Фотошопа? Ну не скажите. Если понимаешь, что делаешь и как нужно делать, то Фотошоп творит чудеса, поэтому внеконкуренции.
В Фотошопе нужно созранять изображения, как оптимизированные для Веб, при это разрешение выставлять до 144 дпи. Иногда достаточно 72 точек. Можно размер в мм уменьшить или в пикселах, при этом связку отключить. Чем меньше будет точек, тем меньше будет вес файла. Если визуально качество не страдает, то все параметры можно уменьшать.
Скорость загрузки сайта действительно очень сильно влияет на поведенческие факторы, я когда заходу на какой-нибудь сайт а он долго грузится, то сразу ухожу на другой. Причиной медленной скорости еще могут быть плагины и медленный хостинг, скажите Виктория а каким хостингом вы пользуетесь?
Если бы только на поведенческие факторы. У гугла нынче этот фактор практически на первых ролях, медленный сайт — прочь из топа!
Ничего себе! За что он так жестоко с нами?
Да гугль вообще жесткий поисковик. Яндекс намного мягче к новичкам относится. С яшей вроде подружился, а гуглю никак угодить не могу
У Гугла есть такое понятие, как средняя иозиция и новым сайтам, если они не явные ГС, он дает возможность на начальных этапах побывать в ТОПе, чтоб для себя определить, насколько сайт интересен пользователям, а потом уже позиции сайта начинают варьироваться. Яндекс вроде как в последнее время тоже вводит так называемый «плавающий ТОП, т.е. понятия ТОП-3 и ТОП-10 уже не актуальны, как таковые — одним пользователям сайт может показываться на первой позиции, другим — на третьей. Позиция сайта зависит от многих факторов и меняется несколько раз в течении для, в зависимости от его попурярности, конкурентности и других факторов.
Сейчас пойду и свой проверю блог на скорость!
Как успехи, Александр?
Я тоже сжимаю фото при загрузке на сайт. И тоже миниатюры делаю. Кстати, скажите, базовые миниатюры от вордпресса не уменьшают вес картинки, если она предположим 800х600 а в заголовке вставлена миниатюра, предположим 100х70
Вордпресс при настройках по умолчанию закидывает на хостинг уже уменьшенные миниатюры. Если меньше размер, соответственно и вес изображения меньше. Я недавно по совету Борисова изменил настройки и закидую на хост только одно изображение, а миниатюры уже подгоняются настройками вывода миниатюр. Нужно будет провести аналитику, так где выводится маленькая миниатюра сколько ей уделяется веса при таком подходе
Для миниатюры предусмотрены стили. Я не всегда ставлю миниатюру. Как ни как, а лишняя нагрузка.
Сейчас поисковики обращают внимание на всё. Сайт долго грузится — ниже в выдачу. Да и для посетителей долгая загрузка не приносит плюсов.
Спасибо за рекомендованные в статье сервисы, заинтересовал вот этот — optimizilla.com. — пойду изучать, так необходимо как можно больше сделать для ускорения загрузки моего блога.
Виктория, в какое место прописать этот код в файл: в файл .htaccess прописать вот такой код
Я прописывала после # BEGIN WordPress