Overcoming the cache: How can it be done?

I want to change my CSS file; how can I make sure my users see the changes?

[MatthewHSE]

I do a seasonal color scheme using CSS on my site. But, I'm concerned that, when I change it, some of my visitors may be seeing a cached copy of the CSS file instead of the updated copy. What can I do to still allow the CSS file to be cached, but make sure that a browser downloads it fresh, one time, after I make changes?

I read an article about this somewhere but it was pretty technical and my knowledge so far is not advanced enough that I could understand it. So where but WebmasterWorld to get down-to-earth instructions? :)

Thanks,

Matthew

[Reflection]

I think the browser should check for a newer version of the file on your server, depending on the users settings of course. So the question is what is the default setting for IE? I think its automatically check for newer versions, and Im sure the majority of users dont change that.

I believe any work around you find probably wont be worth the effort :). Best thing to do is try the site yourself and see which file you get, chances are your users will get the same.

[Sypher_5]

I believe IE has some problems with getting the newer versions of files. I've had the same problem quite alot personally and I've set IE to get the file each time reguardless. I'm not sure exactly what causes it either as I've had pages that worked, & to me looked the same as the ones that didn't.
I was thinking it was something to do with the meta tags, but I cant be 100% sure.

The best thing you could do is use a script to change your css with a cookie & get your visitors to click it. I use a script that changes the default css on one of my sites and it makes the text size around the site change.

When it comes to Opera I have no clue what's going on as you have to load the CSS in a window and refresh it to get the latest copy.

[jdMorgan]

MatthewHSE,

If you want to control caching, you have to set up your server to do it correctly, or use the capability of your scripting language(s) to send the proper cache-control header responses.

There's a pretty decent caching tutorial here [mnot.net]. Also see the cachability checker there, too.

Jim

[dcrombie]

Just change the link to your CSS file to:

"style.css?1"

OR

"style.css?20031126"

OR

"style.css?<?PHP echo time();?>"

Anything with a GET parameter will force the browser to fetch the file again from the server. Some versions of IE will cache "style.css?1" which is why the third option can be useful in testing.

You should change the link back to just "style.css" once you think the caching timeframe is over (maybe a week?) so normal caching can resume.

;)