Illustratief klantrapport · 17 oktober 2026

Bureaupresentatiewebsite: toegankelijkheidsbeoordeling

Northline Studio · northline.example

Fictieve demonstratie. Alle klanten, domeinen, bevindingen en bewijzen zijn illustratief. Deze rapporten tonen de structuur, geen scans van echte websites of bewijs van productresultaten.

Abonnement kiezen

Managementsamenvatting

Maak eerst formulier en navigatie begrijpelijk. Potentiële klanten hebben die nodig om diensten te bekijken en contact op te nemen. Beoordeel daarna de afbeeldingstekst van het praktijkvoorbeeld.

Beoordeelde pagina’s: 4
Typen bevindingen: 3
Kritiek: 3
Matig: 0

De aantallen tonen typen bevindingen in dit fictieve voorbeeld, geen getroffen elementen. Ernst geeft beoordelingsprioriteit aan, geen nalevingsoordeel.

Reikwijdte en methode

Klantroute: Discover services → read a case study → send an inquiry.

Voorbeeldpagina’s: //services/work/contact

Methode: automatische axe-controles op elke geladen openbare pagina. Het voorbeeld omvat geen ingelogde delen, alle toestanden, toetsenbord, schermlezers of volledige WCAG-evaluatie. Bevindingen vereisen menselijke bevestiging.

Dit rapport beschrijft automatische toegankelijkheidsbevindingen. Het stelt geen wettelijke naleving vast; handmatige evaluatie blijft nodig.

Toegankelijkheid: regels en toepasselijkheid

Geprioriteerde bevindingen

Prioriteit	Bevinding	Pagina / regel	Volgende stap
Critical	Email field has no accessible label	`/contact` `label`	Connect a visible label to the email field.
Critical	Menu button has no accessible name	`/` `button-name`	Name the menu control and expose its expanded state.
Critical	Case-study image is missing an alternative	`/work` `image-alt`	Describe the project image or mark it decorative after reviewing its purpose.

Bewijs en herstel

Twee bevindingen zijn uitgewerkt om de overdracht naar uitvoering te tonen.

Bevinding 1 · Critical

Email field has no accessible label

Getroffen element: #contact-form input[type="email"] op /contact

Waarom het belangrijk is: A person using a screen reader needs a reliable name for the field. An unnamed input gives no reliable indication of the information expected.

1 · Illustratief bewijsschema. Nagemaakt interfacefragment, geen schermafbeelding of live scan. Illustrative markup contains an email input with no associated label, aria-label, or aria-labelledby.

Voorgestelde oplossing

Add a visible Work email label, connect it with for/id, and preserve the expected email input type and autofill hint.

Voor · illustratieve HTML

<input type="email">

Na · voorgestelde HTML

<label for="email">Work email</label>
<input id="email" name="email" type="email"
  autocomplete="email" required>

Controleer de oplossing: Re-run the label rule. Tab into the field and confirm that a screen reader announces Work email, its input type, and required state. Submit an invalid email and review the error message separately.

Bevinding 2 · Critical

Menu button has no accessible name

Getroffen element: header button.menu-toggle op /

Waarom het belangrijk is: An icon alone does not tell a screen reader user what the button does. The expanded state helps people understand whether navigation is open.

1 · Illustratief bewijsschema. Nagemaakt interfacefragment, geen schermafbeelding of live scan. Illustrative markup contains only an SVG inside a button; the SVG is decorative and supplies no accessible name.

Voorgestelde oplossing

Give the button an accessible name. Update aria-expanded when the menu opens or closes and connect aria-controls to the navigation container.

Voor · illustratieve HTML

<button class="menu-toggle">
  <svg aria-hidden="true">…</svg>
</button>

Na · voorgestelde HTML

<button class="menu-toggle" aria-label="Menu"
  aria-controls="site-nav" aria-expanded="false">
  <svg aria-hidden="true">…</svg>
</button>

Controleer de oplossing: Re-run the button-name rule, then open and close the menu with Enter and Space. Confirm the state is announced, links are reachable, and focus remains predictable when the menu closes.

Aanbevolen overdracht

Bevestig bevindingen in de echte interface en spreek eigenaarschap en reikwijdte af.
Los kritieke bevindingen eerst op; beoordeel elke wijziging in de context.
Test de klantroute met toetsenbord en ondersteunende technologie.
Scan dezelfde pagina’s opnieuw, noteer resterende handmatige controles en deel wijzigingen met de klant.