17 эффективных советов по сокращению времени загрузки страницы блога

Представьте себе посещение сайта, каждая страница которого загружается за несколько секунд.

Обидно, не правда ли?

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

Это не способ произвести впечатление на вашу аудиторию.

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

Давайте обсудим, как дать им то, что они хотят.

Почему важна скорость загрузки страницы

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

Сохраняйте больше трафика

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

• Сохранить

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

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

Увеличить конверсию

Знаете ли вы, что задержка загрузки в одну секунду приводит к снижению конверсии на 7 процентов?

Для сравнения: это потеря в 7 долларов каждый раз, когда вы получаете конверсию на 100 долларов.

• Сохранить

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

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

Более высокий рейтинг в поисковых системах

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

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

• Сохранить

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

А пока позвольте мне показать вам следующий шаг к достижению первоклассной производительности блога: измерение фактической скорости загрузки вашего блога.

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

Вы можете думать, что ваш сайт уже работает достаточно быстро, но только такой инструмент, как Google PageSpeed ​​Insights, может это доказать.

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

Чтобы использовать PageSpeed ​​Insights, введите URL-адрес своего блога и нажмите «Анализировать».

• Сохранить

Просто дайте PageSpeed ​​Insights несколько секунд, чтобы творить чудеса.

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

• Сохранить

Вы также можете использовать PageSpeed ​​Insights для повышения эффективности мобильных устройств, переключившись на вкладку «Мобильные устройства» . Инструмент должен немедленно предоставить вам другой отчет, отражающий эффективность вашего блога на смартфонах и планшетах.

• Сохранить

Уже нашли свои показатели скорости?

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

Ваша цель проста: выполнить столько оптимизаций, сколько необходимо, чтобы достичь «быстрого» конца шкалы оценок скорости.

Позвольте мне показать вам, о чем я говорю.

• Сохранить

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

• Сохранить

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

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

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

Готовы сделать следующий шаг? Тогда перейдем к делу.

Как сократить время загрузки блога

Теперь, когда мы рассмотрели « почему » оптимизации скорости загрузки страницы, пора поговорить о том, « как». ”

Если вы знаете кое-что о веб-разработке, выполнение рекомендаций, показанных в PageSpeed ​​Insights, должно стать трамплином для вашей кампании по оптимизации производительности. Вы сможете найти их прямо под разделом « Лабораторные данные ».

• Сохранить

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

Без лишних слов, вот проверенные шаги по созданию гораздо более быстрого и прибыльного блога:

1. Удалите ненужные плагины.

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

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

• Сохранить

Поговорим об удобстве.

Однако использование плагинов может быть палкой о двух концах.

Вы не можете просто загрузить на свой сайт столько плагинов, сколько захотите.

Слишком много плагинов на одной странице может съесть ресурсы сервера и замедлить сканирование вашего сайта.

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

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

К сожалению, это не так.

Просто взгляните на множество конструкторов форм, которые я могу втиснуть в свою панель управления WordPress:

• Сохранить

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

Для этого разверните меню «Плагины» на панели инструментов и перейдите в «Установленные плагины». Оттуда выберите все плагины, которые вам не нужны, и примените команды «Деактивировать» или «Удалить» из раскрывающегося меню «Массовые действия».

• Сохранить

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

Вы можете избежать этого, устанавливая по одному плагину за раз, избегая « непроверенных » плагинов.

• Сохранить

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

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

2. Ищите плагины, которые делают больше

Пока мы говорим о плагинах, давайте вкратце расскажем о выборе плагинов.

В WordPress чем меньше плагинов, тем лучше.

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

Например, вместо того, чтобы использовать отдельные плагины для контактных форм, звездных оценок, обзоров и дизайна целевой страницы, просто используйте плагин, такой как Elementor Page Builder, который объединяет все эти функции в одну.

• Сохранить

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

3. Обновите свой хостинг-план

Новым блогерам действительно трудно устоять перед тарифным планом хостинга за один доллар для вашего сайта.

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

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

«Если вы серьезно относитесь к ведению блога, ваш веб-сайт заслуживает чего-то лучшего, чем самый дешевый тарифный план». - Анкит Сингла

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

• BlueHost
• HostGator
• SiteGround
• WPXHosting

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

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

• Сохранить

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

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

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

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

4. Выберите лучшую тему.

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

Пользователи WordPress должны сразу понять, о чем я говорю.

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

• Сохранить

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

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

• Сохранить

