Larkfield — school website template

Built for the audit, not retrofitted

School and public-sector sites get checked against WCAG, usually after launch and usually in a hurry. Larkfield starts from the checklist: a skip link that is the first thing the keyboard reaches, a <main> that can actually receive focus, sections labelled by their headings, underlined links inside content, 3 px focus rings that clear 3:1 on both backgrounds, form fields with real labels and 44 px hit targets, tables with captions and scope on every header.

Contrast is measured, not guessed

Every colour pair in src/input.css carries its ratio in a comment — body text at 16:1, muted text at 7:1, form borders at 4.4:1 — and the dark set clears the same numbers. Change a colour and the comment tells you which pair to re-check.

The pages parents actually want

Term dates, absence reporting, admissions and contact are one click from the home page in four tiles, and again in the 404. Most school-site traffic is someone looking for one fact quickly, so the fact comes first and the prose second.

What you will need to replace

Photos are placeholders with their subject written on them. The School structured data on the home page and the statutory links in the footer — accessibility statement, privacy notice, safeguarding, inspection report — are the ones your authority will ask about; link them before launch.