Accessibility

What has actually been done, measured rather than asserted — and the gaps we know about.

Effective

Note: Target: WCAG 2.1 Level AA. Most text on this site clears AAA. The figures below are measured by a script that runs on the palette itself, not estimated by eye.

Why this page has numbers in it

Accessibility statements tend to say a site "strives to be accessible", which tells you nothing. Everything claimed below is checked by something that runs as part of the build, so if a change breaks it the build reports it before you do. Where we have not done the work, this page says so instead of going quiet.

Contrast

The palette is dark by design — the site is meant to be read on a phone in bad light, often outdoors. Dark themes fail contrast easily, so every text and interface colour pair is measured from the design tokens rather than sampled from a screenshot.

UseMeasuredRequiredGrade
Body text on the page12.49:14.5:1AAA
Secondary text7.74:14.5:1AAA
Captions and labels — the lowest text on the site5.81:14.5:1AA
Links and inline accents4.87:14.5:1AA
Text on a copper button4.52:14.5:1AA
The seven-segment result digits11.17:14.5:1AAA
Form-control borders (non-text, 1.4.11)3.75:13:1AA

Colour is never the only way information is carried. A warning or danger state on a result always comes with a glyph and a text label alongside the colour change, so a crossed threshold is legible to a colour-blind reader and in greyscale.

Keyboard

  • Every interactive element is reachable and operable by keyboard alone.
  • Nothing on the site uses a positive tabindex, so the tab order is the document order — this is checked across every built page.
  • Every page starts with a skip-to-content link, and the focus indicator is a copper ring measured at 4.87:1 against the page and 5.66:1 inside the darker result well.
  • Controls are real <button>, <input> and<select> elements rather than styled <div>s, so they behave the way your browser and assistive technology already expect.
  • Touch targets are sized for a gloved hand, which also helps imprecise pointing.

Screen readers

Every form control has an accessible name. This is verified across all built pages — several hundred controls — and a page with an unlabelled input fails the build.

Results are announced once, not on every keystroke.The unit converters recalculate as you type, which makes the result a live region. An undebounced live region is actively hostile: typing "4500" would narrate four answers, three of them wrong. Updates are therefore debounced, and a test mounts each converter page and asserts that a number typed digit by digit produces exactly one announcement. Validation messages are announced through the same region, so an error reaches you the same way an answer does.

The seven-segment readout is not a pile of shapes.Results are drawn as segment graphics for legibility at arm's length. The drawing is hidden from assistive technology and a real text string is kept as the accessible value, so what is announced is "12.43 volts", not a description of polygons.

Every chart has a data table. Charts are decorative from an assistive-technology point of view: the graphic is hidden and a real<table> containing the same numbers is always present in the page, visible on some charts and screen-reader-only on others. No information exists only as a picture.

Structure is honest. One <h1> per page, headings in order, real landmarks, a language declared on every page, and breadcrumbs in a labelled navigation with the current page marked. On narrow screens the breadcrumb trail collapses visually but the hidden crumbs stay in the accessibility tree — a phone user hears the full trail, not an ellipsis.

Without JavaScript, and on a bad connection

The interactive calculator is the only part of a page that needs JavaScript. The explanation, the worked example, the reference tables, the common mistakes and the FAQ are static HTML and are readable with scripting disabled, with a screen reader, or on a connection too weak to fetch the script. Each calculator says so at the top when its script has not run, and points at the parts that still work. The FAQ uses native disclosure elements, which work without scripting.

Fonts are self-hosted and no third-party script loads, so there is no external request that can hang and leave a page half-rendered.

Motion

There is very little motion here to begin with — no carousels, no parallax, no animated charts, and results appear rather than count up. What transitions exist are reduced to effectively nothing when your system asks for reduced motion, including smooth scrolling.

Known gaps

We would rather list these than let you discover them.

  • Wide tables cannot be scrolled by keyboard. Tables too wide for a narrow screen sit in a horizontally scrolling container. That container is not focusable, so a keyboard-only user on a small viewport cannot scroll it sideways without a pointing device. The data is fully present and fully announced to screen readers — this is specifically a keyboard-scrolling gap. It is a known defect and it is fixable; it has not been fixed yet.
  • No independent audit. The claims above come from our own automated checks and manual review. This site has not been audited by a third-party accessibility specialist, and automated checking catches only a fraction of what matters.
  • Limited assistive-technology testing. Behaviour is verified programmatically against the built pages, which is not the same as sitting down with every combination of screen reader, browser and operating system that people actually use.
  • Dark theme only. The site has no light mode. The dark palette is contrast-tested and generally suits low-light and photophobic readers, but some people with astigmatism read light backgrounds more comfortably, and there is currently no way to switch.

If something here is unusable for you, we want to know — a specific report ("the breadcrumb on this page reads wrong in NVDA") is worth more than any audit. Please say what page you were on, what you were using, and what happened. MyElectricCalculator is a small site, this statement is maintained rather than filed, and it will be updated as gaps are closed.

Getting in touch

A contact address is not published yet. One will be added here, and this page will say so from the date it changes. Until then there is no route to reach us about this page, which we would rather state plainly than paper over with an address that bounces.