GZIP Compression for CSS Files - PHP

The easiest way to improve your website's conversions may have less to do with SEO and your content and more to do with how fast your pages load. Internet users have a short attention span, and won't wait for your pages to load when the next site is just a click away. Fortunately, you can fix your web page loading times with the help of Google Page Speed.

TABLE OF CONTENTS:

By: Codex-M

Poor Best

Rating:

/ 6

February 01, 2010

print this article

SEARCH DEV SHED

TOOLS YOU CAN USE

To compress CSS files, you need to determine the heaviest CSS files. If you compress them, you save some significant kilobytes in loading. For the test website, default.css is the heaviest. Looking at the source code:

It appears to be located in the css/styles directory. Using your FTP, download and then open it. Copy and paste the code below to the top most part:

<?php

require_once("gzipCSS.php");

After that; save the file now as default.php and upload it back to the same directory from where it was downloaded. Edit the reference of the stylesheet in your header.php to:

The gzip compression code located in gzipCSS.php will be parsed by the server because of default.php, thus compressing the CSS containing it.

The following is the script for gzipCSS.php (copy and paste this to your PHP editor and save as gzipCSS.php):

<?php

//PHP gzip method

ob_start ("ob_gzhandler");

//Header to tell browser what kind of file it is.

header("Content-type: text/css; charset: UTF-8");

//Caching

header("Cache-Control: must-revalidate");

$expires = "Expires: " . gmdate("D, d M Y H:i:s", time() + 3600) . " GMT";

header($expires);

Credits: gzipCSS.PHP script by http://www.devirtuoso.com/2009/07/how-to-compress-cssjavascript-files-with-php/

It starts by loading the PHP GZIP handler, which will do the compression and then tell the browser it is a CSS file. Upload gzipCSS.php to the same directory as default.php, for example: