You can changed the look of this site from anywhere you see a list-box like the one at the top of this page.
There's a nice example under "Kies je eigen style" at Alles of Niets".
The layout is controlled by Cascading Style Sheets (CSS). When you click on one of the options in the list-box, your browser reloads the page using a different stylesheet. Some of the stylesheets are my own, some are modified from examples by Microsoft and some of them are called up from the W3 server. No browser yet deals with stylesheets perfectly, and they all screw them up in different ways, so W3 checks which browser you're using and makes sure it sends you a version of its stylesheet that will definitely look nice. But it's a bit slow sometimes.
To get these effects I use both cookies and JavaScript. If your browser can't use either of those, or you've told it not to, the list-box won't appear on the webpage.
These pages are written in standard, old-fashioned HTML. That means without specifying sizes or colours of fonts, margins, background colours or any of that fancy stuff. The biggest heading is <H1>. The second-biggest heading is <H2>. Blockquotes are <BLOCKQUOTE>. Et cetera.
All the stuff about fonts, colours, margins, etc. is set out in Cascading Style Sheets (CSS). These wonderful things allow you to specify all the layout and formatting from a separate file. To pick a different style using CSS, all you need to do is change a single line in the head of the document. For example, to call up the style sheet edostyle.css, which lives in the directory scripts at http://edochan.com/css/edostyle.css, I write:
<LINK REL=STYLESHEET HREF="http://edochan.com/css/edostyle.css" TYPE="text/css">
JavaScript lets me allow you to change stuff on your webpage without keeping lots of similar versions of the same page on my server. To write something onto a web-page after it's loaded you write,
document.write("something onto a web-page after it's loaded")
So you can write the line that changes the stylesheet like this:
document.write('<LINK REL=STYLESHEET HREF="http://edochan.com/css/edostyle.css" TYPE="text/css">');
There's just one little problem. The CSS needs to be called up from the head of the webpage, before the rest of it loads. So once you've chosen a layout, the page needs to re-load before it takes effect. But normal web-pages are "stateless". Every time you re-load, you start again from scratch. They forget what they were just doing.
To stop your computer from forgetting which layout you've just chosen, I use cookies. That's where a little bit of information gets saved on your computer. When you click on a different style, my JavaScript script leaves a cookie on your computer saying which stylesheet you've chosen. I pinched the code for setting and reading the cookie directly from Netscape's Developers' Page.
Every time your browser loads a page, the JavaScript script called up in a file called "style.js" looks in your cookie folder to see if there's a bit of information there from itself. If it finds one, it writes a line into the head of the webpage calling up the style sheet you have chosen. If it doesn't find one, because you haven't chosen a style sheet, or because your browser isn't allowing the use of cookies, it gives you a standard style sheet. (Which CSS is chosen as the standard depends on your browser.)
Not everyone has JavaScript running. Some people have old browers that can't use it. Some people have turned off JavaScript deliberately to avoid annoying gimmicks like this. I use JavaScript to write the "Change Layout" form onto the web-page, so they won't see it at all. But they'll still get a stylesheet, because I've put one in the head of the webpage between <noscript> tags. Browsers with JavaScript running ignore everything between those tags.
Also, some people won't let me use cookies, because they think that if I can read and write information on their computer I might also be able to e-mail their secret goat-porn folder to their boss and wipe all the memories from their brains. My JavaScript script checks that cookies are working before it writes the "Select a different style:" form onto the webpage, so paranoid users will remain blissfully unaware of the whole terrifying phenomenon. They'll get the default stylesheet that everyone else gets when there's no cookie. These people are dangerous subversives, and are automatically reported to Microsoft and John Poindexter.
The code is in style.js. Once this has been loaded in the head of the page, the form is written onto the page using styleform.js.