Kennismaken ↗

KENNISBANK / VOORBEREIDING

Hoe maak je je website prettiger bruikbaar voor meer mensen?

Maak je website bruikbaarder met heldere tekst, logische bediening en duidelijke formulieren. Met voorbeelden, een eerste controle en vervolgstappen.

Lees de uitleg ↗
Evie presenteert een laptop; illustratie bij bruikbaar webdesign
Goed ontworpen. Beter te gebruiken. Praktische uitleg voor ondernemers.
HET KORTE ANTWOORD

Begin bij de handelingen die een bezoeker moet kunnen uitvoeren: informatie lezen, navigeren en contact opnemen of bestellen. Onderzoek waar die route vastloopt en laat concrete obstakels oplossen. Een korte checklist is een begin, geen volledige toegankelijkheidsbeoordeling.

01 / VAN VRAAG NAAR PRAKTIJK

Begin met een bezoeker en een duidelijke taak.

Een mooie website kan in gebruik toch lastig zijn. Iemand kan de tekst moeilijk lezen, gebruikt een toetsenbord in plaats van een muis of raakt de weg kwijt in een druk formulier. Toegankelijk ontwerpen betekent dat je zulke verschillen meeneemt bij inhoud, vormgeving en techniek. Het gaat om de hele route, niet om één extra knop op de pagina.

Kies eerst een herkenbare opdracht. Bijvoorbeeld: vind de openingstijden en vraag een afspraak aan. Laat die uitvoeren zonder vooraf uit te leggen waar alles staat. Noteer op welk punt twijfel ontstaat. Zo zie je niet alleen of een knop technisch bestaat, maar ook of een bezoeker begrijpt wat de volgende stap is.

Bedenk een fictieve kapsalon waarvan de prijslijst alleen als kleine foto is geplaatst. De inhoud kan niet prettig worden vergroot en is niet als gewone tekst beschikbaar. Een betere uitvoering toont behandelingen en prijzen als tekst, met duidelijke koppen. De foto kan de sfeer blijven ondersteunen. Het ontwerp houdt zijn karakter, terwijl de informatie makkelijker bruikbaar wordt.

Vraag waar mogelijk ook mensen met verschillende gebruikservaringen mee te kijken. Laat iemand zijn eigen hulpmiddelen gebruiken en vraag toestemming voordat je een sessie vastlegt. Een eigen proef door de bouwer blijft nuttig, maar vervangt die ervaring niet. Beschrijf bevindingen zonder te veronderstellen dat één bezoeker voor iedereen spreekt.

Van een zichtbare knop naar een bruikbare route.
Van een zichtbare knop naar een bruikbare route.

02 / VAN VRAAG NAAR PRAKTIJK

Van kijken naar bedienen: maak de route duidelijk.

De Easy Checks van W3C WAI bieden een eerste controle van onder meer koppen, contrast, toetsenbordbediening en formulieren. W3C benadrukt dat dit geen volledige beoordeling is. Gebruik zo’n controle om problemen op te sporen en vervolgwerk te bepalen, niet om de hele site direct toegankelijk te verklaren.

Bekijk een tekstblok met de vraag wat de lezer nodig heeft. Geef elke sectie een duidelijke kop, verklaar afkortingen en maak verwijzingen herkenbaar. “Bekijk de onderhoudspakketten” geeft meer richting dan meerdere keren “klik hier”. Houd belangrijke voorwaarden bij het aanbod waar ze over gaan. De bezoeker moet niet raden welke informatie bij welke prijs hoort.

Gebruik kleur als ondersteuning en zorg dat informatie ook zonder kleur herkenbaar blijft. Een formulierfout kan bijvoorbeeld de tekst “Vul je e-mailadres in” tonen in plaats van alleen een rode rand. Laat kleurcombinaties controleren en kijk naar tekst bovenop foto’s. Een opvallende huisstijl en duidelijke informatie hoeven elkaar niet uit te sluiten.

Loop het menu en formulier met het toetsenbord langs. Kun je zien welk onderdeel actief is en kom je in een begrijpelijke volgorde verder? Noteer wanneer een venster niet te sluiten is of een element onbereikbaar blijft. Laat de bouwer de oorzaak oplossen; voeg niet op goed geluk extra toetsenbordinstellingen toe die de volgorde juist verwarrender maken.

