Vandaag heb ik mijn WCAG audit deeltaak gepresenteerd. Daarna heb ik hier feedback op gekregen van mijn mentor in Portflow. Daarna hebben we een workshop gekregen over user experience. Hierin hebben we bij verschillende elementen tips gekregen om betere html (en ook met behulp van css state selectors betere CSS) te schrijven

• Het target attribuut in CSS
• ::backdrop selector
• de fieldset en legend selectors

Als je de gebruiker ergens op wil laten klikken EN ergens naartoe wilt sturen. Dan gebruik je een en geen Verder kan je met een anchor link (href="#elementID") de pagina laten scrollen. Op dit moment kan je ook met CSS met behulp van (::target) het element targteten in CSS waarnaar gescrolled is. Verder kan je met de download attribuut de user een link laten downloaden. Dit kan een html pagina zijn, maar ook een afbeelding op een server.

Het is belangrijk om duidelijke alt attributen toe te voegen aan je website zodat gebruikers met slecht internet nog wel kunnen zien waar de afbeelding over gaat. Als er tekst in de afdbeelding staat, probeer dit zo duidelijk in de alt tekst te vermelden.

Sommige invoervelden zijn klein en op telefoon moeilijk aanklikbaar. Denk maar aan een checkbox, of een radio button. Hier is het handig om een label om een invoerveld te plaatsen. Hierdoor kan je ook op de tekst (de label) klikken om het invoerveld te bereiken.

Ook is het handig om een focus attribuut toe te voegen aan je invoervelden, zodat het duidelijk is dat een invoerveld geselecteerd is.

Als je een goede headings-nest structuur gebruikt kunnen screenreadfeers er een mooie inhoudsopgave van maken. Ook zorgt dit vboor nettere HTML

Accordeons is een veelgebruikte tool bij het maken van websites. Je ziet op bijna elke FAQ sectie wel een accordeon section staan. Hiermee kan je content limiteren op je website, maar ook weer niet. Dit komt omdat je uitklapbare stukken tekst hebt. Ook kan je heirmee ervoor zorgen dat telkens maar een tabje geopend is.

Popups kan je ook heel makkelijk maken zonder JS te gebruiken:
` Open iets

Dit staat in een popup/overlay/popover.

Leuk he.

Sluit dit ding weer `