If you have a website with lots of images, javaScript, Flash, video, and CSS, you may have noted a slower than ideal load time. I’ve written before about adding a bit of code to the .htaccess file as cache-control for images, text content, pdf, flash, and video, but the reality is that this may not be enough to provide a page that is quick loading. In this regard, the best option (short of creating a simple, non-graphical website) is using compression. Note that GZIP compression is used on both Google and Yahoo, and is standard on all current browsers.
The Details:
When you set up compression, the browser and server need to know it’s ok to send a zipped file over. The agreement has two parts:
- The browser sends a header telling the server it accepts compressed content (gzip and deflate are two compression schemes): Accept-Encoding: gzip, deflate
- The server sends a response if the content is actually compressed: Content-Encoding: gzip
If the server doesn’t send the content-encoding response header, it means the file is not compressed. The “Accept-encoding” header is a request by the browser, not a demand. If the server doesn’t want to send back compressed content, the browser will present the regular uncompressed content.
Server Settings:
The job is to configure the server so it returns zipped content if the browser can handle it, saving bandwidth and creating faster loading pages.
For IIS, enable compression in the settings.
In Apache, enabling output compression is fairly straightforward. Add the following to your .htaccess file:
# compress text, html, javascript, css, xml: AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript # Or, compress certain file types by extension: <files *.html> SetOutputFilter DEFLATE </files>
Deflate is quick and quite effective (reduced my website size by 70%), so I use it; mod_gzip is another option that is noted to be even faster, but is said to be harder to implement. As noted above, this is done by adding the code to the .htaccess file, but if you can’t change your .htaccess file, there is a PHP option as well to return compressed content. Give your HTML file a .php extension and add this code to the top:
In PHP:
<?php if (substr_count($_SERVER[‘HTTP_ACCEPT_ENCODING’], ‘gzip’)) ob_start(“ob_gzhandler”); else ob_start(); ?>
Verify The Compression:
Once you’ve configured your server, check to make sure you’re actually serving up compressed content.
Online: Use the online gzip test to check whether your page is compressed. You can also use “Webmaster Tools” (IE Addon) or “Live HTTP Headers (Firefox Addon).
Potential Concern:
While compression works in most all browsers, some still may have trouble with compressed content. If your site absolutely must work with Netscape 1.0 on Windows 95, you may not want to use HTTP Compression. Apache mod_deflate has some rules to avoid compression for older browsers.