Waarom is mijn WordPress website zo traag?
Wat is een goede website? Waarom blijken sommige websites met zo’n eenvoudig UI-ontwerp tot de meest succesvolle te behoren?
Wat is een goede website? Waarom blijken sommige websites met zo’n eenvoudig UI-ontwerp (en bedrijfsmodellen) tot de meest succesvolle te behoren?
Dat komt vooral omdat ze de juiste UX-ontwerpprincipes volgen. In deze post zetten we de beste UX-principes op een rij die je zou moeten toepassen bij het ontwerpen van een website, en geven we een aantal voorbeelden van hoe ze werken.
Het belangrijkste aan je website is de reden waarom je gebruikers in de eerste plaats komen. Het is dus logisch dat je zoveel mogelijk barrières wegneemt om hen te helpen bereiken wat ze komen doen, of dat nu het vinden van producten of informatie is.
Het minimalistisch houden van je UI ontwerp helpt om dit doel te bereiken. Zorg ervoor dat er geen overbodige details zijn die de gebruiker kunnen afleiden. Een onoverzichtelijk scherm met veel irrelevante knoppen en inhoud kan de gebruiker afleiden van de hoofdtaak. Zet alleen datgene op het scherm wat op dat moment nodig is, d.w.z. de inhoud of producten waarnaar de gebruiker op zoek is, samen met navigatieopties.
Als het om een e-commerce website gaat, zorg je er voor dat de gebruiker de producten die hij zoekt zo snel mogelijk vindt, en dat hij tijdens het browsen zo min mogelijk wordt afgeleid.
Een hotel website zou naast mooie foto’s een grote call to action moeten hebben: BOEK NU.
Eenvoudige en intuïtieve lay-outs werken meestal het beste.
Dit UX-principe stelt dat een UI vanzelfsprekend moet zijn, zodat het gemakkelijk te leren is.
Maak je UI zo eenvoudig mogelijk te navigeren. Laat het hoofdnavigatiemenu bovenaan staan waarmee gebruikers toegang hebben tot de belangrijkste functies van je website. Verberg minder belangrijke opties in subcategorieën.
Gangbare patronen
De meeste mensen die een pijl in een veld zien, begrijpen dat het een dropdownmenu is en de meesten begrijpen de paginering-metafoor. Het helpt echter altijd om je ontwerpen voor de zekerheid te testen op je doelgebruikers. Jouw idee van hoe iets werkt is misschien niet hetzelfde als dat van je gebruikers.
Consistentie
Eén van de meest natuurlijke manieren om je website snel te leren kennen, is consistent zijn in het gebruik van elementen en taal. Dit vermindert de cognitieve belasting voor de gebruiker omdat er elke keer minder te interpreteren valt.
Laten we bijvoorbeeld zeggen dat je een oranje knop gebruikt om een artikel aan het winkelwagentje toe te voegen en een groene knop om naar de kassa te gaan. Door deze kleurencombinatie op je hele website aan te houden, creëer je consistentie. Of als je een datumprikker op een formulier gebruikt, is het zinvol om dit te herhalen op alle formulieren waar naar een datum gevraagd wordt.
Hierbij draait het om de snelheid waarmee je gebruikers hun taken kunnen uitvoeren.
Bedenk altijd hoe je het aantal klikken, aanslagen en scrollen voor elke taak tot een absoluut minimum kunt beperken. Een goede vuistregel is dat de meeste taken de gebruiker niet langer dan twee minuten mogen kosten.
Een andere manier om de snelheid te verhogen waarmee gebruikers taken op je website uitvoeren, is door soortgelijke inhoud of elementen te groeperen.
Shortcuts
Je kan ook rekening houden met power users als het gaat om het UX principe efficiëntie. Gebruikers die je product vaak zullen gebruiken, of die andere soortgelijke producten gebruiken, zullen het op prijs stellen dat ze de taken niet met dezelfde snelheid hoeven uit te voeren als nieuwelingen.
Een oplossing hiervoor is het gebruik van “shortcuts”. Dit zijn besturingselementen die gebruikers letterlijk helpen dingen te versnellen, meestal door sneltoetsen te gebruiken. Iedereen kent de universele shortcut ctrl+c en ctrl+v.
Het gebruik van duidelijke en eenvoudige taal is een belangrijk UX-principe dat je gebruikers zal helpen de klus sneller te klaren. Zo eenvoudig is het. Algemeen wordt aangeraden om taal te gebruiken die voor 6de klassers bedoeld is.
Door duidelijke en eenvoudige taal te gebruiken, maak je het niet alleen beter begrijpbaar voor de gebruiker, maar ook de nauwkeurigheid bij het uitvoeren van bepaalde taken heeft er baat bij. Ook, in de huidige snelle levensstijl hebben gebruikers vaak haast en hebben ze een kortere aandachtsspanne. Het heeft geen zin om ingewikkeld jargon te gebruiken of zwaar taalgebruik te hanteren.
Instructies en foutmeldingen
Zorg ervoor dat de instructies duidelijk en behulpzaam zijn. Een voorbeeld hiervan kan zijn bij het invullen van formulieren. Foutmeldingen die op tijd verschijnen voor dat een gebruiker te veel gegevens invult. Deze moeten uitleggen wat het probleem is. Bijvoorbeeld: “kredietkaartnummer te lang” of “kredietkaartnummer ongeldig”, of “vul een datum vóór 2021 in”.
CTA’s (call to actions)
Een andere belangrijke factor om rekening mee te houden, is dat je call to action teksten duidelijk en beknopt zijn. Dit hangt sterk af van je merk, product en doelgroep, maar meestal wil je dat je CTA’s duidelijk en eenvoudig zijn. Begin met een actie werkwoord en geef heel nuchter aan wat er gaat gebeuren, zoals “schrijf je in voor de maandelijkse nieuwsbrief” of “download app”.
Door het maken van een informatiearchitectuur kan je de inhoud van je website rangschikken volgens prioriteit.
Het helpt gebruikers sneller bij de inhoud te komen die ze nodig hebben.
Card sorting helpt je bij het bepalen van de inhoud die het meest relevant is voor je gebruikers.
Wanneer gebruikers naar je website komen, zijn ze op zoek naar iets. Ervoor zorgen dat je inhoud relevant is voor je doelpubliek is een belangrijk UX-principe dat gericht is op effectiviteit.
Een manier waarop je dit kan doen is door ervoor te zorgen dat menu- en navigatie-items de meest gezochte inhoud onmiddellijk onthullen, in een volgorde die zinvol is voor je bezoekers.
In het geval van een e-commerce, wilt je misschien je meest populaire categorieën van links naar rechts in de menubalk bovenaan het scherm plaatsen, of als de eerste opties in een overloop menu.
In het bovenstaande voorbeeld van Apple staan de populairste producten van links naar rechts als navigatie-opties in het menu, terwijl de hele homepage gewijd is aan hun nieuwste productreleases.
Je website moet zo fouttolerant mogelijk zijn. Dit is een belangrijk UX principe omdat je gebruikers geen robots zijn en iedereen fouten kan maken, vooral als ze haast hebben. Om de efficiëntie te verhogen, moet je je gebruikers helpen elke fout die ze maken zo snel mogelijk te corrigeren.
Stel je voor dat een gebruiker een formulier invult. Als hij of zij een fout maakt in een veld of dat veld leeg laat, zou een zeer onbehulpzame reactie zijn om gewoon alle velden te vernieuwen en hem/haar opnieuw te laten beginnen. Dit zou onproductief en frustrerend zijn voor de gebruiker.
Vasthoudend aan het UX-principe van fouttolerantie, zouden we de juiste informatie in alle andere velden kunnen behouden, terwijl het veld met de foutieve gegevens wordt gemarkeerd. We kunnen de gebruiker verder helpen door enkele duidelijke inline instructies te geven, zoals “vul een geldig email adres in”. Nog nuttiger is het als de gebruiker een formulier met een fout probeert te verzenden, als het een lang formulier is, dat de pagina automatisch terugbladert naar de foutieve invoer, zonder dat de gebruiker terug hoeft te gaan en te zoeken.
Een andere manier om ervoor te zorgen dat je website fouttolerant is, is door waarschuwingen op te nemen wanneer een gebruiker op het punt staat een potentieel riskante actie uit te voeren, zoals “als u deze pagina verlaat, wordt uw transactie geannuleerd” of “weet u zeker dat u de inhoud van uw winkelwagen wilt achterlaten?”.
Lees hier over 8 tips om je online formulieren te verbeteren.
De status van een element moet altijd duidelijk zijn voor de gebruiker. Dat wil zeggen, het moet altijd communiceren wat er op een bepaald moment aan de hand is, en wat er is gebeurd.
Een eenvoudig voorbeeld hiervan is wanneer een gebruiker met de muis over een link gaat. Die link verandert dan van kleur of wordt onderlijnd tijdens het hoveren.
Of het active menu item dat een andere achtergrondkleur heeft.
Nog een ander voorbeeld van dit concept is de inbox van Gmail, waarin ongelezen e-mail gemarkeerd is en gelezen e-mail grijs is weergegeven.
Vrijheid en flexibiliteit is een belangrijk UX-principe. Vooral als het gaat om e-commerce design. Je gebruikers niet voldoende flexibiliteit bieden leidt tot verlaten winkelwagentjes.
Stel je voor dat een gebruiker door een productassortiment bladert, maar nog geen account heeft aangemaakt. In plaats van ze te dwingen er een aan te maken voordat ze iets aan de winkelwagen kunnen toevoegen, laat je ze gewoon de artikelen voor die sessie toevoegen.
Wanneer zij willen afrekenen, moeten zij zich aanmelden. Hetzelfde geldt voor browsen. Zorg ervoor dat ze vrij zijn om verder te browsen en toon gewoon het afgebeelde aantal artikelen dat zich in de winkelwagen bevindt.
In veel gevallen hangt succes af van het doel van het product en de context. Echter, deze UX principes in deze lijst kunnen gezien worden als universeel voor alle digitale producten, of het nu websites of mobiele apps zijn.
Veel van deze UX design principes komen neer op het hebben van een mix van empathie voor de gebruiker en gezond verstand, maar het kan makkelijk zijn om dat uit het oog te verliezen als je bezig bent een geweldige UI samen te stellen.
In een later artikel zullen we het hebben over de UX aandachtspunten voor mobiele toestellen.
Contacteer ons gerust indien je meer informatie hierover wil.
