Back to Silas S. Brown's home page

Stylesheets for low vision

Many modern Web browsers allow users to set their own CSS stylesheets for accessibility purposes.  It can be difficult to write a comprehensive accessibility stylesheet by hand, especially if you want to work around browser bugs and the difficulties posed by complex websites.  So I made a program to generate long CSS files with workarounds for many problems.

If you are a programmer, you can adjust the Python code to your needs.  Alternatively, you can try one of these presets:

Download pre-generated low-vision stylesheets


(above stylesheets generated by version 0.9809)

Size "unchanged" lacks size-related layout changes; this can be useful if you do not need large print but just want to change the colours (see advantages of dark backgrounds).

What is the best pixel size?

You could just experiment, but if you frequently change between different setups and/or have variable sight then it might help to know how to choose a size without constantly re-experimenting:
  1. You need to know the best size in points (36, 48 or whatever) for text you read at the distance of the screen.
    1. First you need to know your normal distance to the screen.  You can move the screen nearer, but the limits will vary with the type of mounting and the size of your keyboard, desk, chair, etc; you need to be aware of this variation if you use different computers.  Also, if you have variable sight, remember to allow yourself room to get even nearer when your sight is worse (and without hurting your posture too much), which is usually easier than temporary size changes.
    2. Divide the screen's distance by your normal reading distance for printed text (both measured from your eyes to the text itself, ignoring any magnifying device in between), and multiply by the size in points of the printed text you prefer to read.
    3. If you normally use a magnifier for printed text but cannot use it for the screen, multiply your answer by the scale factor of this magnifier.
    4. If you have a full-screen magnifier (fresnel lens) permanently mounted to the screen, then divide your answer by the scale factor of this magnifier.
    5. Do not try to work out your size by setting the ``point size'' on the screen of a wordprocessor or similar, because that might not be calibrated correctly.
  2. Let P be your on-screen point size, H and V be the horizontal and vertical resolution of your monitor, and D be its size in inches (measure across the diagonal if you don't know, and if you're on a CRT monitor then you should subtract about an inch from the rated figure whereas TFT monitors' figures are OK as they are).  Your pixel size is the square root of (H*H + V*V), divided by D, multiplied by P and divided by 72.  (If your monitor has the standard 4x3 aspect ratio then this simplifies to P*V/D * 5/216.)
  3. In some cases you may then need to adjust for browser scaling of pixels; see "note on browser bugs" below.

How to install a stylesheet

Save the stylesheet to a file on your disk, and:

For other setups (including some mobiles) you can try Web Adjuster.
All material © Silas S. Brown unless otherwise stated.