Forum Moderators: open
So will the visitors browser, if using the cache, be using both the old html and CSS files (if so things would still look okay). Or is there some process that would mean that if the visitor's browser is using one of the revised html or CSS files, it will use the other revised one?
The good news is that most people's reaction to a screwy-looking page that nevertheless looks interesting would be to 'try again' and reload the page.
Jim
Caching also isn't a subject that can be comprehensively-covered in a forum thread -- It's worth at least one dedicated chapter in a book on servers or Web technology.
Jim
I found this on a web site:
<META HTTP-EQUIV="Expires" CONTENT="Tue, 01 Jan 1980 1:00:00 GMT">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
Above META tags should be placed in between your <HEAD> and </HEAD> tags. Also note that the specified date should be a date in the past so that the browser will immediately discard the cached copy or not cache it at all.
Why use two tags you ask? Although "Expires" tag is properly handled by most browsers, some older browsers may still look for the "no-cache" tag. If you're not worried about users with old browsers, using the "Expires" tag alone is sufficient and will make it possible to specify the exact time to expire content.
Is there any potential problems with this?
That way you put up a new CSS, and then update all your pages in one go to point to the new CSS. Anything still cached still gets the old CSS, anything new gets the new CSS. No reason to fear any problems.
BTW: Turning off caching for static content is a bad idea IMHO.
That's a much better approach than relying on <Meta>s, because caching proxies in the network (e.g. AOL, EarthLink) don't read the HTML content of pages, and so may 'keep' old copies despite the HTML meta-information.
That can provide immediate relief and give time to research and set up proper server cache-controls on a site-wide basis.
Jim
Easiest to fix this: add a version number to the name of the CSS file.
Minor point... I don't think you need to actually change the name of the CSS file, but just append a querystring to the filename when you link to it...
<link href="mystyle.css?version#" ....
EDIT: Changed SCRIPT to LINK element! Oops!
[edited by: penders at 6:39 pm (utc) on Dec. 9, 2009]
I was just saying, that instead of actually changing the name of the file, you can just append a querystring to the filename wherever you link to it.
To follow your example...
<link href="global.css?2" rel="stylesheet" type="text/css" /> The file is still called "global.css", but the browser will look for "global.css?2" in its cache (which isn't there). The "?2" will otherwise be ignored (it is just a querystring).
Moreover query strings might mean the caches and proxies aren't kicking in for all they're worth. I'd really put it in the filename.
That seems easy, and I believe I understand what to do: leave my original "global.css" file on the server. Name my revised CSS file that was global.css to global2.css and then change my link to it to: <link href="global2.css" rel="stylesheet" type="text/css" />. Then the next time make it global3.css, with the link pointing to global3.css, etc.
To not have to keep old revisions around: monitor the logs of you website. Once you see the requests for the old design die out you can start to think about removing the old file. It happens quite quickly unless spiders travel by fo it or you forget to switch over some html file (referrers really are good for finding those).
BTW: the same trick works for images you use in backgrounds, for logos etc.
