Behaal het Waarmerk drempelvrij!

Voor optimale toegankelijkheid van je website is het van belang rekening te houden met bezoekers die bijvoorbeeld een visuele beperking hebben of doof zijn. Tijdens de bouw van een website komt dit terug in alle facetten van de ontwikkeling: visueel ontwerp, front- en back-end development. Ook dient er bij het beheer van de website na de oplevering rekening te worden gehouden met het voorkomen van drempels.

Als je op al deze fronten voldoende toegankelijk bent, kan je bij de Stichting Accessibility aankloppen om een keuring van je website uit te laten voeren en je website zo drempelvrij te laten verklaren!

 

AWT DrempelvrijVoor de Adviesraad voor het Wetenschaps- en Technologiebeleid (AWT) behaalde Insyde recentelijk het Certificaat van toegankelijkheid. In dit weblog lees je meer over het Waarmerk en over onze bevindingen tijdens het ontwikkelen van een website met het Waarmerk in het vizier.

Het Waarmerk drempelvrij

Het Waarmerk drempelvrij.nl is een kwaliteitsmerk dat gegeven wordt aan toegankelijke Nederlandse websites. Diverse inspectie-instellingen keuren op verzoek websites, waarna vervolgens wordt bepaald of een website voldoende toegankelijkheid biedt voor het dragen van het keurmerk.

Er wordt ook gekeken naar het niveau van het keurmerk dat een website mag dragen. Er zijn namelijk drie niveau's waarop een website geïnspecteerd kan worden, waarbij de eerste twee niveaus gaan over de toegankelijkheid van de website. Voor websites van de overheid is het behalen van het derde niveau veplicht, namelijk het voldoen aan alle kwaliteitsaspecten van de aangeboden content.

Niveau's Waarmerk drempelvrij
Verschillende toegankelijkheidsniveau's binnen het Waarmerk drempelvrij

Websites met een niveau 1 waarmerk voldoen aan de basiseisen voor toegankelijkheid. Het toont aan dat je actief bent bezig geweest met het toegankelijk maken van je website door bijvoorbeeld te zorgen voor een juiste opmaak van tabellen en plaatjes te voorzien van alternatieve beschrijvingen.

Deze basiseisen maken het veel CMS gedreven websites al lastig, omdat het CMS geen goede handvatten biedt om de uitvoer juist op te maken. Door gebruik te maken van ons eigen Webmagiër CMS kunnen klanten ten alle tijden hun website zo inrichten dat de prioriteit 1 toegankelijkheid niet in het geding komt. Hier komt echter wel een stukje kennis en goede wil van de betrokken webredacteur bij kijken. Door alleen al de HTML bron van de website op orde te maken maak je het mensen met een visuele handicap al veel gemakkelijker om je website te gebruiken.

Websites met een niveau 2 waarmerk zijn nog beter toegankelijk voor mensen met een visuele beperking en voldoen ook aan een aantal extra eisen, zoals minimale contrasteisen en betere toegankelijkheid van webformulieren.

Websites die voldoen aan het derde niveau van het Waarmerk drempelvrij, voldoen aan de eerder gestelde eisen en tevens aan kwaliteitsaspecten zoals klantvriendelijkheid en toegankelijkheid voor mensen met een functiebeperking en ouderen.

Oranje keurmerkNaast bovengenoemde niveau's met bijbehorende logo's kun je ook het oranje logo tegenkomen op website. Het oranje logo mag gebruikt worden door websites die na inspectie blijken te voldoen aan 12 punten van prioriteit 1.

Waarom drempelvrij?

