HTML and CSS Caching
Caching is great but can cause lots of problems if you change things and the user doesn’t see those changes. Also during development caching is a bad idea. It’s hard to tell what your doing if you don’t know what is or isn’t cached. To make things more complicated CSS caching is different than HTML caching and isn’t cleaned when you “clear cache” in your browser.
So here are some methods for making sure you HTML and CSS are loaded fresh each time.
HOWTO Prevent HTML Caching
To keep the browser from caching you can use the following:
<meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="expires" content="-1">
Most documentation suggests using this line:
<meta http-equiv="pragma" content="no-cache">
But for IE that’s not good enough. So make sure to use the 3 lines at the beginning.
HOWTO Prevent CSS caching
This one is a bit more tricky. You have to basically fake the filename changing everytime the page is loaded. So in the following you get that effect by adding a date variable on the end of the file name which makes the browser thing it’s a dynamic page. Which give you the result of it reloading the CSS every time you view the page. In PHP you can do that with the following:
<link rel="stylesheet" type="text/css" href="style.css?<?php echo date('U'); ?>" />
