Changing the layout, colour and text size with style switcher and simple PHP scripts - an experiment

1. Change the layout with a style sheet switcher

Style switcher: menu on left | menu on right.

I used Chris Clark's PHP style sheet switcher to demonstrate how the layout of the page can be changed using a server side style sheet switcher.

2. Change the text size and background colour with a style sheet and a simple PHP script

Text size (%):
Select a colour low contrast high contrast Choose a background color   Light Grey   Light cyan   Light magenta   Light blue   Light cyan   Magenta   Green   Cyan   Yellow   Red   Light Yellow   Cream   blue/yellow text   Dark blue/yellow text   Black/yellow text   White/black text

I have specified the text size as a percentage, to provide the user with a greater chance of setting a size that exactly matchers their needs.

A server side PHP script is used to makes changes to the external style sheets and stores colour and text size preferences in cookies. The file suffix of the style sheet has been changed to .php rather than .css to enable the server to process the PHP script.

The background colours are those recommended by Tintavision, Colour Group GB, British Dyslexia Association and Royal National Institute for the Blind - as those best suited to people with Dyslexi, Asfedia, ADD, ADHD, or a visual impairment (see below).

The colour preferences are taken from the article Colour & Contrast Accessibility Issues: for the design of e-learning materials by EA Draffan, Peter Rainger, and Robbie Corbett and published on the Tech-dis website. The list of recommended background colours (recommended by Tintavision, Colour Group, Colour Group GB, British Dyslexia Association , Royal National Institute for the Blind) can be found as a link from the page The importance of Contrasting Colours.

Go back to the MCU.

Jim Byrne October 2003

Menu

• first choice
• second choice
• third choice
• fourth choice
• fifth choice