Met een drempelvrije website sta je toegankelijkheid voor bezoekers met een visuele, auditieve, verstandelijk en-of motorische handicap niet in de weg. Je gaat bewust om met bezoekers die bijvoorbeeld kleurenblind zijn, die dyslexie hebben of mensen waarvan Nederlands niet de voertaal is. Daarnaast zijn er ook commerciële voordelen aan het hebben van een drempelvrije website.

  • Je website is goed vindbaar
    Doordat er geen fouten in je HTML uitvoer zitten, je de juiste HTML elementen gebruikt in de juiste context en je de inhoud van je pagina logisch ordent, is je website goed leesbaar voor zoekmachines. Hierdoor wordt je website uiteindelijk ook sneller gevonden door bezoekers, waardoor je het totale bereik vergroot.
  • Je website is toegankelijk
    Op alle browsers, platformen en apparaten is je website toegankelijk voor bezoekers. Hij is bijvoorbeeld te bekijken met allerlei verschillende webbrowsers, maar ook met screenreader software of een brailleleesregel. Mensen die zonder muis werken moeten de website ook goed kunnen gebruiken. Dit zorgt voor een breed scala aan tevreden bezoekers van uw website die waarschijnlijk graag nog eens terug komen.
  • Hoge bouwkwaliteit
    Doordat de website moet voldoen aan webstandaarden en onderworpen wordt aan een nauwkeurige inspectie, krijg je als klant een website met een hoge bouwkwaliteit.
  • Toekomstbestendig en snel
    De scheiding van opmaak, inhoud en logica zorgt er voor dat je website toekomstbestendig is. Mocht je na een paar jaar een nieuwe grafisch vormgeving willen doorvoeren, dan hoeven we alleen de opmaakbestanden aan te passen en niet al het programmeerwerk opnieuw te doen. Het werken volgens de richtlijnen kan een vermindering van te downloaden code opleveren, waardoor de website voor bezoekers ook sneller zal laden.

Hands on! awt.nl

Omdat de AWT semi-overheid is, is toegankelijkheid van de website verplicht. Hiertoe hebben we bij ontwikkelen van de website voor de AWT vanaf het begin rekening gehouden met de eisen die gesteld worden vanuit het Waarmerk drempelvrij.

In onze standaard werkwijze proberen we al zo veel mogelijk te voldoen aan de W3C standaarden. We bieden bij voorkeur een alternatief voor een functie die anders bijvoorbeeld alleen met javascript werkt, maar om het keurmerk ook daadwerkelijk te verkrijgen moest er een extra tandje bij worden gezet.

Op alle fronten binnen de website ontwikkeling hebben we keuzes moeten maken die bijdragen aan een beter toegankelijke website.

  • Visueel ontwerp
    Bij het maken van het visueel ontwerp voor de nieuwe AWT website is rekening gehouden met mensen met een visuele handicap. De website is zeer contrastrijk opgezet zodat bezoekers die kleurenblind zijn hier tijdens het bezoeken van de website geen hinder van ondervinden. Dit betekent wel dat je als ontwerper soms concessies moet doen, of dingen anders aan moet pakken dan je gewend bent. Voor de klant kan dit betekenen dat een eerder ontwikkelde huisstijl misschien niet altijd in onaangepaste vorm vertaald kan worden naar de website. Alle knoppen op de website onderscheiden zich qua kleur, vorm en positie van andere elementen, waardoor hun functie in een oogopslag duidelijk is, zowel voor iemand die kleurenblind is als iemand die slechtziend is. Een ander voorbeeld van het doen van een visuele concessie is een hyperlink. Het is misschien niet zo mooi om hyperlinks van een onderlijning te voorzien, maar de functie van dat stukje tekst is daardoor wel meteen duidelijk voor de bezoeker.
  • Front-end development
    Tijdens het omzetten van het grafisch ontwerp naar HTML en CSS code moet zorgvuldig gelet worden op het volgen van de W3C standaard. Verder hebben we goed nagedacht over hoe de structuur van het HTML document invloed zou hebben op bezoekers die met bijvoorbeeld een screenreader de website bezoeken. De meest belangrijke content staat bovenaan de pagina. Met CSS hebben we het menu dat in de structuur onderaan staat, weer visueel naar boven gehaald. We hebben skiplinks ingebouwd, zodat er makkelijk gesprongen kan worden naar het hoofdmenu en de hoofdcontent. Het doel van hyperlinks op de website is door hun tekst, of title duidelijk gemaakt voor screenreader gebruikers.
  • Back-end development
    Omdat we voor ons Webmagiër CMS gebruik maken van het Yii framework en zoveel mogelijk gebruik maken van de daar in bestaande oplossingen, zijn we niet altijd voor 100% tevreden met de HTML uitvoer die hiermee gegenereerd wordt. Om dit op te lossen hebben we onze eigen varianten van functies en extenties geschreven die wel voor de volle 100% voldoen aan de eisen die gesteld worden vanuit het Waarmerk drempelvrij. Dit betekende soms dat we onze veelgebruikte code nog eens onder de loep moesten leggen en soms voor een andere creatieve oplossing moesten kiezen. Een goed voorbeeld hiervan is de standaard eenvoudige Yii CAPTCHA die we gebruikten. Deze was eigenlijk helemaal niet toegankelijk omdat mensen met een visuele beperking geen mogelijkheid hadden om de code te achterhalen zonder deze daadwerkelijk te zien:
    Standaard Yii Captcha
    Om een toegankelijker alternatief van onze standaard CAPTCHA aan te kunnen bieden hebben we gekeken naar sites van de overheid. Hier wordt een eenvoudige rekensom aangeboden om een minimaal niveau van spam-protectie te bieden. We hebben hiervan onze eigen variant gemaakt, de zogeheten Calculatecaptcha:
    Insyde's nieuwe toegankelijke CAPTCHA
    Deze nieuwe CAPTCHA hebben we nu standaard gemaakt in de Webmagiër. Klanten die een CMS onderhoudscontract hebben krijgen deze automatisch met de kwartaalupdates. Stukje bij beetje worden de sites van al onze klanten zo steeds wat toegankelijker en blijven we ons werk continue verbeteren.

