Website Quickscan

Een paar weken terug had een van mijn favoriete websitedesignbureau Concept7 een actie. Je kon tijdelijk een gratis quickscan van je website krijgen. De experts gaven feedback op de gebruiksvriendelijkheid en toegankelijkheid. Ik heb me direct aangemeld omdat ze bij Concept7 verder kijken dan hoe mooi je website is.

In dit artikel neem ik je mee door de bevindingen. Inclusief afbeeldingen, want binnenkort gaan er wat zaken verbeterd worden. De afbeeldingen in dit artikel deel ik met toestemming en komen uit het rapport wat ik kreeg. Je kunt ook het hele rapport downloaden. Er staan handige links in, wel Engelstalig.

Tip: lees dit artikel met je eigen website ernaast, zodat je kunt kijken of jullie dezelfde fouten maken als ik. En als je doorleest tot het eind van dit artikel heb ik een leuke verrassing voor je.

De homepage / propositie

De homepage is de basis van je website. Hier stel je jezelf voor en vertel je wat je doet en voor wie. Bij Concept7 noemen ze het ook de propositie. Ik heb mijn website pasgeleden iets aangepast omdat ik nieuwe foto’s heb laten maken. Dat had ik beter niet kunnen doen.

 

Quickscan 1 - Homepage

 

Op de homepage van mijn website wordt namelijk niet meteen duidelijk wat ik doe en voor wie. Iets met vrijwilligers, maar wat? Het kan net zo goed gaan over mijn eigen vrijwilligerswerk.

Op sommige schermen is de tekst onder de afbeelding niet te zien. Hierdoor lijkt het alsof de website onder de foto ophoudt en lezen mensen niet verder. Oei!

Ook is het kleurgebruik niet goed. De oranje/gele tekst over een drukke foto is niet goed leesbaar. Dat was me zelf ook al opgevallen, maar ik vond de foto zo leuk.

Wijze les: Laat je ego niet belangrijker zijn dan toegankelijkheid en gebruikersgemak.

 

Quickscan 2 - Propositie

 

Ik kreeg de tip om meteen een call-to-action in beeld te brengen. Een call-to-action is een oproep tot actie, bijvoorbeeld de tekst: ‘Neem contact op’ of een knop naar een dienstenpagina. Bezoekers met een specifieke vraag worden dan snel bediend. Best belangrijk.

Als je op je eigen website kijkt naar deze punten, hoe scoor je dan? Wat zie je in de eerste vijf seconden dat je de homepage bekijkt? Snapt een potentiële vrijwilliger snel wat jullie doen en voor wie?

Contrast

Voordat ik The Happy Volunteer begon, bouwde ik zelf websites en toegankelijkheid was een belangrijk onderdeel daarvan. Ik vond het belangrijk dat websites goed te gebruiken waren voor mensen met een beperking dus dat had mijn aandacht.

Ik ben er niet trots op dat ik toegankelijkheidszaken heb losgelaten omdat het me beter uitkwam. Gelukkig geeft de coronacrisis me de tijd om het goed te maken.

 

Quickscan 3 - Contrast

 

In het hoofdmenu van mijn website wordt de link oranje/geel als je op de betreffende pagina bent. Dat geeft houvast omdat je weet waar je bent. Maar de kleur heeft niet genoeg contrast met de witte achtergrond. Voor iemand die minder goed ziet is het niet duidelijk.

Bij de productpagina’s zijn ook de teksten in de blauwe blokken niet goed leesbaar door onvoldoende contrast. Werk aan de winkel dus.

Op https://contrast-ratio.com/ kun je bekijken welk contrast jouw website heeft. Je kunt de kleurcodes invullen in de vlakken en het cijfer in het midden geeft de contrastratio aan. De knop in het midden is rood als het te laag is en groen als het goed is. Als je met je muis over de knop gaat, kun je zien in welke mate je voldoet aan de richtlijnen van de https://wcag.nl/.

Contrast is trouwens ook belangrijk in flyers en brochures. Dus check die ook meteen even!

Navigatie

De navigatie of menubalk is heel belangrijk. Het is het houvast van elke website. Hoewel mijn navigatie redelijk in orde is, valt ook hier nog iets te verbeteren.

 

Quickscan 4 - Navigatie

 

In het menu heb ik de knop ‘Home’ weggelaten. Dat was alweer een keuze voor mooier in plaats van makkelijker. Doordat ik wat langere teksten in het menu gebruik zou de ‘Home’ knop te dicht bij het logo komen. En ik ging er vanuit dat iedereen weet dat je via het logo ook naar de homepage komt.

Een ander punt in de navigatie is dat je niet ziet dat onder het menu-item ‘Werk met Mij’ een uitklapmenu hangt. Dat merk je pas als je er met je muis op klikt. Een pijltje ernaast zou hier duidelijkheid geven.

Formulier nieuwsbrief

Heel handig bied ik op bijna elke pagina de mogelijkheid om je aan te melden voor mijn artikelen. Een mooi formulier waarin ik niet teveel informatie vraag. In dit geval dacht ik niet dat er iets mis was. Wel dus.

 

Quickscan 4 - Formulier

 

Omdat ruimte te besparen koos ik ervoor om geen labels te plaatsen bij mijn formulieren. Wel staat er in het invulveld wat er moet komen (voornaam of e-mailadres). Maar zodra je begint met typen, ziet je dat niet meer. En dat is verwarrend.

Ook het contrast was hier niet goed trouwens. Lichtgrijs staat wel chique en ‘clean’, maar is niet altijd goed te zien.

Feedback is fijn

Door deze quickscan werd ik wakker geschud en ik heb zin om aan de slag te gaan. Ik ben dol op knutselen aan websites dus dat is alleen maar leuk. En de feedback helpt me met concrete acties.

Ik hoop dat je na het lezen van dit artikel inspiratie hebt opgedaan. Laat me weten hoe jouw website uit de test komt.

 

De foto bij dit artikel is van Anastasiia Kamil via Unsplash

 

The Happy Volunteer Logo

Zorg dat je geen artikel mist!

Vul hieronder je gegevens in om elke veertien dagen inspiratie en tips over het werven van vrijwilligers in je mailbox te ontvangen. Je krijgt als welkomstcadeautje een handig e-book met tips.

 Voornaam

 E-mailadres

Jouw privacy is belangrijk. Lees in de privacyverklaring hoe The Happy Volunteer omgaat met je gegevens.