Large Text - Accessibility - Consultancy - Web Design - Training - Contact

browse:

contact:

webcreations:

KAOS Website

Kaos Theatre

UK Biobank Website

UK Biobank

Race Relations Archive Website

Race Relations Resource Centre

seminars:

accessibility
working group:

articles:

search:

webcreations:

Partially Sighted World Championships Website

Award Winning
PSWCWebsite

UK National High Performance Computing Service Website

CSAR

Evaluating Local Governance, New Consitutions and Ethics website

ELGNCE

Personal Style Sheet Generator

Ever wanted to see web pages the way YOU want them displayed? Well now you can!

Document CSS and User CSS

A properly constructed web page, obeying globally recognised Web Standards, will have separated the content from the presentation, putting them into two separate files. All the presentation rules are kept in what is called a Style Sheet, which your browser downloads at the same time as the web page. This is called the Document CSS.

But you can also tell your browser to ignore the Style Sheet attached to the web page, and instead to display the page according to the rules laid out in your OWN Style Sheet, kept in a folder on your own computer. This is called the User CSS.

Below are some guidelines on how to implement User CSS in your browser.

On the next page you will be able to generate your own Personal Style Sheet, and download a file called fourquarters.css - a Style Sheet that will live on your own computer, and which you can tell your browser to use instead of the Document CSS that comes with modern web pages.

Generate my Personal Style Sheet >>>>

How to Implement UserCSS

Telling your browser to display web pages using YOUR Style Sheet depends on which browser you are using. Select your browser and read the simple instructions:

Internet Explorer 5 and above

Simply select Internet Options from the Tools menu, and click on the Accessibility tab in the bottom right hand corner. Here you can tell Internet Explorer to ignore colour and font rules in web pages, and to format pages using your own Style Sheet - browse to where you have downloaded the fourquarters.css, and select it. Click on OK in both options windows, and you're done!

Internet Explorer Accessibility Options

Unfortunately, support for User CSS in Internet Explorer is not perfect. Internet Explorer will read the Document CSS as well, and unless you have rules in your User CSS for everything in the document, it is possible that it will use these rules, instead of defaults from your User CSS. This is contrary to the User Agent Accessibility Guidelines as set by the World Wide Web Consortium. Hopefully Microsoft will implement these Guidelines fully in Internet Explorer 7.

Firefox

By far a superior browser to Internet Explorer, and available from http://www.getfirefox.com/ you will also need one of the many wonderful plug-ins available for Firefox to implement User CSS. This is available from the Firefox Extensions website. Once you have installed Firefox and are looking at this page in a Firefox browser window, click on this link to ChromEdit and the plug-in will install itself.

Firefox Tools Menu

The ChromEdit plug-in is then available from the Tools menu in Firefox, and allows you to edit many of the user files in the browser.

Generate your Personal Style Sheet, and save it to your computer. Now open up your fourquarters.css file - in Notepad or a similar small text editor, Select All and Copy it.

In Firefox, open up the ChromEdit User Profile File Editor, by selecting Edit User Files from the Tools menu, and Paste your fourquarters.css into the ChromEdit userContent.css window, (see below). Click Save, and close the ChromEdit window. You will need to restart Firefox for your User CSS to begin working.

ChromEdit User Profile Editor

Opera 7/8

Although somewhat independent and rather quirky in its implementation of Style Sheets as a whole, Opera, (available from http://www.opera.com) is very easy to configure to use your Personal Style Sheet.

Opera Preferences window

Ensure that in User mode you have only the 'My style sheet' box selected, and Choose your fourquarters.css file. Then when browsing with Opera you can select User mode whenever you wish to see web pages using your Personal Style Sheet.

Netscape

Unfortunately Netscape does not allow implementation of User CSS in a way that is easily explained. Although it is technically possible, the process is arcane and far from user friendly.

Generate my Personal Style Sheet >>>>