Initial deploy setup

2026-07-21 14:00:00 +02:00
commit b8091e59bd
285 changed files with 27854 additions and 0 deletions
@@ -0,0 +1,64 @@
+# Toegankelijkheid
+
+Doel: WCAG 2.2 AA voor de kernflows.
+
+## Semantiek
+
+- één `h1` per pagina, hiërarchische headings;
+- navigatie in `<nav>` met duidelijke accessible name;
+- lijsten/tabellen voor werkelijke lijst-/tabulaire data;
+- formulieren met expliciete `<label>`;
+- statusmetadata als definition list waar passend;
+- externe links herkenbaar in tekst/accessible label.
+
+## Toetsenbord
+
+Alle functies moeten zonder muis werken. Focusvolgorde volgt visuele volgorde. `:focus-visible` heeft een contrastvolle ring. Geen keyboard traps. Na server-POST landt focus logisch via heading/message; toekomstige modals herstellen focus.
+
+## Kleur en contrast
+
+- bodytekst minimaal 4,5:1;
+- grote tekst minimaal 3:1;
+- focus en componentgrenzen minimaal 3:1 waar vereist;
+- status nooit alleen via kleur;
+- light/dark afzonderlijk toetsen.
+
+## Zoom en reflow
+
+- bruikbaar op 320 CSS px breed;
+- 200% zoom zonder verlies van acties/tekst;
+- geen vaste hoogte voor tekstkaarten;
+- lange URL's en woorden breken;
+- horizontale scroll alleen voor intrinsiek brede data met alternatief.
+
+## Forms en fouten
+
+- foutsummary bovenaan bij meerdere fouten;
+- inline fout bij veld;
+- `aria-invalid` en `aria-describedby`;
+- voorbeeld en vereiste syntax als hint;
+- geen placeholder als enige label;
+- validatie niet alleen on blur.
+
+## Dynamiek
+
+- server-rendering heeft geen verborgen loading state;
+- async updates gebruiken live regions spaarzaam;
+- successmessages niet alleen tijdelijk visueel;
+- motion respecteert reduced motion;
+- tijdslimieten bestaan niet in gebruikersflows.
+
+## Vacaturetekst
+
+Gesanitized HTML behoudt headings, paragraphs, lists en links waar veilig. Verwijder scripts, forms, iframes, eventhandlers en gevaarlijke URL-schema's. Voeg waar nodig `rel="noopener noreferrer"` toe aan externe links.
+
+## Testen
+
+Per zichtbare taak:
+
+1. keyboard-only;
+2. browser zoom/reflow;
+3. automatische HTML/accessibilityscan waar beschikbaar;
+4. screenreader smoke test voor dashboard, vacaturedetail en profiel;
+5. contrastcontrole;
+6. test met lange/lege/unknown content.