And how this can be related to local storage or sessions?
[EDIT #2]
Actually, after OP raised the valid and practically important problem of applying style switch to other pages using only the client-side techniques, I can see that local and/or session storage using respective HTML5 feature could be extremely useful. Please see the discussion in comments. If needed, I would write some prototype illustrating the technique I suggested, but it would take more time. I hope the idea is easy to understand from my comment in the comment section below.
One issue it to choose between local and session HTML5 storage. Local storage will keep the chosen style switch for a long time (until the user cleans up local data, the procedure depending on particular browser), but the session storage will remember it only during the session, so you should take care to start with default is session data is missing.
[END EDIT #2]
It should be a purely client-side issue, very simple. Have different sets of all CSS classes, default and high-contrast. It does not matter if they are in different CSS files on not (or CSS is all embedded in HTML), it's only important to give them different names.
On user's click, handle it in Javascript and replace all default classes with high-contrast classes, or visa versa, for all elements involved. I think the most convenient way to implement this would be jQuery. It already has all methods you need, and also it allows to get the whole set of elements and do some operation on the set at once. The jQuery wrapper for the element or a set of elements can be obtained using jQuery
selectors: by name, id, HTML elements and/or attributes, different combinations of those, and the like:
http://api.jquery.com/category/selectors[
^].
To replace/add/remove CSS classes, use these functions:
http://api.jquery.com/category/css[
^],
http://api.jquery.com/addClass/[
^],
http://api.jquery.com/removeClass/[
^],
http://api.jquery.com/toggleClass/[
^].
If you need to learn jQuery (highly recommended), please see:
http://en.wikipedia.org/wiki/JQuery[
^],
http://jquery.com[
^],
http://learn.jquery.com[
^],
http://learn.jquery.com/using-jquery-core[
^],
http://learn.jquery.com/about-jquery/how-jquery-works[
^] (start from here).
[EDIT #4]
The solution described about turned out more complicated than it can be.
When I tried to develop it, I found much simpler and more elegant solution.
Here is the implementation shown in my short article, complete with usage sample:
Theme Selector Based on HTML5 Local/Session Storage: The Simplest Thinkable One[
^].
[END EDIT #4]
[EDIT #1]
Alternative, potentially simpler and more maintainable solutions could be based on some server-side technology. You could post-back an HTTP request on user's click to the server side. The page can be re-written on the server side with only one difference: one CSS file replaced with another CSS file, which could be just one line in HTML code referring to an external entity (CSS file).
It would not be as fast as with pure client-side Javascript solution, but such switches are hardly done too frequently. In return, maintainability could be improved.
Too bad we don't know what server-side technology you use and if you even use any. So, you can use this idea to figure out yourself how to do it with your technology (again, if you use any). If you want to get more help on this option, clarify this matter and ask your follow-up questions.
[EDIT #1.2]
My solution shown in the article I already mentioned makes the client-side solution doing exactly the same, in a very simple way:
Theme Selector Based on HTML5 Local/Session Storage: The Simplest Thinkable One[^].
The only problem is that the client should have relatively modern Web browser supporting Web storage, but this is not a problem at all, because this feature is not even an HTML5 feature anymore; even the Web browser poorly supporting HTML5 support Web storage.
[END EDIT #1.2][END EDIT #1]
—SA