Блог Сергея Хожакова

Мой опыт по созданию и раскрутке сайта на WordPress

Продвижение сайта

Ускорение сайта и его проверка на скорость загрузки

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

проверить скорость загрузки сайта

Для чего нужно ускорить сайт?

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

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

Сервисы помогающие проверить скорость загрузки сайта

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

1. Google PageSpeed Insight

проверить скорость загрузки сайта

Здесь вы вводите адрес своего сайта и автоматически получаете оценку от этого ресурса. Оно может быть от нуля до ста баллов. Если ваш сайт набрал 100 балов — это значит, что его скорость идеальна. Конечно, набрать столько ужасно сложно и 85 баллов уже достаточно для того, чтобы перестать беспокоиться о скорости загрузки. Если через какое-то время захотите проверить сайт еще раз, а его оценка изменится — Page Speed быстро развивается. Поэтому проверить скорость загрузки сайта google speed нужно стараться почаще. Но основной плюс в том, что кроме оценки вы получаете рекомендации по улучшению скорости страниц. Он может посоветовать вам уменьшить вес картинок или убрать блокирующие CSS и JS файлы.

2. Sitespeed.me

проверить скорость загрузки сайта

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

3. Whichloadsfaster

проверить скорость загрузки сайта

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

4. Pingdom Tools

проверить скорость загрузки сайта

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

5. WebPage Analyzer

проверить скорость загрузки сайта

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

6. Load Impact

проверить скорость загрузки сайта

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

7. Gtmetrix

проверить скорость загрузки сайта

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

Как заставить свой сайт загружаться быстрее

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

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

  • Займитесь оптимизацией CSS на сайте. Использовать таблицы стилей очень удобно и они есть на каждом портале, но размещать их нужно с умом. Например, если вы используете CMS WordPress и подключаете разные графические плагины, то каждый плагин может сам вставлять в код страницы CSS и JS файлы. А чем больше их количество, тем больше придется сделать запросов браузеру — это плохо влияет на работу ресурса. Поэтому постарайтесь объединить весь CSS-код в один файл. Но даже его можно заставить работать еще быстрее. Для этого в сети есть много различных сервисов и программ, которые уберут из кода все пробелы, сократят цвета, например с «#000000» до «#000»;
  • Оптимизируйте вес всех картинок. Если работаете над порталом с огромным количеством фотографий на страницах, то стоит их сжимать. 100 фотографий на странице с весом в 50 килобайт — это 5 мегабайт будут весить только изображения. Разные фотографии лучше хранить в формате JPG, а не, например, PNG-24. Так вы сэкономите гораздо больше места.проверить скорость загрузки сайта
    Кроме того, если у вас не какая-то онлайн-галерея и пользователям нет особой разницы, то картинку в формате JPG можно еще и сжать. Для этого откройте фото, например, в Adobe Photoshop и сохраните его для «Web и устройств». Там вы сможете настроить качество изображения. Иногда, таким способом получается добиться размера файла, который в пару раз меньше исходного. Если вы захотите проверить скорость загрузки сайта в инструменте от Google, то с огромной вероятностью он сделает акцент на большом размере изображений;
  • Если вы не можете сократить вес картинок, то тогда установите специальный скрипт, который называется LazyLoad. Это очень легко сделать, когда сайт находится на популярной CMS WordPress, достаточно просто установить плагин Lazy Load XT. Суть работы этого скрипта в том, что загружаются только те изображения, которые находятся на экране пользователя. То есть, на веб-странице с огромным количеством фотографий у посетителя будет идти загрузка только тех, которые находятся на поле видимости его компьютера. Это очень удобно, если необходимо сохранить качественные фотографии;
  • Оптимизируйте JS-скрипты. При использовании JavaSript зачастую приходится подключать разные библиотеки для сложных задач. Здесь нужно поступать так же, как и с CSS – объединять и уменьшать. Но будьте осторожны, лучше сохранить себе исходный код таблиц стилей и скриптов на компьютер. Ведь разобраться потом в коде, который просто идет в одну строчку очень сложно. Если вы хотите проверить скорость загрузки сайта, не оптимизируя подключаемые файлы, то вряд ли получите хорошие результаты;
  • Объединяйте всю графику в один спрайт. Так поступают множество крупных компаний. У вас есть некоторое количество разных иконок, кнопочек и логотипов. Все это вы собираете в одну большой файл (только не прям впритык), а потом можете вызывать любую часть изображения через свойство background-position. И вместо кучи запросов к разной графике, компьютер будет делать только один. Для вызова нужной части просто пропишите необходимые координаты;
  • Настройте браузерное кэширование. Когда человек посещает любой веб-сайт, браузер сохранит различные данные на жесткий диск пользователя. Если человек снова зайдет на него, то он уже получит файлы из памяти своего компьютера, а значит и ожидания никакого не будет;
  • Перед тем как размещать какой-либо проект на хостинге, всегда прежде почитайте отзывы об этой компании. Убедитесь, что никаких постоянных падений сервера не будет и не бойтесь задавать свои вопросы службе поддержки. Часто хостинг-компании оказывают огромную помощь своим клиентам. Они могут что-то вам настроить, перенести проект или помочь разобраться с каким-то сложным вопросом. Так как проверить скорость загрузки сайта очень легко, возьмите любой сайт расположенный у хостера и узнайте его скорость.

Плагины для кэширования на WordPress

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

  1. WP Super Cache. Этот плагин будет генерировать HTML копию каждой страницы, вместо того, чтобы каждый раз выполнять PHP-скрипты. HTML страницы будут получать незарегистрированные пользователи и те, кто не оставил ни одного комментария.
  2. W3 Total Cache. Это расширение кэширует все скрипты, таблицы стилей и другие элементы страницы.

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

Подпишитесь на обновления блога

Комментарии (0)

Оставьте свой первый комментарий на блоге и получите в подарок плагин помогающий улучшить поведенческие факторы блога плюс подробную видеоинструкцию к нему