26 Nov 2005

Finishing Touches: Avoiding Caching Glitches

If you make changes to the design of a site and alter both the markup and styling, then sometimes caching can cause temporary problems. A user’s browser might download an updated page but apply the old style sheet from its cache (the reverse situation is less likely), with ugly results.

The safest option is to rename the style sheet, but a less awkward approach that’s almost as effective is to append a different query string, e.g. by incrementing a version number. So in the link tags screen.css becomes screen.css?1, then screen.css?2, and so on. The browser has to assume it’s a different file each time and so a new copy is downloaded. It doesn’t avoid all caching problems but does help, and you can do the same thing for images, scripts etc. if necessary.

(I like to tinker with things, so this site’s currently up to screen.css?23)