Дочерние темы Genesis от Studiopress - одни из моих любимых тем для WordPress. Они предлагают десятки минималистичных, удобных для мобильных устройств тем, которые также совместимы с редактором Gutenberg , который является редактором контента по умолчанию для WordPress версии 5.0 и новее.

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

Чтобы узнать больше о темах Genesis и их преимуществах, вам обязательно стоит ознакомиться с этим обзором.

5. Оптимизируйте свои изображения

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

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

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

• Сохранить

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

Не забудьте установить режим сжатия «Без потерь », чтобы конечные изображения не выглядели размытыми.

• Сохранить

Для блоггеров, работающих самостоятельно, вы можете увеличить скорость WordPress с помощью такого плагина, как WP Smush, чтобы сжать все изображения в медиатеке за один раз. Чтобы начать, просто нажмите «Smush» на панели инструментов и «Bulk Smush Now» .

• Сохранить

WP Smush также дает вам возможность автоматически сжимать изображения, как только они загружаются. Чтобы включить эту функцию, включите «Автоматическое сглаживание» в разделе «Настройки» интерфейса плагина.

• Сохранить

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

• Сохранить

6. Отключите горячее связывание.

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

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

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

Вот почему хотлинкинг также часто называют кражей полосы пропускания .

Вы можете раз и навсегда остановить хотлинкинг, добавив следующий код в свой «.htaccess файл»:

gzip дальше;

gzip_disable «msie6»;

gzip_vary on;

gzip_proxied любой;

gzip_comp_level 6;

gzip_buffers 16 8k;

gzip_http_version 1.1;

приложение gzip_types / приложение javascript / приложение rss + xml / приложение vnd.ms-fontobject / приложение x-font / приложение x-font-opentype / приложение x-font-otf / приложение x-font-truetype / приложение x-font-ttf / x-javascript application / xhtml + xml application / xml font / opentype font / otf font / ttf image / svg + xml image / x-icon text / css text / javascript text / plain text / xml;

Для тех, кто не знает, где найти файл .htaccess своего веб-сайта, его можно найти на панели управления учетной записи хостинга.

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

• Сохранить

7. Инвестируйте в CDN

Готово к сжатию изображений и предотвращению хотлинкинга?

Хороший.

Что, если бы я сказал вам, что есть способ заставить ваши изображения загружаться еще быстрее?

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

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

• Сохранить

Как и в случае с веб-хостингами, вы должны быть осторожны при выборе CDN для своего блога.

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

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

8. Сократите свои коды

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

Такие коды, как HTML, CSS и JavaScript, также могут влиять на размер ваших веб-страниц.

Исправление? Сократите их, удалив в коде все ненужные символы, такие как пробелы, лишние строки и комментарии.

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

• Сохранить

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

Успокоиться.

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

Например, Minify Code - это бесплатный инструмент, который может обрезать ваши коды за секунды. Он работает с любыми файлами JavaScript, CSS и HTML, которые могут быть на вашем сайте.

• Сохранить

Если вы используете WordPress, альтернативой является использование такого плагина, как W3 Total Cache, который может одним махом уменьшить ваши ресурсы кода.

После установки нажмите «Производительность» на главной панели инструментов и нажмите «Свернуть», чтобы просмотреть свои параметры.

• Сохранить

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

• Настройки минимизации HTML
• Настройки JS minify
• Параметры минимизации CSS

• Сохранить

Прочтите это руководство по W3 Total Cache, чтобы узнать обо всех оптимальных настройках.

9. Избегайте ресурсов, блокирующих рендеринг

Поскольку мы говорим о кодах, давайте углубимся в более сложные вещи.

Если вы запустили PageSpeed ​​Insights и вам сказали «устранить ресурсы, блокирующие рендеринг», вам, возможно, придется запачкать руки написанием кода, чтобы максимизировать производительность вашего блога.

• Сохранить

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

Ресурсы, блокирующие рендеринг, могут быть таблицами стилей, импортом HTML и различными скриптами. PageSpeed ​​Insights должен предоставить вам полный список этих кодов:

• Сохранить

Чтобы справиться с ресурсами, блокирующими рендеринг, проще всего переместить JavaScript в нижнюю часть HTML-кода вашего веб-сайта - прямо перед закрывающим тегом «</body>».

Вы также можете использовать атрибут «defer», чтобы сценарий загружался только после полной загрузки HTML. Это можно сделать, вставив defer = ”defer” в тег “<script>”.

