Как включить сжатие gzip на сайте?

Здравствуйте, читатели нашего сайта Cash-Space, посвященного получению дохода в интернете. В этой статье, сегодня я расскажу о том, как работает сжатие gzip и как можно включить его на веб-сайте с платформой WordPress. И так начнем наш обзор.

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

Последнее в свою очередь называется «отказом». А при высоком проценте отказов в карму сайта добавится ещё один минус. И тогда не светит Вам никакой ТОП выдачи поисковых систем. Чтобы решить этот вопрос, мы включим сжатие gzip передаваемых данных нашего сайта на CMS WordPress.

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

Перед тем как включить сжатие gzip, Вы можете предварительно проверить скорость загрузки своего сайта. Для проверки скорости загрузки сайта я рекомендую воспользоваться специальным онлайн-сервисом PageSpeed Insights от Google, который находится по адресу

[code]http://developers.google.com/speed/pagespeed/insights[/code]

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

Динамическое сжатие gzip передаваемых данных на сайте WordPress

Под динамическим gzip сжатием передаваемых данных имеется в виду процесс, при котором web-сервер архивирует(сжимает) те данные, которые запросил пользователь. После этого эти данные отправляются пользователю. Браузер пользователя распаковывает эти сжатые данные и предъявляет их на обозрение конечного пользователя.

Таким образом, по Глобальной сети передаются много меньшие объемы данных. Минус такого динамического сжатия в том, что повышается нагрузка на web-сервер, которому приходится архивировать передаваемые данные. Плюс динамического сжатия gzip состоит в том, что администратору сайта ничего делать не нужно: архивация происходит автоматически.

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

Среди всех перепробованных я не нашел тот, который бы заработал. Плюнув на это дело, я воспользовался услугами плагина под названием Hyper Cache. В настройках данного плагина необходимо выставить галочку напротив пункта On-the-Fly compression, которая и отвечает за динамическое gzip сжатие передаваемых данных.

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

[code]http://www.whatsmyip.org/http-compression-test/[/code]

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

Статистическое сжатие gzip сайта на WordPress

Динамическое сжатие gzip подразумевает то, что web-сервер сам архивирует и отправляет данные конечному пользователю. Необходимость сжатия передаваемых данных web-сервером можно убрать, если архивировать файлы вручную. Поэтому мы будем сжимать некоторые файлы формата .js и .css(скрипты java и css-стили).

Какие файлы сжимать — это Ваш выбор. Я же посоветую как минимум сжать те файлы, которые указаны в PageSpeed Insights в соответствующем узле. Там же кстати указаны и адреса этих файлов на web-сервере. Ну а как максимум, Вы можете сжать абсолютно все файлы .js и .css. Стоит отметить, что тут говорится только про архивирование статических файлов. Кроме этого, для улучшения быстродействия сайта, Вы можете сократить JavaScript и сократить css-стили, удалив из них ненужные элементы и закодировав их.

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

[code]<IfModule mod_rewrite.c> RewriteEngine On RewriteCond %{HTTP:Accept-encoding} !gzip [OR] RewriteCond %{HTTP_USER_AGENT} Konqueror RewriteRule ^(.*)\.(css|js)$ $1.nogzip.$2 [QSA,L] </IfModule> <IfModule mod_headers.c> Header append Vary User-Agent <FilesMatch.*\.(js|css)$> Header set Content-Encoding: gzip Header set Cache-control: private </FilesMatch> <FilesMatch.*\.nogzip\.(js|css)$> Header unset Content-Encoding </FilesMatch> </IfModule>[/code]

Данный код должен быть размещен до строки

[code]# END WordPress[/code]

Данная директива разрешает передачу сжатых gizp файлов. Теперь же нам остается только создать эти сжатые файлы. Для этого скачиваем на компьютер потенциальную жертву(скрипт или стиль). Советую начать с файла style.css, который находится в папке public_html/wp_content/themes/Ваша_тема/. Скачав на компьютер данный файл, Вам нужно будет заархивировать его с использованием программы 7-Zip. Перед добавлением к архиву необходимо убедиться в том, что у Вас выставлены следующие настройки:

Убедившись в этом, создайте архив. После этого у Вас будут два файла: style.css и style.css.gs. Вам необходимо изменить название файла style.css на style.nogzip.css. А вот с названия файла style.css.gs необходимо стереть последние три символа .gs, чтобы получился файл style.css.

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

Ну а пользователи, у которых браузер не поддерживает архивацию, получат оригинальный файл style.nogzip.css, который весит больше архива. Ну, а так как большинство современных браузеров поддерживают архивацию, то на деле мы получим более быструю передачу файла конечному пользователю — то, чего мы и добиваемся. Таким же способом Вы можете заархивировать все файлы .js и .css, что убьет необходимость их архивации web-сервером.

UPDATE: Уже после написания данной статьи, я нашел код, с помощью которого можно немного облегчить процесс статического gzip сжатия скриптов и стилей. Для этого Вам необходимо всё в тот же файл .htaccess добавить следующий код:

[code] ### 1. Обработка js-файлов <FilesMatch «\.js.gz$«> ForceType text/javascript Header set Content-Encoding: gzip </FilesMatch> <FilesMatch «\.js$„> RewriteEngine On RewriteCond %{HTTP_USER_AGENT} !“.*Safari.*» RewriteCond %{HTTP:Accept-Encoding} gzip RewriteCond %{REQUEST_FILENAME}.gz -f RewriteRule (.*)\.js$ $1\.js.gz [L] ForceType text/javascript </FilesMatch>

### 2. Обработка css-файлов <FilesMatch «\.css.gz$«> ForceType text/css Header set Content-Encoding: gzip </FilesMatch> <FilesMatch «\.css$„> RewriteEngine On RewriteCond %{HTTP_USER_AGENT} !“.*Safari.*» RewriteCond %{HTTP:Accept-Encoding} gzip RewriteCond %{REQUEST_FILENAME}.gz -f RewriteRule (.*)\.css$ $1\.css.gz [L] ForceType text/css </FilesMatch>[/code]

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

Более подробно про этот способ написано в статье статическое и динамическое сжатие передаваемых данных.

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

На этой скромной ноте я завершаю свою статью. В следующих статьях я расскажу Вам. Какими еще способами можно заработать. Так что подписывайтесь на мой блог и наш канал на Яндекс.Дзен, также на мой Телеграмм канал, ну и за одно поставьте лайк (палец вверх) за труды. Если у Вас возникают какие-то вопросы. Или Вы хотите что-нибудь добавить, напишите об этом в комментариях. Я с радостью отвечу на все Ваши комментарии!