Set Expire Headers In htaccess

A way that Browsers try to help speed up rendering the page is by taking static data and cache it. These are things like images, CSS and JavaScript files. As Browsers are going to cache these bits of data you can actually set an expiry so the Browser will know not to cache these anymore.

The Browser will keep serving these until the date you set.

Images

Mostly on websites an image on the page will never change. By change I mean have the same image URL but use a different image. There may be times that you use a different image with a different URL but this will be a new cache for the Browser.

So if you know that your image isn't ever going to change then you can set the expiry on these items for a long time in the future so the Browser will allows get this data from it's own cache.

CSS And JavaScript Files

CSS files can be cached by the browser, you may even see this when you change the CSS file, refresh your browser and the styles don't change. You go into the CSS file and it has the new styles, so you refresh your browser again and now the new styles are coming through.

This is your browser caching your CSS files.

You can set an expiry on these files but it depends how often your website CSS is going to change. If you change it often you may only want to set an expiry of a couple of days. If your CSS doesn't change often then you can set a longer expiry.

Set Expiry Date using htaccess

To set your expiry date using htaccess I like to use the example from HTML5 Boilerplate, as it will take care of everything you will ever want to cache.