• Сохранить

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

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

• Сохранить

10. Уменьшите количество сообщений на главной странице.

Теперь давайте поговорим о количестве сообщений, отображаемых на вашей домашней странице.

CMS, такие как WordPress и платформы публикации блогов, часто имеют множество тем, которые демонстрируют сообщения блога с самого начала.

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

Я лично показываю на своей домашней странице только четыре сообщения:

• Сохранить

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

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

Поскольку параметры, которые вам нужно настроить для этого, варьируются от платформы к платформе, давайте просто посмотрим, как это делается в WordPress.

На главной панели управления нажмите «Настройки» и перейдите в раздел «Чтение» .

• Сохранить

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

• Сохранить

11. Не заваливайте читателей рекламой

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

Однако реклама часто не работает.

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

• Сохранить

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

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

• Сохранить

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

Как вы зарабатываете на партнерском маркетинге?

Хороший вопрос.

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

12. Очистите свой сервер

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

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

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

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

• Сохранить

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

• Переместить резервные копии на локальный диск
  Старые веб-сайты, как правило, имеют гигабайты резервных копий, хранящихся на их сервере. Загрузка их на локальный диск и удаление с сервера - отличный способ освободить место.
• Удалить неактивные учетные записи
  Если у вас есть неактивные учетные записи в вашем тарифном плане хостинга, удалите их навсегда, чтобы сэкономить много места на диске. Поскольку это необратимый процесс, перед удалением рассмотрите возможность создания локальной резервной копии учетной записи.
• Удалить файлы .TMP
  Платформа вашего веб-сайта или CMS могут создавать временные файлы из таких задач, как обновление плагинов и отслеживание данных сеанса. Их удаление должно быть безопасным, но также не повредит создать автономную резервную копию вашей папки «tmp» в целях безопасности.

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

13. Включите кеширование веб-сайтов.

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

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

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

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

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

## СРОК КЭШЕНИЯ ##

<IfModule mod_expires.c>

ExpiresActive On

ExpiresByType image / jpg «доступ на 1 год»

ExpiresByType image / jpeg «доступ на 1 год»

ExpiresByType image / gif «доступ на 1 год»

ExpiresByType image / png «доступ на 1 год»

ExpiresByType text / css «доступ на 1 месяц»

ExpiresByType text / html «доступ на 1 месяц»

Приложение ExpiresByType / pdf «доступ на 1 месяц»

ExpiresByType text / x-javascript «доступ на 1 месяц»

Приложение ExpiresByType / x-shockwave-flash «доступ на 1 месяц»

ExpiresByType изображение / значок x «доступ на 1 год»

ExpiresDefault «доступ на 1 месяц»

</IfModule>

## СРОК КЭШЕНИЯ ##

При желании вы можете установить разные временные ограничения до истечения срока действия определенных кешей. Например, если вы хотите сократить срок хранения кэшей изображений PNG до 1 месяца, просто измените строку «ExpiresByType image / png» на:

ExpiresByType image / png «доступ на 1 месяц »

Опять же, пользователи WordPress могут использовать инструменты, чтобы упростить эту стратегию оптимизации. Фактически, мы уже рассмотрели тот самый плагин, который вам нужен - W3 Total Cache.

Возвращаясь к подменит «Performance» с вашего WordPress приборной панели, над головой «Page Cache» галочка «кэш сообщения страница» флажок.

• Сохранить

14. Используйте сжатие GZIP.

Прежде чем закрыть W3 Total Cache и перейти к последним оставшимся стратегиям в этом руководстве, вам нужно сделать еще одну вещь.

В подменю «Производительность» перейдите к «Кэш браузера» и установите флажок «Включить сжатие HTTP (gzip)» .

• Сохранить

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

Если вы не используете WordPress или любую другую платформу, которая имеет надстройки, связанные с GZIP, вам необходимо включить ее традиционным способом: изменив файл .htaccess вашего веб-сайта .

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

Идите - скопируйте и вставьте.

Серверы Apache

<IfModule mod_deflate.c>

# Сжатие 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 application / xml

AddOutputFilterByType DEFLATE font / opentype

AddOutputFilterByType DEFLATE font / otf

AddOutputFilterByType DEFLATE font / ttf

AddOutputFilterByType DEFLATE image / svg + xml

AddOutputFilterByType DEFLATE изображение / значок x

AddOutputFilterByType DEFLATE text / css

AddOutputFilterByType DEFLATE text / html

