Accessibility

What we are aiming at

WCAG 2.2 level AA. We believe this site meets it, and the paragraphs below say how that is checked rather than asserting it.

Nothing needs JavaScript to appear

No fact on this site requires script to be readable. The questions open and close with native <details> and <summary> rather than a JavaScript accordion. Every form posts to the server and works with scripting switched off. The zip code lookup is a form and a table, not a live search. The booking flow degrades to one long form that still submits.

There are four components on the whole site that need JavaScript, and each is listed in the repository with the reason: the mobile navigation toggle, the booking stepper, the project lightbox and the site search. None of them owns a fact. Turn scripting off and the case study still shows every photograph, the search page still lists every link, and the booking form still books.

Keyboard

Every interactive element is reachable and operable from the keyboard, in a visible order that matches the page. Focus is always visible: a three pixel outline in the primary blue, offset from the element, on every control.

A skip link is the first thing you reach on every page. The project lightbox traps focus while it is open, closes on Escape, and returns focus to the image you opened it from.

Screen readers

Headings run in order with exactly one <h1> per page and no skipped level. Every section is labelled. Specification pairs are marked up as description lists and hours and prices as real tables, so they are navigable rather than being a wall of text.

Every image carries alt text that describes what is in the frame. Exactly one image on the site is decorative, a texture behind the numbers on the homepage, and it carries an explicitly empty alt so a screen reader skips it. The four diagrams are drawn in SVG with real text labels, each with a title, a description and a caption naming every part in reading order.

Colour and contrast

Every text and background pair used on this site is measured against the 4.5:1 that AA requires for normal text, and the check runs on every build rather than being a thing somebody once looked at.

One colour is deliberately restricted: the yellow wayfinding accent never carries text anywhere, because it does not clear AA against the page background at body size. It is a border, a marker and a background behind dark text, and a build fails if it is ever used as a text colour.

Colour never carries meaning alone. On the coverage map every city has a text label and a marker shape that differs by coverage level, and the tables below the map repeat every fact in words.

Motion

There is one animation on the site: the arrival window ribbon fades in once on load. Under prefers-reduced-motion it does not, and neither does any transition. If your system asks for reduced motion, this site is still.

Zoom and reflow

The site reflows to 320 pixels without horizontal scrolling and without losing content. Wide tables, the coverage map and the diagrams scroll inside their own containers rather than pushing the page sideways, so the surrounding text stays where it is. Text can be resized to 200% without breaking the layout.

What we test with

Two checks run on every build: colour contrast measured against the compiled stylesheet, and a check that no content requires script to render. The test suite adds axe-core against every route template, plus the mobile navigation and the project lightbox while they are open, and it walks the four interactive paths by keyboard: the booking stepper, that navigation, the lightbox and search. Beyond that, the pages people actually arrive on are read with a screen reader: the homepage, a service page, the booking form and the emergency page.

Automated testing catches perhaps half of what matters. The rest is the walk.

Known limitations

Written down rather than left for you to find:

• The booking stepper is a stepper only with JavaScript. Without it the form is one long page. That is a working path, not an equivalent one, and the long form is more effort to complete.
• Site search needs JavaScript. The search page renders a complete browsable index below the box for exactly this reason, and no other page depends on search.
• The coverage map is a picture of geometry. Every fact it shows is also in the tables beneath it, but the spatial relationship between the cities is not available any other way.
• PDF documents are not published here. If we ever publish one, it will be tagged, or it will not be the only copy.

Reporting a barrier

If something on this site does not work for you, tell us and we will fix it. The channels are on the contact page, and a phone call is faster than the form. Tell us the page, what you were trying to do, and what happened. You do not need to diagnose it.

We aim to reply within one working day and to fix a blocking issue rather than schedule it.

A note on this site

Cedarline Home Services is a fictional company used for demos. The accessibility work described here is real and is applied to this site; the company is not.