Nadat we zelf de website gecontroleerd hebben is er vanuit de AWT een keuringsverzoek naar Stichting Waarmerk drempelvrij gegaan. In opdracht hiervan is de inspectie uitgevoerd door Stichting Accessibility en is er een keuringsrapport opgesteld. Hieruit zijn nog een aantal verbeterpunten gekomen waar wij mee aan slag zijn gegaan. Hierdoor was een tweede keuring nodig voordat we uiteindelijk het keurmerk binnensleepten. Met gepaste trots kunnen we ons nu dan ook een Toegankelijke Bouwer noemen!Toegankelijke webbouwer

Voor ons als bedrijf was dit een mooie gelegenheid nog eens met een kritische blik naar onze standaard werkwijze te kijken en een goede graadmeter van onze aanpak op het gebied van toegankelijkheid van onze websites.

We kijken in ieder geval uit naar de volgende site die door de keuring mag! 

Geschreven door Maarten van Spil

Front-End Developer & UX Designer

Blijf up-to-date en ontvang updates in je mailbox

Lees ook deze interessante blogs

Kiezen van een webdesignbureau: waar moet je op letten?

Je wilt een nieuwe website en bent op zoek naar een goed webdesignbureau. In Nederland zijn er zeker honderd webdesignbureaus en een groot aantal ZZP’ers die websites maken. Allemaal pretenderen ze goed te zijn. Maar hoe scheid je het kaf van het koren en kies je een bureau die bij jouw organisatie past? Wij zetten 14 punten op een rij waar op je moet letten bij de keuze van een webdesignbureau.

Watervalmethode vs Scrum

Scrum is geliefd bij veel software-ontwikkelaars. Zo ook bij ons; wij houden echt van scrummen. Maar soms – heel soms – werken wij nog volgens de watervalmethode. Dit doen wij vooral bij projecten waarbij de projectleider aan de klantzijde geen beslissingsbevoegdheid heeft en elk stap aan een leidinggevende, het management of een stuurgroep moet worden verantwoord. Soms is de watervalmethode ook meer geschikt voor website waarop content centraal staat en al in een vroeg stadium...

Totaalpakket: grondig renoveren website, inclusief teksten en beelden

Het besluit is genomen: je wilt een nieuwe website voor je bedrijf. Dit besluit is meteen de startpunt van een reeks volgende beslissingen. Wat te doen met de content – foto’s en teksten – op de huidige site? Passen deze nog bij de nieuwe weg die je in wilt slaan? Of doen deze juist afbreuk aan de nieuwe website en de communicatieboodschap die je wilt uitdragen? En wat als nieuwe teksten nodig zijn: zelf schrijven of iemand anders? En zo ja, wie dan? Oftewel: keuzes,...