AddOutputFilterByType DEFLATE текст / javascript

AddOutputFilterByType DEFLATE текст / простой

AddOutputFilterByType DEFLATE текст / xml

# Удалить ошибки браузера (требуется только для действительно старых браузеров)

BrowserMatch ^ Mozilla / 4 gzip-only-text / html

BrowserMatch ^ Mozilla / 4 \ .0 [678] no-gzip

BrowserMatch \ bMSIE! No-gzip! Gzip-only-text / html

Добавление заголовка Варьируется User-Agent

</IfModule>

Серверы NGINX

gzip дальше;

gzip_disable «msie6»;

gzip_vary on;

gzip_proxied любой;

gzip_comp_level 6;

gzip_buffers 16 8k;

gzip_http_version 1.1;

приложение gzip_types / приложение javascript / приложение rss + xml / приложение vnd.ms-fontobject / приложение x-font / приложение x-font-opentype / приложение x-font-otf / приложение x-font-truetype / приложение x-font-ttf / x-javascript application / xhtml + xml application / xml font / opentype font / otf font / ttf image / svg + xml image / x-icon text / css text / javascript text / plain text / xml;

Помните, что пользователям NGINX необходимо вставить код в файл «.conf», чтобы реализовать GZIP.

Тестирование сжатия GZIP

Если вы включили сжатие GZIP вручную, используйте такой инструмент, как GZIP Compression Test от GiftOfSpeed, чтобы проверить успешную реализацию.

Как и в случае с PageSpeed ​​Insights, единственный шаг при использовании теста сжатия GZIP - это ввести URL-адрес своего веб-сайта и нажать кнопку «Проверить» .

• Сохранить

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

• Сохранить

15. Оптимизируйте базу данных своего веб-сайта

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

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

Что такое таблицы базы данных MySQL?

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

Вот как выглядит база данных MySQL:

• Сохранить

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

Чтобы избавиться от загромождения базы данных MySQL, можно использовать встроенный инструмент оптимизации таблиц на панели управления учетной записи хостинга.

В SiteGround, например, есть команда «Оптимизировать таблицы» из раскрывающегося меню «С выбранным:» .

• Сохранить

Эти параметры можно найти в инструменте «phpMyAdmin», который должен находиться в разделе «Базы данных» вашей панели управления.

• Сохранить

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

Беспокоитесь, что вы можете что-то испортить на своем сервере?

С помощью плагина WordPress, такого как WP-Sweep, вы можете оптимизировать таблицы базы данных из интерфейса CMS. После установки и активации плагина перейдите в «Инструменты» и нажмите «Очистить», чтобы просмотреть таблицы базы данных, найденные на вашем сайте.

• Сохранить

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

• Сохранить

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

16. Оптимизируйте комментарии пользователей

Что касается комментариев, то в блогах WordPress также есть удобная функция, которая может мгновенно загружать фото профиля комментатора через сервис Gravatar или Global Recognized Avatar .

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

Чтобы сделать то же самое, перейдите в «Настройки» и нажмите «Обсуждение». Найдите параметр «Показать аватары» под разделом «Отображение аватаров» и отмените выбор.

• Сохранить

Если вы хотите сохранить граватары, но вам не нравится их влияние на скорость загрузки, вы можете использовать такой плагин, как BJ Lazy Load, чтобы аватары загружались после критических ресурсов веб-сайта - процесс, известный как ленивая загрузка .

Помимо аватаров, вы также можете включить отложенную загрузку миниатюр сообщений, изображений, окон iframe и других типов контента. Вам просто нужно перейти в «Настройки», выбрать «BJ Lazy Load» и выбрать «Да» для тех опций, которые вы хотите использовать.

• Сохранить

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

Чтобы использовать разбиение на страницы, просто вернитесь на страницу настроек «Обсуждение» и включите параметр «Разбивать комментарии на страницы с X комментариями верхнего уровня на странице».

• Сохранить

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

17. Сосредоточьтесь на оптимизации на ваших самых популярных страницах

Прежде чем мы закончим этот пост, вот еще один последний совет:

Начните оптимизировать производительность ваших самых популярных страниц .

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

Google Analytics - еще один бесплатный инструмент, который поможет вам определить самые популярные страницы. Просто разверните подменю «Поведение» и нажмите «Обзор» .

Ваши 10 самых популярных страниц должны быть видны в разделе «Страница».

• Сохранить

Легко, правда?

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

Вывод

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

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

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

• Сохранить