The charts
Every chart on this site is hand-drawn SVG, and charts are where data visualisation usually fails people who cannot see them. Three things were done about that.
- The numbers exist as a table. Under each calculator that draws a chart — six of the seven; the risk assessment has no chart — there is a Show the numbers as a table panel containing the exact figures the curves are drawn from — rebuilt every time you move a slider, so it can never disagree with the picture. Screen readers navigate tables natively, by row and column, with headers announced. That is a better experience than any cursor we could build over a graphic.
- The charts respond to the keyboard. Tab to a chart and use the left and right arrow keys to step through it year by year; Home and End jump to the first and last year, Escape stops. This drives exactly the same readout the mouse does — one behaviour, not a reduced parallel version.
- Colour is never the only signal. The warning lights in the rent-vs-buy calculator carry a word — ok, caution, warning — next to the colour, so the meaning survives without it.
Contrast, measured
These are computed ratios against the site's three background shades, not estimates. AA requires 4.5:1 for body text and 3:1 for large text and graphics; AAA requires 7:1.
| Text colour | On darkest | On mid | On lightest panel |
|---|---|---|---|
| Brightest body text | 15.6:1 AAA | 13.7:1 AAA | 12.2:1 AAA |
| Standard body text | 11.5:1 AAA | 10.1:1 AAA | 9.0:1 AAA |
| Secondary text | 7.2:1 AAA | 6.3:1 AA | 5.7:1 AA |
| Footnote text | 7.8:1 AAA | 6.9:1 AA | 6.1:1 AA |
| Green links and accents | 8.1:1 AAA | 7.1:1 AAA | 6.4:1 AA |
Measuring this found a real fault: one grey used for a separator sat at 2.4:1, below even the 3:1 threshold for non-text. It has been replaced. Six borders referenced a colour that was never defined and silently fell back to the inherited text colour; those are fixed too.
The rest of the site
- Keyboard. Every control is reachable and operable by keyboard, including the language switch, the region switches and the FAQ panels, which are native
<details>elements. There is a skip link to the main content as the first focusable item. - Sliders. Each one has a paired number field, so a precise value can be typed rather than dragged. Arrow keys work on the sliders themselves.
- Structure. One
h1per page, headings in order, landmarks on header, main and footer, and language declared per page — the German pages announce themselves as German. - Motion. No autoplay, no parallax, no animation that starts by itself. Nothing on this site moves unless you move it.
- Zoom. The layout reflows to 400% without horizontal scrolling.
- Without JavaScript. Every article, source and glossary entry is fully readable — the site is static. The calculators are not: they run entirely on your own device, which is why your numbers never leave it, and why they stay empty with JavaScript off. A notice says so rather than leaving you with a blank box.
Known gaps
Written plainly, because a statement that lists only successes is not worth reading.
- The chart readout is not announced automatically. Stepping through a chart with the arrow keys updates the figure on screen, but that update is not yet pushed to a screen reader as a live announcement. Until it is, the data table below each chart is the better route — and it holds the same numbers. Note that the table is built by the same JavaScript as the chart, so with JavaScript switched off neither exists.
- No print stylesheet. Printing a calculator page currently carries the navigation with it, and the assumptions behind a result do not appear in the footer where they belong. This is the next thing on the list.
- Not independently audited. Everything here was tested by us — measured ratios, keyboard walkthroughs, automated checks on the built pages. No external audit and no formal user testing with assistive technology has been done.
- Non-text contrast is not fully measured. The table above covers text colours. The chart series colours and the five warning lights have not been measured against the 3:1 requirement for graphical objects (WCAG 1.4.11), which is a gap on a site whose subject is charts. The warning lights do carry a word next to the colour, so their meaning does not depend on it.
- Two WCAG 2.2 checkpoints are unaddressed. Dragging Movements (2.5.7) is met — every slider has a typable field. Target Size (2.5.8) and Focus Not Obscured (2.4.11) have not been assessed.
- Video is not covered here. This site is the written companion to a YouTube channel, and nothing on this page addresses captions or transcripts for that video. The articles carry the substance in text, but that is not the same as an accessible video.
- The German chrome is English. On the German pages the navigation, footer
and no-JavaScript notice are still in English. They are now marked
lang="en"so a screen reader pronounces them correctly, but marking is a patch — translating them is the real fix and has not been done. - The rent-vs-buy calculators are dense. The English one carries eleven inputs and five warning lights; the German one carries fourteen inputs, which makes it the densest page on the site. Both meet the checkpoints, but a lot of information at once is its own kind of barrier, and simplifying it is an open question rather than a solved one.
Something not working?
If any part of this site is difficult or impossible for you to use, please say so — that is more useful than any checklist. There is a contact route on the Impressum page. Tell me what you were trying to do, and what happened instead. Problems that block someone get fixed before whatever else was planned.