SEO самостоятельно: Как повлиять на скорость загрузки сайта?

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

Насколько важна скорость работы сайта

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

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

Кстати: оптимизировав страницу регистрации в мобильной версии сайта, Сервис Pinterest смог увеличить конверсию с нее на 40% .

Когда нужно оптимизировать, а когда — и так сойдет?

Задуматься о скорости загрузки сайта целесообразно:

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

Отложить работу по увеличению производительности можно, если:

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

Какие параметры учитывают Яндекс и Гугл?

Яндекс

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

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

Google

Google дает намного больше информации о скорости загрузки:

1. статьи и собственные исследования в справочнике;
2. метрики Core Web Vitals (Отчет об основных жизненных показателях сети);
3. отчет в Google Search Console с основными показателями;
4. сервис PageSpeed Insights для оценки скорости, измерения показателей Core Web Vitals и аналитики данных которые влияют на загрузку.

Как узнать скорость загрузки сайта, не имея специальных навыков

Для определения скорости загрузки можно воспользоваться одним из сервисов: gtmetrix, yellowlab, pingdom.com и т.п.

Вот как выглядит оценка быстродействия на официальном сервисе PSI от Google. Для проверки введите в строку URL страницы и получите полный анализ.

Статистика дается за предыдущие 28 дней. Каждый параметр оценивается отдельно от 0 до 100, потом выводится общий балл. Наглядно оценить изменение показателей и итоговой оценки можно с помощью калькулятора.

После проверки страницы сервис PSI выдает рекомендации в разделах «Оптимизация» и «Диагностика».

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

Также узнать скорость загрузки можно в административной части CMS. Вот так отчет выглядит в Битриксе.

Как увеличить скорость загрузки сайта:

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

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

1. Минимизация нагрузки на сеть

Общий размер всех запрашиваемых документов страницей не должен превышать 1600 КиБ.

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

Иллюстрации отнимают много ресурсов при загрузке сайта. Чтобы избежать проблем, необходимо оптимизировать их, сохранив при этом качество. Сделать корректировку фото и картинок помогут следующие приемы:

• Использование современных форматов изображений. Загружаем изображения в формате webp/avif. Для конвертации можно использовать плагины админок сайтов, кастомный класс на PHP, python, либо утилиту на сервере.

• Добавление атрибутов width и height для изображений в html-разметке. Эти атрибуты используются для ограничения высоты и ширины блоков с картинками.

• Настройка кодировки изображений. Качественно сжать изображения можно с помощью TinyPNG. Либо загрузить картинки через плагин для CMS.

Также следует применить отложенную загрузку скрытых изображений. Так при открытии страницы прогружаться будут только те иллюстрации, которые попадают в зону видимости на экране пользователя. Настроить ленивую загрузку можно с помощью JS библиотек (lazyload, lazysizes, autoload и т.д.).

3. Параметры кэша

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

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

4. Очистка кода

Код страниц должен быть прописан корректно. Лучше если в нем не будет закомментированных кусков, устаревших тегов и конструкций. Это относится как к языкам гипертекстовой разметки — HTML, CSS, так и к языкам программирования JavaScript, PHP и т.д.

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

5. Сжатие текстов

Для быстрой загрузки текстовой информации нужно настроить сжатие данных с помощью утилит gzip, deflate или brotli. Проверить его наличие можно в консоли браузера, найдя заголовок content-encoding, который и указывает на то, какая из технологий используется.

Кроме вышеописанных действий есть еще много способов для увеличения быстродействия сайта:

1. сокращение размера структуры DOM
2. уменьшение использования стороннего кода
3. минимизация работы в основном потоке
4. устранение смещений макета
5. настройка предварительной загрузки ключевых запросов
6. работа с редиректами
7. и т.д.

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

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

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

Искренне ваши,
ребята из Mitup.