expires meta tag and GZIP

Levi

Moderator
Staff member
According to both yslow (recommendation on firefox plugins :)) and googles firebug plugin I need to add an 'expires header'. They are also recommending using gzip on my code to reduce the overheads.

Now I understand the reasoning for the expires header (its to help with caching and for searching via the bots etc but can't quite figure how the dates work.

Is it a system where you need to stick a date in and then update manually so say, if you wanted it to 'expire' in 2 weeks you would stick in a date 2 weeks from current date or is there a way of saying expire in 2 weeks without using set dates?

And as my pages are unlikely to change anyway is the correct meta needed the below?
Code:
<meta http-equiv="expires" content="never">
As to gzip, is it really worth it and is there any recommended best practices etc

TA very :)
 
Aww good to pay you back Levi.
Expires meta.
TBH go the .htaccess route.
Right create a .htaccess file, place this code in and upload it to your root directory, this is a plain file and just save it as .htaccess.

In that file place this ~
ExpiresActive On
ExpiresDefault "access plus 10 years"
ExpiresByType image/gif "access plus 2 weeks"
ExpiresByType image/png "access plus 2 weeks"
ExpiresByType image/jpeg "access plus 2 weeks"
ExpiresByType application/x-javascript "access plus 2 weeks"
ExpiresByType text/css "access plus 2 weeks"


Bots no, but browsers yes.

GZIP ~
Change all pages to .php file extentions and then add this to the top of every page ~
<?php ob_start("ob_gzhandler")?>

and that will then compress all CSS, JavaScript files and the html document.

This can cut their sizes down by as much as 66% meaning they take less time to download, less strain on the server and faster page loads.

Jaz
Key:
Red ~ PHP
Blue ~ .htaccess
 
Jazajay said:
Aww good to pay you back Levi.
lol

Expires meta.
TBH go the .htaccess route.
Right create a .htaccess file, place this code in and upload it to your root directory, this is a plain file and just save it as .htaccess.

In that file place this ~
ExpiresActive On
ExpiresDefault "access plus 10 years"
ExpiresByType image/gif "access plus 2 weeks"
ExpiresByType image/png "access plus 2 weeks"
ExpiresByType image/jpeg "access plus 2 weeks"
ExpiresByType application/x-javascript "access plus 2 weeks"
ExpiresByType text/css "access plus 2 weeks"


Bots no, but browsers yes.
iirc I need to play with the htaccess (301 redirects) file anyways so I'll just sling this in while I'm at it cheers

~
Change all pages to .php file extentions and then add this to the top of every page ~
<?php ob_start("ob_gzhandler")?>

and that will then compress all CSS, JavaScript files and the html document.

This can cut their sizes down by as much as 66% meaning they take less time to download, less strain on the server and faster page loads.

Jaz
Key:
Red ~ PHP
Blue ~ .htaccess
will this have any effect on a form using an external php?
 
You just need to place it at the top of the page, it can be in a php include, and it will effect the whole page.
 
Jazajay said:
You just need to place it at the top of the page
I assume you mean where it says the below (after this bit or before it)
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
it can be in a php include
do you mean like I can pull it in in the same way I would the php on a form or something different, I'm no web designer (I dabble with my own site) and php is still very new to me (learning slowly:))?
EDIT: is this what you mean
Code:
include('[URL="http://detectmobilebrowsers.mobi/?dl"]filename.php[/URL]');

Do I need to do anything with the css/js files or are they just left as is?
 
Expire headers are now working a treat ta very much.

The Gzip has worked (I added AddHandler server-parsed .html to .htaccess too after some googling), moved from an F to a C rating on Yslow, but its still saying that 2 files need to be compressed.
Code:
There are 2 plain text components that should be sent compressed[LIST][*]Image Resolutions - Design and Visualisation Service[*]http://imageresolutions.co.uk/GeneratedItems/CSScriptLib.js[/LIST]
I've got the include at the very top of the page before the doctype bit.
Any idea why the above is not compressing?

My intended .htaccess non www to www redirect just messes up access to my site so clearly this is sorted at the name server end of things as they both work properly anyways :)

And I've just noticed an entry called entity tags (etags) is this server side and out of my control?
 
Etag
Place this in your .htaccess file, as the .htaccess file is a file that overrides some of the servers default settings.

FileETag none

That will remove your Etags.

Your CSS, and JavaScript files have to be done differently, they need to be compressed within the actual file.

To do that save both your JavaScript file and your CSS files with the .php extension.
So yourjs.js.php and yourcss.css.php, and then remember to reference it in differently in the HTML document as well as you have basically created a new file.

Then in your CSS files place this at the very top of the page ~
<?php ob_start('ob_gzhandler');header("Content-type: text/css")?>
//Your css rules go here

then at the bottom add this ~
<?php ob_end_flush();?>

What that does is use PHP's compression function to compress the CSS file before it's sent to the browser, it then sets a header to let user agents know that it's not actually a PHP document but instead should be parsed as a CSS file instead, you with me?

Now JavaScript files are slightly different place this at the top ~
<?php ob_start('ob_gzhandler');header("Content-type: application/x-javascript")?>
//Your JavaScript rules go in here

Then at the very bottom of the document we add the flush function to finish it off so ~
<?php ob_end_flush();?>

Again we compress it using PHP and then PHP sets a header to let the browser know it's actually a JavaScript file and to parse it as such.

Jaz
Key:
Blue ~ .htaccess
Red ~ PHP
Orange ~ Comments
 
I know I'm a pain and I appreciate the help :)

I've been googling a lot too since last night which usually raises more questions than answers :(

Can I not just use 7 zip (or similar) to compress the files to a js.gz/css.gz file and link to that file instead?
 
I don't know I don't know what 7 zip is TBH as I use GZIP, I imagine so but that's how I compress mine and that works for me so.....up to you really fella, there are many ways to compress a file TBH. :)
 
7 zip is a program that supports GZIP compression which I'm familiar with :)

Having said that I'm only gaining something like 5Kb (10Kb on revised site), most of it coming from the html code itself, even if I do compress it all so for the css and js files it might not even be worth the hassle :)

I've knocked out all the white space which has saved a few bytes etc without affecting the file.
 
Back
Top