Toegankelijkheid op CHI Tickets
CHI Tickets is ontworpen om voor iedereen bruikbaar te zijn, ook voor mensen die gebruikmaken van hulptechnologieën. Dit artikel beschrijft de toegankelijkheidsfuncties die in het platform zijn ingebouwd en hoe u er het beste gebruik van maakt.
Toetsenbordnavigatie
Elk onderdeel van CHI Tickets kan alleen met het toetsenbord worden bediend, zonder muis of touchscreen:
- Tab-toets — Verplaatst de focus vooruit door interactieve elementen (links, knoppen, formuliervelden).
- Shift + Tab — Verplaatst de focus achteruit door interactieve elementen.
- Enter of Spatie — Activeert de knop of link die momenteel de focus heeft.
- Pijltjestoetsen — Navigeren binnen dropdowns, groepen keuzerondjes en andere samengestelde bedieningselementen.
- Escape — Sluit modale vensters en pop-ups.
De volledige afrekenstroom, van ticketselectie tot betaling, kan uitsluitend met het toetsenbord worden afgerond. Dat omvat ook navigatie door de meerstaps afrekenstroom (Tickets, Add-ons, Aangepaste vragen, Contactgegevens, Betaling en Bevestiging).
Focusindicatoren
Wanneer u met het toetsenbord navigeert, verschijnt rond het actieve element een zichtbare focusindicator (meestal een rand of markering). Deze indicator:
- Laat duidelijk zien welk element is geselecteerd, zodat u altijd weet waar u op de pagina bent.
- Volgt een logische tabvolgorde die aansluit bij de visuele indeling van de pagina (links naar rechts, boven naar beneden).
- Is ontworpen volgens de contrastvereisten van WCAG 2.1, zodat hij zichtbaar is tegen zowel lichte als donkere achtergronden.
- Geldt voor alle interactieve elementen, waaronder knoppen, links, formuliervelden, dropdowns en tabbladen.
Ondersteuning voor schermlezers
CHI Tickets is gebouwd met semantische HTML en ARIA-attributen (Accessible Rich Internet Applications) voor compatibiliteit met populaire schermlezers, waaronder:
- VoiceOver (macOS en iOS)
- NVDA (Windows)
- TalkBack (Android)
- JAWS (Windows)
Belangrijke toegankelijkheidsimplementaties:
| Kenmerk | Implementatie |
|---|
| Paginastructuur | Correcte koppenhiërarchie (h1, h2, h3) zodat schermlezers per kop kunnen navigeren |
| Formulierlabels | Alle formuliervelden hebben gekoppelde labels die schermlezers uitspreken wanneer het veld focus krijgt |
| Knoplabels | Knoppen bevatten beschrijvende tekst of ARIA-labels die hun functie duidelijk maken |
| Alternatieve tekst | Evenementafbeeldingen bevatten alt-tekstbeschrijvingen |
| Live-regio's | Dynamische inhoudsupdates (zoals foutmeldingen en voorraadwaarschuwingen) worden via ARIA live regions aangekondigd door schermlezers |
| Landmerkregio's | Paginasecties zijn gemarkeerd met ARIA-landmarks (navigatie, hoofdinhoud, footer) voor snelle navigatie |
ARIA-labels en -rollen
CHI Tickets gebruikt ARIA-attributen uitgebreid om context te geven die visueel ontwerp alleen niet kan overbrengen:
- aria-label — Biedt toegankelijke namen voor elementen zonder zichtbare tekst (bijv. icoonknoppen).
- aria-describedby — Koppelt formuliervelden aan hun helptekst of foutmelding, zodat schermlezers beide samen voorlezen.
- aria-required — Geeft aan welke formuliervelden tijdens het afrekenen verplicht zijn.
- aria-invalid — Markeert velden met validatiefouten zodat schermlezers de foutstatus aankondigen.
- role-attributen — Wijzen passende rollen toe aan aangepaste UI-componenten (bijv.
role="tablist" voor de tabbladen Komend/Lopend, role="alert" voor foutmeldingen).
Responsief ontwerp
CHI Tickets gebruikt een volledig responsieve indeling die meeschaalt met elke schermgrootte en zoomniveau:
- Mobiel, tablet en desktop — De interface past haar indeling aan het scherm aan, zo blijft alles bruikbaar op elk apparaat.
- Tekstschaal — Content blijft leesbaar en functioneel wanneer browservergroting tot 200% of meer wordt gebruikt.
- Aantikdoelen — Knoppen en interactieve elementen zijn gedimensioneerd volgens de minimumrichtlijnen voor aantikdoelen (minstens 44x44 CSS-pixels), zodat ze makkelijk aan te tikken zijn op touchscreens.
- Reflow — Content herschikt zich binnen het venster zonder horizontaal scrollen op standaard zoomniveaus.
Kleur en contrast
- Tekstcontrast — Tekst en interactieve elementen voldoen aan de WCAG 2.1 AA-contrastsverhoudingen (minimaal 4,5:1 voor normale tekst en 3:1 voor grote tekst).
- Niet alleen op kleur gesteund — Informatie wordt nooit uitsluitend via kleur overgedragen. Uitverkochte tickets tonen bijvoorbeeld zowel een kleurverandering als een tekstbadge "Uitverkocht".
- Waarschuwingen voor lage voorraad bevatten zowel een visuele indicator als beschrijvende tekst.
Verminderde beweging
Voor gebruikers die beweging willen beperken (via de mediaquery prefers-reduced-motion in de systeeminstellingen van het besturingssysteem):
- Minimaliseert of schakelt CHI Tickets animaties en overgangen uit.
- Zorgt CHI Tickets dat alle essentiële functionaliteit werkt zonder bewegingsgebaseerde interactie.
Tips voor de best toegankelijke ervaring
- Gebruik een moderne browser — De nieuwste versies van Chrome, Firefox, Safari en Edge bieden de beste toegankelijkheidsondersteuning.
- Houd uw schermlezer up-to-date — Nieuwere versies bieden verbeterde ondersteuning voor ARIA-attributen en moderne webstandaarden.
- Schakel toetsenbordnavigatie in — Ga in macOS naar Systeeminstellingen > Toetsenbord en zet "Toetsenbordnavigatie" (Keyboard navigation) aan om in Safari met Tab door alle bedieningselementen te lopen.
- Pas zoom naar behoefte aan — Gebruik de ingebouwde zoom van uw browser (Ctrl/Cmd + Plus) om tekst en interface-elementen te vergroten.
- Meld problemen — Loopt u op CHI Tickets tegen een toegankelijkheidsdrempel aan? Neem dan contact op met CHI-support. Feedback helpt het platform voor iedereen verbeteren.
Tip: Heeft u hulp nodig bij het kopen van tickets of heeft uw bezoek specifieke toegankelijkheidswensen (zoals rolstoeltoegang of gebarentolk)? Neem dan rechtstreeks contact op met de organisator via de evenementenpagina.