SC 1.3.4 Alle schermen zijn beperkt tot één weergavestand (staand)

De lay-out van alle schermen is beperkt tot één weergavestand (portret).

Apps moeten zowel in verticale (portret) als horizontale (landschap) stand goed werken. Bezoekers moeten de vrijheid hebben om te kiezen welke modus het beste voor hen werkt. Je mag hier alleen van afwijken als één bepaalde stand echt noodzakelijk is. Dit is bijvoorbeeld belangrijk voor mensen die hun tablet aan hun rolstoel hebben gemonteerd en de oriëntatie niet kunnen aanpassen. Zo kunnen zij de app of website gebruiken op de manier die voor hen het handigst is, zonder iets te missen.

Oplossing

Zorg ervoor dat de inhoud van de app draait en zich aanpast aan de weergavestand.

SC 4.1.3 Statusberichten worden niet voorgelezen

Op sommige schermen verschijnt informatie als resultaat van de interactie van de bezoeker met de app. Bijvoorbeeld, er verschijnen foutmeldingen of berichten dat een actie is geslaagd. Deze informatie is een statusbericht, maar wordt niet door de schermlezer voorgelezen.

Oplossing:

Zorg ervoor dat nieuwe of bijgewerkte informatie duidelijk wordt aangekondigd aan gebruikers van hulpsoftware.

SC 1.4.3 Kleurcontrast van tekst is te laag

De terugknop bovenaan van de schermen heeft grijze tekst op een witte achtergrond. De kleurcontrastverhouding is te laag: 3,0:1.

Oplossing:

Deze tekst is klein, daarom moet het contrast minimaal 4,5:1 zijn.

SC 1.4.1 Toetsenbordfocus van een extern toetsenbord is alleen te zien aan verandering van kleur

Op alle schermen is voor interactieve elementen een aangepaste focusindicator ingesteld, namelijk een verandering van de achtergrondkleur. For example, on tab elements, buttons, links. Dit geldt alleen bij de bediening met een extern toetsenbord.

Het gebruik van alleen kleur om focus aan te geven is hier niet voldoende. Voor bezoekers met een visuele beperking of kleurenblindheid is zo’n subtiele kleurverandering vaak niet duidelijk genoeg. En ook mensen die met het toetsenbord navigeren moeten goed kunnen zien op welke plek van de pagina ze zijn.

Oplossing

Zorg dat er een duidelijk zichtbare focusindicator is. Hiervoor kan het beste een extra visuele aanduiding toegevoegd worden. Denk aan een dikkere rand, een onderstreping of een verandering van achtergrond.

SC 1.4.1 Actieve tab alleen aan kleur te herkennen

In het menu onderaan het scherm wordt het actieve tabblad (de knop naar het huidige scherm) alleen aangegeven door een andere kleur van icoon en tekst.

Dit kan een probleem zijn voor kleurenblinde of slechtziende bezoekers. Zij kunnen de kleuren mogelijk niet onderscheiden, en zien dus niet welke tab actief is en welke niet.

Oplossing:

Zorg ervoor dat actieve knoppen ook nog op een andere manier te herkennen zijn, bijvoorbeeld door ze te onderstrepen of vetgedrukt te maken.

SC 1.4.4 Tekst valt weg bij vergroting

In het menu onderaan het scherm, als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, wordt tekst op de knoppen afgesneden.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Start (niet ingelogd)

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm staat de kop “Inloggen”. Deze tekst is niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 4.1.2 Invoerveld heeft geen toegankelijke naam

Op dit scherm heeft het veld "E-mailadres" geen toegankelijke naam. Als het invoerveld leeg is, kondigt de schermlezer de placeholdertekst aan als het label. Maar als het invoerveld wordt gevuld, verdwijnt deze tekst en hoort de bezoeker alleen de ingevoerde waarde, niet meer wat het doel van het veld is.

Hierdoor is het voor blinde of slechtziende bezoekers die een schermlezer gebruiken niet duidelijk wat zij in moeten vullen.

Dit voldoet ook niet aan succescriterium 1.3.5 omdat het doel van het veld niet duidelijk is.

Oplossing:

Dit los je op door het invoerveld een toegankelijke naam te geven.

SC 4.1.2 Knop met het oog heeft geen toegankelijke naam

Op dit scherm ontbreekt bij de knop om het wachtwoord te tonen een toegankelijke naam. Hierdoor kunnen gebruikers van schermlezers niet begrijpen wat het doel of de bestemming van de knop is. Alle knoppen moeten een toegankelijke naam hebben die duidelijk hun functie beschrijft.

Oplossing:

Geef deze knop een toegankelijke naam.

SC 2.5.3 Zichtbare tekst van het invoerveld staat niet in de toegankelijke naam

Op dit scherm is de zichtbare tekst van het wachtwoordinvoerveld "Wachtwoord" en de toegankelijke naam is "password".

Als de toegankelijke naam van een element niet hetzelfde is als de zichtbare tekst, is het voor bezoekers die gebruikmaken van spraaksoftware niet mogelijk om het element te bedienen. Zij spreken een commando uit door de zichtbare tekst voor te lezen. Als deze niet voorkomt in de toegankelijke naam die in de code staat, werkt het commando niet.

Een soortgelijk probleem doet zich voor bij het veld "E-mailadres". De zichtbare tekst van dit veld is niet opgenomen in de toegankelijke naam.

Oplossing:

Zorg dat de toegankelijke naam de zichtbare tekst bevat, en zet deze tekst het liefst vooraan in de naam. De toegankelijke naam mag ook precies hetzelfde zijn als de zichtbare tekst.

SC 1.4.4 Tekst valt weg bij vergroten

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, worden de teksten afgesneden. De teksten op de knoppen zijn uitgesneden, bijvoorbeeld op de knop "Inloggen". Hetzelfde geldt voor de tekst die de bezoeker invoert in de invoervelden.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Start (ingelogd) > inloggen

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm zijn er koppen zoals “Hoe wij persoonsgegevens verwerken”, “Contactgegevens”, “Verwerken van persoonsgegevens”, en andere. Deze tekst is echter niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 4.1.2 Toestand van de selectievakje is niet vastgelegd in de code

Op dit scherm heeft een selectievakje met de tekst "Ik ga akkoord" meerdere toestanden (aangevinkt, niet aangevinkt), maar ontbreekt een programmatische indicatie van de huidige toestand. Blinde bezoekers weten daardoor niet wat de toestand is van het selectievakje.

Oplossing:

Zorg dat de toestand van het selectievakje ook in de code wordt weergegeven.

SC 1.4.4 Tekst valt weg bij vergroten

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, wordt de tekst op de knop "Ga naar de deur" afgesneden. Bovendien wordt de tekst van de hoofdinhoud niet vergroot.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Vul een toegangscode in > Welkom bij Eteck

SC 1.3.1 Kop is niet gemarkeerd als koptekst

In de caroussel staan koppen: "Welcom bij MijnEteck", “Regel het eenvoudig zelf”, “Heb je een storing?”. Deze tekst is niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 1.4.11 Stippen hebben onvoldoende contrast (carrousel)

Op dit scherm staat een caroussel. De grijze bolletjes die aangeven hoeveel slides er zijn, hebben een contrast van 1,3:1 op de witte achtergrond.

Oplossing

Maak deze stippen donkerder zodat het contrast minimaal 3,0:1 wordt.

Pad: Start (ingelogd) > Overzicht

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm staan kopjes "Overzicht” en “Zelf regelen”. Deze tekst is niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 4.1.2 Link heeft geen correcte toegankelijke rol

Op dit scherm heeft de link met de tekst "Maandbedrag" niet de juiste toegankelijke rol.

Elk element heeft standaard een bepaalde rol. Dit betekent dat het element bepaalde eigenschappen en functies heeft om informatie aan de bezoeker te geven of om informatie van de bezoeker te ontvangen. De rol bepaalt dus wat het element doet. Schermlezers en andere hulpmiddelen moeten de correcte rol van elk element kennen. Zo kunnen ze op een slimme manier met het element omgaan en aan de bezoeker uitleggen wat het element doet.

Oplossing:

Zorg dat de link de juiste rol heeft.

Pad: Start > Maandbedrag

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm staan (tussen)kopjes "Maandbedrag”, “Opbouw maandbedrag”, “Zelf regelen”, en anderen, die niet als kopteksten zijn gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 1.3.2 Leesvolgorde is niet logisch

Op dit scherm staat de knop “Wijzigen” naast "Je betaalt 50 euro”. De schermlezer leest nu voor: “Je betaalt Wijzigen 50 euro”. Dit is geen logische leesvolgorde.

Oplossing

Zorg ervoor dat tekst die bij elkaar hoort in de juiste volgorde wordt gelezen door schermlezers.

SC 4.1.2 De status van knoppen wordt niet correct voorgelezen

Op dit scherm wordt de knop “Voorschot” die verborgen inhoud toont en verbergt altijd aangekondigd als “uitgeklapt”, zelfs wanneer deze is gesloten. Dit kan schermlezergebruikers in verwarring brengen over of de inhoud daadwerkelijk beschikbaar of verborgen is.

Oplossing

Zorg ervoor dat de toestand van de knop correct is ingesteld, zodat schermlezers de juiste staat aankondigen.

SC 1.3.1 De accordeon heeft geen koppen of de rol van kop is overschreven

Op dit scherm in een sectie met verborgen inhoud "Voorschot € 199,00", mist het element dat verborgen inhoud opent en sluit de rol van een koptekst. De teksten waarmee je delen van een accordeon kunt inklappen en uitklappen, doen dienst als koppen voor de inhoud van deze delen. Daarom moeten deze teksten ook de rol van kop hebben.

Oplossing:

Markeer deze tekst als kop of zorg dat de bestaande rol van kop niet wordt overschreven.

SC 1.4.4 Tekst valt weg bij vergroting

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, wordt de tekst op de knop "Wijzigen" geknipt. Hetzelfde wordt waargenomen bij de tekst op de knop "Voorschot wijzigen" die zich in de sectie met verborgen inhoud bevindt. De tekst "/mnd" onder "Je betaalt" is niet zichtbaar. Daarnaast overlappen de tekstdelen op de knop "Voorschot € 251,00" elkaar.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Start > Maandbedrag > Voorschot wijzigen

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm staan tussenkopjes "Voorschot wijzigen" en “Samenvatting”. Deze teksten zijn niet als koptekst gemarkeerd. Hetzelfde probleem wordt waargenomen bij de kop "Waarom je voorschot wijzigen?” in de popup die wordt geopend door “Nieuw voorschot” link en met de koppen “Bedankt voor het doorgeven van je wijziging!” en “Samenvatting” in de popup die wordt geopend door “Voorschot wijzigen” knop.

Oplossing:

Maak hier een kop van.

SC 1.3.1 De accordeon heeft geen koppen of de rol van kop is overschreven

Op dit scherm in een sectie met verborgen inhoud "Voorschot € 199,00", mist het element dat verborgen inhoud opent en sluit de rol van een koptekst.

Oplossing:

Markeer deze tekst als kop of zorg dat de bestaande rol van kop niet wordt overschreven.

SC 4.1.2 Knop heeft geen toegankelijke naam

Op dit scherm staat in de slider de knop “Huidig”. Deze knop heeft geen toegankelijke naam. Hierdoor kunnen schermlezergebruikers niet begrijpen wat het doel of de bestemming van de knop is.

Omdat de zichtbare tekst van de knop niet is opgenomen in de toegankelijke naam, kan deze knop niet worden bediend met spraakgestuurde software (SC 2.5.3).

Oplossing:

Alle knoppen moeten een toegankelijke naam hebben die hun functie duidelijk beschrijft.

SC 1.3.1 Informatie uit de slider wordt niet aangekondigd voor schermlezers

Er staat een slider op het scherm, maar gebruikers van schermlezers horen alleen de waarden "15 euro" en "500 euro" zonder te weten wat deze bedragen betekenen.

Oplossing

Maak deze informatie en functionaliteit toegankelijk voor een blinde bezoeker.

SC 2.1.1 De schuifregelaar kan niet via het toetsenbord worden bediend.

Op dit scherm kunnen de schuifregelaar en de knop "Huidig" niet worden bediend met het externe toetsenbord.

Oplossing:

Zorg dat alle interactieve elementen met het toetsenbord kunnen worden bediend.

SC 1.4.11 De kleur van de slider heeft niet genoeg contrast

Op dit scherm is de contrastverhouding tussen de grijze schuifregelaar en de achtergrond van het scherm van invoervelden 1,3:1. Een bezoeker met milde visuele beperkingen zal deze slider niet goed zien.

Oplossing:

De randen van interactieve elementen moeten minimaal een contrast van 3,0:1 hebben met de achtergrond.

SC 4.1.2 De status van knoppen wordt niet correct voorgelezen

Op dit scherm wordt de knop “Oud maandbedrag € 199,00” die verborgen inhoud toont en verbergt altijd aangekondigd als “uitgeklapt”, zelfs wanneer deze is gesloten. Dit kan schermlezergebruikers in verwarring brengen over of de inhoud daadwerkelijk beschikbaar of verborgen is.

Oplossing

Zorg ervoor dat de uitklaptoestand van de knop correct is ingesteld, zodat schermlezers de juiste staat aankondigen.

SC 4.1.2 Het is niet in code vastgelegd of secties van de accordeon open of dicht zijn

Op dit scherm is de open of gesloten status van de sectie "Nieuw maandbedrag € 197,00" visueel zichtbaar, maar niet programmatisch gecommuniceerd naar schermlezers.

Voor bezoekers die het scherm kunnen zien, is het duidelijk of een sectie in- of uitgeklapt is. Maar voor blinde of slechtziende bezoekers die een schermlezer gebruiken is dat niet zo.

Hetzelfde probleem wordt waargenomen bij de accordeonknoppen op de pop-up "Bedankt voor het doorgeven van je wijziging!" die verschijnt nadat de bezoeker op de knop "Voorschot wijzigen" heeft geklikt.

Oplossing:

Zorg ervoor dat de status van de verborgen inhoud wordt doorgegeven aan gebruikers van schermlezers.

SC 4.1.2 Knop heeft niet de juiste toegankelijke rol en toegankelijke naam

Op dit scherm wordt bij het activeren van de link "Nieuw voorschot" de popup "Waarom je voorschot wijzigen?" weergegeven. Er staat een "X"-knop op deze popup. Deze knop mist een toegankelijke rol en toegankelijke naam.

Oplossing:

Zorg dat de knop de juiste toegankelijke rol en toegankelijke naam heeft.

Pad: Start > Contact

SC 1.3.1 Kop is niet gemarkeerd als koptekst

De tussenkopjes "Contact”, “Storingen”, “Veelgestelde vragen”, “Digitaal contact” en anderen zijn niet als kopteksten gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 2.5.8 De grootte van een element voldoet niet

Op dit scherm staan de links onder "Storingen" zo dicht op elkaar dat het klikgebit kleiner is dan 24px.

De oppervlakte waarop geklikt kan worden (het ‘doelgebied’) bij knoppen, links en andere interactieve elementen moet groot genoeg zijn. Anders is het voor bezoekers met een motorische beperking lastig om op het goede element te klikken. Daarom moeten elementen óf een oppervlakte hebben van minimaal 24 bij 24 CSS-pixels, óf voldoende uit elkaar geplaatst zijn. Om te bepalen of klikbare elementen ver genoeg uit elkaar staan, teken je een denkbeeldige cirkel met een diameter van 24 pixels in het midden van het doelgebied. Deze cirkel mag op geen enkele plek (de cirkel van) een ander doelgebied raken.

Oplossing:

Voeg extra ruimte toe tussen deze links.

Pad: Start > Meer

SC 1.3.1 Kop is niet gemarkeerd als koptekst

De (tussen)kopjes "Meer”, “Betalingen”, “Storingen”, “Documenten” en anderen zijn niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 2.4.6 De naam van de knop beschrijft niet wat de knop betekent

Op dit scherm, onder “Wat vind je van de app?”, staan knoppen met smilies. De teksten die worden voorgelezen zijn: “enigszins lachend gezicht”, “neutraal gezicht” en “licht fronsend gezicht”. Deze knoppen staan voor: goed, neutraal en niet goed.

Hetzelfde probleem wordt waargenomen bij twee andere knoppen met neutrale en treurige smilies die doorsturen naar de webpagina van de klantenservice. Overweeg het gebruik van een meer beschrijvende naam zoals "Ik ben niet tevreden - neem contact op met de klantenservice".

Oplossing:

Voeg tekst toe die deze knop goed beschrijft. Overweeg om een meer beschrijvende naam te gebruiken zoals "Ik ben tevreden".

SC 4.1.2 Link heeft geen correcte toegankelijke rol

Op dit scherm hebben de interactieve elementen die naar corresponderende schermen leiden, zoals met de tekst "Betalingen Overzicht van facturen", geen juiste rol. Hetzelfde probleem wordt waargenomen bij de interactieve elementen met emoji's in het gedeelte "Wat vind je van de app?”.

Oplossing:

Zorg dat deze links de juiste rol (link of button) krijgen.

SC 1.4.4 Tekst valt weg bij vergroting

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, wordt de tekst “klantnummer 183744" afgesneden. Hetzelfde geldt voor de teksten onder "Mijn gegevens", "Communicatie-voorkeuren". De tekst op de knop "Uitloggen" is ook geknipt.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Meer > Mijn gegevens

SC 1.3.1 Kop is niet gemarkeerd als koptekst

De tussenkopjes "Mijn gegevens”, “Persoonlijke gegevens”, “Account”, “Adres” en anderen zijn niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 2.4.6 Er zijn knoppen met dezelfde tekst maar een andere functie

Op dit scherm zijn er knoppen met dezelfde naam "Wijzigen", maar ze hebben verschillende functies. Dit kan verwarrend zijn voor bezoekers.

Oplossing:

Zorg dat knoppen met dezelfde tekst dezelfde functie hebben. Als het om een andere functie gaat, moet de knop tekst ook anders zijn.

SC 4.1.2 Invoervelden hebben geen toegankelijke namen

Op dit scherm heeft het veld "E-mailadres" geen toegankelijke naam. Als het invoerveld leeg is, kondigt de schermlezer de placeholder aan als het label. Maar als het invoerveld is gevuld, verdwijnt deze tekst en hoort de bezoeker alleen de ingevoerde waarde, niet meer het doel van het veld. Hetzelfde probleem wordt waargenomen bij de velden: "Bij storingen", "Bij overige zaken (incl facturen)" en "Telefoonnummer" in het gedeelte "Contact".

Hierdoor is het voor blinde of slechtziende bezoekers die een schermlezer gebruiken niet duidelijk wat zij in moeten vullen.

Dit voldoet ook niet aan succescriterium 1.3.5 omdat het doel van het veld niet duidelijk is. Omdat de zichtbare tekst van de velden niet is opgenomen in de toegankelijke naam, kan deze velden niet worden bediend met spraak (SC 2.5.3).

Oplossing:

Dit los je op door het invoerveld een toegankelijke naam te geven.

SC 1.4.4 Tekst valt weg bij vergroting

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, de teksten op de knoppen zijn afgesneden, zie bijvoorbeeld, “Wijzigen” button.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Meer > Storingen

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm zijn de tussenkopjes "Storingen", “Mijn meldingen”, “Zelf regelen” niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 1.3.1 Informatie is niet toegankelijk voor schermlezers

Schermlezer leest de inhoud van een melding onder “Mijn meldingen” niet voor. In plaats van tekst zoals “Individueel (Warmte)” en de rest van de melding, hoort de schermlezergebruiker alleen de naam van de knop (“open details”).

Omdat de zichtbare tekst van de tekst op de knop verschilt, is deze knop niet met stem te bedienen (SC 2.5.3).

Oplossing

Zorg ervoor dat alle informatie en relaties die zichtbaar zijn op het scherm ook beschikbaar zijn voor schermlezers.

SC 1.4.4 Tekst valt weg bij vergroting

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, wordt de tekst op de knop “Meld een storing” afgesneden.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Meer > Communicatie-voorkeuren

SC 1.3.1 Kop is niet gemarkeerd als koptekst

De tussenkopjes "Communicatie-voorkeuren”, “Hoe mogen we je bereiken?”, “Zelf regelen” is niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

Pad: Meer > Betalingen

SC 1.3.1 Kop is niet gemarkeerd als koptekst

De (tussen)kopjes "Betalingen”, “Openstaande facturen”, “Betaalde facturen”, “Zelf regelen” zijn niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 1.4.3 Kleurcontrast van tekst is te laag

Op dit scherm onder "Je openstaande bedrag is" heeft de tekst "€ 997,57" een grijze kleur op de lichtgrijze achtergrond. De contrastverhouding is 2,1:1. Dit moet minstens 3,0:1 zijn omdat het een grote tekst is.

Oplossing:

Zorg ervoor dat de contrastverhouding minstens 3,0:1 is.

SC 1.3.1 De accordeon heeft geen koppen

Op dit scherm in secties met verborgen inhoud, bijvoorbeeld "maart 2025 € 650,34 Betaal factuur voor 24 februari 2025", mist het element dat verborgen inhoud opent en sluit de rol van een koptekst. De teksten waarmee je delen van een accordeon kunt inklappen en uitklappen, doen dienst als koppen voor die delen. Daarom moeten deze teksten ook de rol van kop hebben.

Oplossing:

Markeer deze tekst als kop of zorg dat de bestaande rol van kop niet wordt overschreven.

SC 4.1.2 De status van knoppen wordt niet correct voorgelezen

Op dit scherm wordt de knop “maart 2025 € 650,34 Betaal factuur voor 24 februari 2025” die verborgen inhoud toont en verbergt altijd aangekondigd als “uitgeklapt”, zelfs wanneer deze is gesloten. Dit kan schermlezergebruikers in verwarring brengen over of de inhoud daadwerkelijk beschikbaar of verborgen is. Hetzelfde probleem wordt waargenomen bij de rest van de knoppen die verborgen inhoud openen en sluiten.

Oplossing

Zorg ervoor dat de uitklaptoestand van de knop correct is ingesteld, zodat schermlezers de juiste staat aankondigen.

SC 2.4.4 Er zijn links met dezelfde tekst maar een andere bestemming

Op dit scherm bevat de verborgen inhoud onder "Openstaande facturen" en “Betaalde facturen” verschillende links met dezelfde naam "Download factuur", maar de facturen die ze openen zijn niet hetzelfde. Dit kan verwarrend zijn voor bezoekers.

Hetzelfde probleem wordt waargenomen bij links met dezelfde tekst "Bekjik alle facturen" of "Toon alleen laatste drie facturen".

Oplossing:

Zorg dat links met dezelfde tekst ook naar dezelfde bestemming leiden of dezelfde functie hebben. Als het om een andere bestemming gaat, moet de linktekst ook anders zijn.

SC 3.2.2 Als je een knop selecteert, verschuift de focus

Op dit scherm zorgt het selecteren van de knop “Bekijk alle facturen” (of “Toon alleen laatste drie facturen” wanneer een lijst met facturen is geopend) met een extern toetsenbord ervoor dat de toetsenbordfocus onverwacht naar de bovenkant verplaatst wordt. Bezoekers worden niet vooraf geïnformeerd over deze contextwijziging.

Een contextwijziging, zoals het verplaatsen van focus, mag niet zomaar plaatsvinden als een bezoeker iets in een formulier aanpast. Het mag dus bijvoorbeeld niet gebeuren als een bezoeker een keuzevakje aanvinkt, een invoerveld invult of een optie uit een keuzelijst selecteert. Andere voorbeelden van grote contextwijzigingen zijn het verzenden van een formulier of het openen van een nieuw venster. Zulke contextwijzigingen mogen alleen gebeuren als de bezoeker van tevoren is gewaarschuwd.

Oplossing:

Zorg ervoor dat de focus naar het volgende logische element gaat na het selecteren van "Bekjik alle facturen" of "Toon alleen laatste drie facturen".

SC 1.4.3 Kleur van link met focus heeft niet voldoende contrast

Oplossing:

Zorg dat de kleur van de link bij toetsenbordfocus minimaal een contrast van 4,5:1 met de achtergrond heeft.

SC 1.4.4 Tekst valt weg bij vergroting

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, worden de teksten in de secties met verborgen inhoud onder “Openstaande facturen” afgesneden, zie bijvoorbeeld “januari 2025 € 73,31 Factuur status: Aanmaning”.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Meer > Documenten

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm zijn de kopjes "Documenten", “MijnEteck - Informatie”, “MijnEteck - Tarieven”, “Zelf regelen” niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

Pad: Meer > Voorkeuren

SC 1.3.1 Kop is niet gemarkeerd als koptekst

De tussenkopjes "Voorkeuren”, “App beveiligingen”, “Beveiliging app” en anderen zijn niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 4.1.2 Toestand van de schakelknop is niet vastgelegd in de code

Op dit scherm hebben de schakelknoppen meerdere toestanden (bijvoorbeeld ingedrukt, niet ingedrukt), maar ontbreekt een programmatische aanduiding van hun huidige toestand.

Hierdoor kan hulpsoftware deze informatie niet doorgeven. Blinde bezoekers weten daardoor niet wat de toestand is van de knop.

Oplossing:

Zorg dat de toestand van de knop ook in de code wordt weergegeven.

SC 4.1.2 Schakelknoppen hebben geen toegankelijke namen

Op dit scherm missen meerdere schakelknoppen een toegankelijke naam.

Hierdoor begrijpen bezoekers die een schermlezer gebruiken niet wat de functie is van de knoppen.

Oplossing:

Zorg ervoor dat elke knop een toegankelijke naam heeft die de functie duidelijk beschrijft.

SC 1.4.11 Contrast van knoppen is te laag

Op dit scherm hebben de wisselknoppen, als ze uit staan, een witte kleur op de lichtgrijze achtergrond. De contrastverhouding is 1,2:1. De schakelknop onder "Beveiliging app" heeft de witte kleur schakelknop op de roze achtergrond met een contrastverhouding van 2,5:1.

Oplossing:

Zorg voor een minimaal contrast van 3,0:1.

SC 1.4.4 Tekst valt weg bij vergroting

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, wordt de tekst “Nieuws over mijn project” afgesneden.

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.

Pad: Meer > Storingen > Individueel (Warmte)

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm zijn de tussenkopjes "Individueel (Warmte)", “Service ticket code: S000118573”, “Historie”, en anderen niet als koptekst gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 1.3.1 Aantal alinea’s in de code is anders dan de visuele weergave

Op het scherm staat een kopje “Service ticket code: S000118573” en meerdere alinea’s tekst met de inhoud van de storing. Deze tekst wordt als een blok tekst voorgelezen.

Een blinde bezoeker kan niet in het midden van deze tekst naar een stukje luisteren. Het hele blok moet opnieuw worden voorgelezen. Dit is ontoegankelijk.

Oplossing

Plaats deze alinea’s in afzonderlijke alinea’s.

Pad: Privacy statement > Ik ga akkoord > Vul een toegangscode in

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm staat de kop “Vul een toegangscode in”. Deze teksten zijn niet als koptekst gemarkeerd. Hetzelfde probleem wordt waargenomen bij de kop "Herhaal de toegangscode" die wordt weergegeven nadat een bezoeker een 4-cijferige code heeft ingevoerd.

Oplossing:

Maak hier koppen van.

Opmerking: de invoervelden om de code aan te maken reageren niet op de aanraking. Dit is een probleem voor alle bezoekers, niet alleen mensen met beperkingen.

SC 4.1.2 Invoervelden hebben geen toegankelijke rol of naam

De invoervelden om de toegangscode in te toetsen hebben geen toegankelijke rol en geen naam. De schermlezer leest ze helemaal niet voor.

Oplossing:

Deze velden moeten zichtbaar zijn voor de schermlezer.

SC 3.2.2 Focus wordt automatisch verplaatst na input

Op dit scherm staan vier invoervelden om de toegangscode in te vullen. Als in een veld een cijfer wordt ingevuld, springt de focus naar het volgende invoerveld. De focus mag niet automatisch verspringen. Dit gebeurt ook als de cijfers worden verwijderd.

Oplossing:

Beperk de focus tot een invoerveld.

SC 1.4.1 Kleur wordt gebruikt om het huidige actieve invoerveld aan te geven

Op dit scherm gebruiken de invoervelden om de toegangscode in te voeren alleen kleur om aan te geven welk veld momenteel actief is en welk niet. Als kleur wordt gebruikt om aan te geven dat een veld actief is, moet het contrast tussen het actieve en niet-actieve veld minstens 3,0:1 zijn.

Oplossing:

Dit kan worden opgelost door een kleur te kiezen voor de actieve status met een hoger contrast, of door een extra visuele aanwijzing te gebruiken, zoals een dikkere rand.

Pad: Start > Verbruik

SC 1.3.1 Kop is niet gemarkeerd als koptekst

Op dit scherm staan koppen “Verbruik”, “Vergelijken”, “Koude december” en “Zelf regelen”. Deze teksten zijn echter niet als kopteksten gemarkeerd.

Oplossing:

Maak hier een kop van.

SC 4.1.2 Interactieve elementen hebben geen juiste toegankelijke rol

Op dit scherm hebben de volgende interactieve elementen geen passende rol: “Maand” en “Jaar”. Hetzelfde probleem wordt waargenomen bij een interactief element dat schakelt tussen twee opties: "Energie" en "€" om relevante inhoud weer te geven. Het mist echter een passende rol.

Oplossing:

Zorg ervoor dat deze elementen de juiste rol hebben.

SC 2.4.6 Toegankelijke naam is niet betekenisvol

Op dit scherm is er een interactief element dat schakelt tussen twee opties "Energie" en "€" om relevante inhoud weer te geven. Wanneer echter een van beide opties wordt geselecteerd, heeft het element nog steeds dezelfde toegankelijke naam: "Energie €". Dit kan verwarrend zijn, vooral voor gebruikers van schermlezers. Dit voldoet ook niet aan succescriterium 4.1.2, omdat dit betekent dat gebruikers van schermlezers geen informatie krijgen over welke optie op dat moment is geselecteerd.

Oplossing:

De toegankelijke naam moet de functie van het interactieve element weergeven, zodat bezoekers met hulpsoftware weten welke optie geselecteerd kan worden. Bezoekers die gebruik maken vanhulpsoftware moeten ook weten welke optie op dat moment geselecteerd is.

SC 1.1.1 Informatie is niet toegankelijk voor schermlezers

De grafiek onder “Koude december” de grafiek met de tekst “Buurt” wordt niet voorgelezen.

Oplossing

Zorg ervoor dat alle informatie ook beschikbaar is voor schermlezers.

SC 1.4.3 Kleurcontrast van tekst is te laag

Oplossing:

Het contrast moet minimaal 3,0:1 zijn.

SC 1.4.4 Tekst valt weg bij vergroting

Als je de tekst vergroot tot de maximale grootte in de instellingen van je telefoon, de tekst op de knop “Hoe en wanneer meten we dit?” is afgesneden. Hetzelfde wordt waargenomen bij de tekst op het interactieve element "Energie €".

Oplossing:

Zorg ervoor dat tekst leesbaar blijft wanneer deze wordt vergroot.