Een toegankelijke website maken met het Anysurfer label

In het kader van gelijke kansen in Vlaanderen,  ben ik donderdag  naar de Anysurfer opleidingsdag geweest.  Hieronder enkele notities die ook u kunnen helpen bij het bouwen van een toegankelijke website:

  1. Anysurfer staat garant voor een groter bereik, een betere Google optimalisatie en codes die voldoen aan de webstandaard van het W3C.
  2. Er is heel wat hard-en software voor mensen met een handicap bv; een toestel dat het mogelijk maakt om doormiddel van kaakspier contracties te typen, of door middel van te blazen of te zuigen op een buisje, de muis te besturen.
  3. Semantiek is ook voor Anysurfer zeer belangrijk (dus niet alleen om google te plezieren).
  4. PDF en Word (.doc) files moeten ook voldoen aan toegankelijkheidsnormen (helaas is hier niet verder op ingegaan, maar er zijn cursussen van Anysurfer die pdf en Word behandelen).
  5. De meeste open-source platformen zijn geschikt (Joomla, Wordpress, Typo3), maar Drupal was/is toch zeker één van de betere door zijn backend die standaard al heel toegankelijk is.
  6. Een functie om lettertypes aan te passen. Mensen met een handicap zijn meestal wel voorzien van hun eigen hard en/of software die dit voor hun doet.
  7. Een alt omschrijving voor afbeeldingen is niet enkel goed voor Google, ook screenreaders gebruiken de alt-tag. Maak daarom uw alt omschrijven niet langer als 80 karakters, zorg dat ze duidelijk en niet repetetief zijn, 15 foto's met 15 maal dezelfde alt omschrijving is zeer irretant op een screenreader.
  8. Zorg voor een toegankelijke captcha, Mollom is één van de betere maar heeft als nadeel dat het bestaat uit een flash applicatie.
  9. NVDA is een open-source screenreader (ideaal om te testen, en ik moet in eerlijkheid bekennen dat deze website nog aandacht vraagt om toegankelijk te zijn voor alle doelgroepen).
  10. Links kan je best altijd onderlijnen (mensen met een visuele handicap zien niet altijd het verschil tussen blauwe tekst voor de link en zwarte voor de reguliere tekst.
  11. Sliders en andere animaties zijn best voorzien van een pause of stop knop.
  12. Is alles bereikbaar met de tab-toets?
  13. Is de focus toegekend in de css? druk op de tabtoets, je zal merken dat er rond de link waar je u zich dan bevindt een stippen kader gaat staan, dit is de focus.
  14. Is diezelfde focus activeerbaar (enter) met het keyboard ?
  15. Flash is niet toegankelijk via het keyboard en daardoor ook niet toegankelijk voor alle mensen.
  16. Voor de breadcrumb een label plaatsen als 'u bent hier' is handig voor blinden.
  17. Bouw je website op een logische (te voorspellen) manier: header, navigatie, sidebar(s) + content, footer.
  18. Als je een websites maakt voor een klant moet deze ook willen meewerken en van de nodige kennis voorzien worden. Een website die het Anysurfer label behaald kan door slecht geplaatste inhoud zijn label kwijtspelen.
  19. Volgens de toegankelijkheidsmonitor van 2010 was slechts 1 op 10 websites in Belgie toegankelijk voor hulpbehoevende mensen.
  20. Ook video's moeten toegankelijk zijn:
  • Video's waar gesproken taal in voorkomt moet je ondertitelen.
  • Plaats ook een tekst versie van de video, niet iedereen heeft de mogelijkheid om te kijken, met een transcript zorg je dat mensen met een screenreader toch uw boodschap ontvangen.
  • Gebruik NOOIT autoplay (zeer irritant voor mensen met een screenreader).
  • Als uw video service gebruikt maakt van flash, zorg dan dat deze toegankelijk is door html toe te voegen, flash is niet toegankelijk!

Dit zijn enkele notities die ik tijdens de opleidingsdag van Anysurfer als interresant bestempelde. Er is nog heel wat meer besproken, en als u zich echt wil specialiseren op dit vlak kan u altijd een afspraak maken bij Anysurfer voor een opleiding binnen uw bedrijf of op hun locatie. Voor mij was deze opleiding een aangename en leerzame dag, zeker een aanrader!

Add new comment

Restricted HTML

  • Allowed HTML tags: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.