Bij formulieren moet duidelijk blijven wat ieder veld vraagt. Een voorbeeld in een leeg invoerveld kan verdwijnen zodra iemand begint te typen. Laat daarom de veldnamen en eventuele instructies beoordelen. Controleer ook de foutmelding en wat er gebeurt nadat een aanvraag is verstuurd. Een bezoeker wil weten of het gelukt is en wat daarna volgt.

Beweging vraagt een bewuste keuze. Een korte animatie kan uitleg ondersteunen, maar doorlopende beweging naast een lange tekst kan afleiden. Bespreek welke beweging essentieel is, welke kan stoppen en hoe een voorkeur voor minder beweging wordt gerespecteerd. Laat ook de bediening van video controleren. Evie kan vriendelijk aanwezig blijven zonder overal tegelijk aandacht op te eisen.

Gebruik deze drie vragen naast de controlelijst hieronder.
Gebruik deze drie vragen naast de controlelijst hieronder.

03 / VAN VRAAG NAAR PRAKTIJK

Maak van losse opmerkingen een uitvoerbaar verbeterplan.

Schrijf ieder probleem op met de pagina, de handeling en wat er misgaat. “Bij het openen van het menu zie ik niet waar ik met het toetsenbord ben” is bruikbaarder dan “het menu moet toegankelijker”. Voeg waar passend een schermafbeelding toe, maar leg het probleem ook in woorden uit. Niet ieder obstakel is op een stilstaand beeld zichtbaar.

Begin bij blokkades in belangrijke routes. Een klant die het contactformulier niet kan afronden heeft eerst een oplossing nodig. Groepeer terugkerende problemen: een fout in de gedeelde navigatie kan op veel pagina’s tegelijk voorkomen. Laat na een aanpassing meerdere pagina’s controleren, zodat de oplossing niet alleen bij het oorspronkelijke voorbeeld werkt.

Een automatische controle kan helpen bij het opsporen van bepaalde fouten, maar begrijpt niet volledig of uitleg duidelijk is of een taak prettig verloopt. Combineer zulke hulpmiddelen met handmatig onderzoek. Spreek voor een uitgebreide beoordeling af welke pagina’s, toestanden en functies onderzocht worden, welke norm wordt gebruikt en wat het rapport wel en niet dekt.

Bij webdesign en redesign nemen we leesbaarheid en bedienbaarheid mee in de keuzes voor de vormgeving. Voor een bestaande site kun je een afgebakende opdracht voor websiteaanpassingen bespreken. Laat eerst de bevindingen en werkzaamheden beschrijven; niet ieder probleem vraagt meteen om een volledig nieuwe website.

Controleer na oplevering dezelfde taken opnieuw. Neem ook mobiel gebruik en vergrote tekst mee. Ons artikel over responsive websites testen helpt om verschillende schermen te vergelijken. Dat onderwerp overlapt met bruikbaarheid, maar is niet hetzelfde als een volledige toegankelijkheidscontrole.

Leg tenslotte afspraken vast voor nieuwe inhoud. Wie schrijft duidelijke linkteksten, controleert de koppen en beoordeelt alternatieve tekst bij informatieve beelden? Neem dit op bij de overdracht van je website. Zo blijft de verbetering onderdeel van het dagelijkse beheer in plaats van een eenmalige opruimactie.

JOUW CONTROLELIJST

Loop het even na.

Vink af wat je hebt gecontroleerd. Je keuzes gelden alleen zolang deze pagina openstaat.

0 van 5 gecontroleerd

VEELGESTELDE VRAGEN

Nog even helder.

Is deze checklist een volledige toegankelijkheidstest?

Nee. Dit is een eerste praktische controle. Voor een volledige beoordeling zijn een afgesproken scope, uitgebreid onderzoek en passende deskundigheid nodig.

Moet het ontwerp sober worden?

Nee. Kleur, fotografie en illustraties kunnen blijven. De informatie en bediening moeten duidelijk blijven voor verschillende bezoekers.

Is een automatische test genoeg?

Nee. Zulke hulpmiddelen kunnen bepaalde fouten vinden, maar handmatige beoordeling en gebruikstesten blijven nodig.

Kan dit op mijn bestaande website?

Vaak kunnen onderdelen gericht worden aangepast. Laat eerst onderzoeken waar de problemen zitten en welke oplossingen binnen de bestaande opbouw passen.

VAN UITLEG NAAR UITVOERING

Samen goed regelen.

We bespreken wat jouw website nodig heeft en leggen de werkzaamheden vooraf vast.

Webdesign en redesign ↗Bespreek jouw plannen ↗

Lees ook