Home arrow PHP arrow Page 4 - Speed up Web Page Loading Using Google Page Speed

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:
  1. Speed up Web Page Loading Using Google Page Speed
  2. Introduction to Google Page Speed
  3. Page Loading Improvement Case Study
  4. GZIP Compression for CSS Files
  5. Optimizing the Order of JavaScript and CSS
By: Codex-M
Rating: starstarstarstarstar / 6
February 01, 2010

print this article
SEARCH DEV SHED

TOOLS YOU CAN USE

advertisement

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:  

<link rel="stylesheet" href="http://www.php-developer.org/wp-content/themes/arras-theme.1.3.5/css/styles/default.css" type="text/css" media="screen" / 

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:

 

<link rel="stylesheet" href="http://www.php-developer.org/wp-content/themes/arras-theme.1.3.5/css/styles/default.php" type="text/css" media="screen" />

 

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: 

 

You can perform the same process with the rest of your heavy CSS files; the same concept can even be applied to JavaScript.



 
 
>>> More PHP Articles          >>> More By Codex-M
 

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort
   

PHP ARTICLES

- Hackers Compromise PHP Sites to Launch Attac...
- Red Hat, Zend Form OpenShift PaaS Alliance
- PHP IDE News
- BCD, Zend Extend PHP Partnership
- PHP FAQ Highlight
- PHP Creator Didn't Set Out to Create a Langu...
- PHP Trends Revealed in Zend Study
- PHP: Best Methods for Running Scheduled Jobs
- PHP Array Functions: array_change_key_case
- PHP array_combine Function
- PHP array_chunk Function
- PHP Closures as View Helpers: Lazy-Loading F...
- Using PHP Closures as View Helpers
- PHP File and Operating System Program Execut...
- PHP: Effects of Wrapping Code in Class Const...

Developer Shed Affiliates

 


Dev Shed Tutorial Topics: