Accessibility issues
Kilian opened this issue · 2 comments
Kilian commented
To keep track of accessibility issues the site may have:
- lack of (keyboard) focus styles
- heading structure can be improved
- all h4's in the form should be
<label>
s with proper for attributes - some fields have no labels
contrast issues:
- .text-cvs-gold on #5d7979 is not sufficient on cta block
- .text-cvs-green-dark on #e7f4f7 is not sufficient on list of symptoms and in footer
- .text-red-500 on #e7f4f7 is not sufficient on list of symptoms
- .text-cvs-red on #cde2e2 in form not sufficient
Kilian commented
Suggestion for more accessible heading structure by @julezrules:
current:
1 Help ons de verspreiding van het coronavirus te ontdekken en voorspellen in uw omgeving
2 Ongemelde gevallen
2 Anoniem bijdragen
2 Inzichtelijk voor iedereen
2 Alles is open
3 Totaal ingezonden
3 Geïnfecteerd / is getest
3 In nauw contact met een geïnfecteerde
3 Hebben symptomen
3 Meld uw gezondheidstoestand
3 Demografie en geografie
4 Uw leeftijd
4 Biologisch geslacht/sekse
4 Postcode (zonder letters)
2 Testen en symptomen
4 Bent u in nauw contact geweest met iemand die positief is getest op COVID-19?
4 Bent u getest op COVID-19?
4 Symptomen die u heeft of hebt gehad
4 Bent u gediagnostiseerd met één van de volgende aandoeningen?
4 Momenteel ben ik
4 Roken
4 Wat is uw huidige lichaamstemperatuur? (Celcius)
2 Hoe worden mijn gegevens gebruikt?
better:
<H1> coronastatus.nl ---> ALLEEN OP DE HOMEPAGE
<P> Help ons de verspreiding van het coronavirus te ontdekken en voorspellen in uw omgeving
<H2> Ongemelde gevallen
<H2> Anoniem bijdragen
<H2> Inzichtelijk voor iedereen
<H2> Alles is open
<H2> Cijfers ----> NIEUW KOPJE: VISUALLY-HIDDEN/SCREENREADER-ONLY
<LI> Totaal ingezonden 1083
<lI> Geïnfecteerd / is getest 1/2 -----> IS DAT EEN HALF???
<LI> In nauw contact met een geïnfecteerde 51
<LI> Hebben symptomen 662
<H2> Meld uw gezondheidstoestand
<H3> Demografie en geografie ----> MAG OOK FIELDSET ZIJN T/M VELD POSTCODE
<LABEL> Uw leeftijd
<FIELDSET><LEGEND> Biologisch geslacht/sekse
<LABEL> Postcode (zonder letters)
<h3> Testen en symptomen ----> MAG OOK FIELDSET ZIJN T/M HUIDIGE LICHAAMSTEMPERATUUR
<FIELDSET><LEGEND> Bent u in nauw contact geweest met iemand die positief is getest op COVID-19?
<FIELDSET><LEGEND> Bent u getest op COVID-19?
<FIELDSET><LEGEND> Symptomen die u heeft of hebt gehad
<FIELDSET><LEGEND> Bent u gediagnostiseerd met één van de volgende aandoeningen?
<FIELDSET><LEGEND> Momenteel ben ik
<FIELDSET><LEGEND> Roken
<LABEL> Wat is uw huidige lichaamstemperatuur? (Celcius)
<H3> Hoe worden mijn gegevens gebruikt? ----> MAG OOK FIELDSET ZIJN TOT DE KNOP
<H2> OVER DE SERVICE ----> IS NU DIV
Kilian commented
PR is ready, closing this.