Toen ik kort geleden iets meer begon te lezen over ontwerpprincipes, kwam ik een interessant principe tegen met de naam 80/20 regel , ook wel Pareto-principe , Juran's Principle , de Vital Few and Trivial Many Rule en het Principe of Factor Sparsity genoemd .

Dit principe, dat ik in dit stuk gewoon als de 80/20-regel zal noemen, kan, wanneer het wordt beschouwd in de context van website- en webapp-ontwerp, een diepgaand effect hebben op de gebruikerservaring en uiteindelijk op de effectiviteit van de inhoud of functionaliteit van uw website of web-app.

In dit bericht geef ik eerst een basisdefinitie, daarna zal ik enkele specifieke voorbeelden bespreken van hoe de 80/20-regel nuttig is, en dan vat ik enkele lessen samen die kunnen worden afgeleid uit kennis van deze regel.

Wat is de regel?

De 80/20-regel werd oorspronkelijk waargenomen door de Italiaanse econoom Vilfredo Pareto, en het feitelijke principe werd het Pareto-beginsel genoemd door Joseph M. Juran.

Hieronder vindt u definities van twee verschillende bronnen. Eerst uit het boek Universele ontwerpprincipes :

De 80/20-regel stelt dat ongeveer 80 procent van de effecten die door een groot systeem worden gegenereerd, worden veroorzaakt door 20 procent van de variabelen in dat systeem.


En verder, van Wikipedia :

Het Pareto-principe ... stelt dat voor veel evenementen ongeveer 80% van de effecten afkomstig is van 20% van de oorzaken


Dus je zult meteen opmerken dat dit niet altijd een principe is dat we als ontwerpers direct onder controle hebben, maar eerder is een principe dat we waarnemen bijna vanzelfsprekend.

Met kennis van het bestaan ​​van dit principe, of patroon van voorkomen, zijn we dan uitgerust met waardevolle informatie om beslissingen te nemen die de bruikbaarheid en effectiviteit van onze ontwerpen zullen helpen verbeteren.

Let nooit op de hypothetische aard van de regel ...

Ja, er zijn critici en degenen die de 80/20-regel voelen, is niets anders dan een hypothese of overdreven-algemene theorie die niet altijd van toepassing is.

Maar afgezien daarvan is het concept zelf zeker van voordeel voor degenen die werken aan gebruikersinterfaces en -functionaliteit die moeten worden onderzocht en geoptimaliseerd - zelfs als de regel meer lijkt op 70/30 of 90/10.

Hoe kunnen we het toepassen op de gebruikerservaring?

In elke website, web-app of software-omgeving vertelt de 80/20-regel ons dat 20% van de functionaliteit en functies in elke omgeving verantwoordelijk zijn voor 80% van de resultaten of acties die in die omgeving worden ondernomen.

In sommige gevallen is het gemakkelijk om erachter te komen wat de 20% is die zo'n grote impact heeft. Webanalysestatistieken, formulierinzendingen en sessiecookies kunnen allemaal worden gebruikt om het gebruikersgedrag bij te houden. Analyse van deze items helpt ons te bepalen met welke gebieden van de gebruikersinterface de meeste interactie is.

Aan de andere kant kunnen kleinere taken die niet worden gevolgd met behulp van deze methoden, moeilijker te analyseren zijn. In dit geval kunnen usability-onderzoeken worden uitgevoerd waarbij gebruikers worden geobserveerd terwijl ze communiceren met de gebruikersinterface van uw website.

Enkele voorbeelden die de 80/20 regel herkennen

Of het nu opzettelijk is of niet, er is voldoende bewijs dat UI- en UX-ontwerpers de waarde van dit principe overwegen.

Neem bijvoorbeeld een eenvoudig gebruikersinterface-element zoals een vervolgkeuzelijst met landen die in een registratieformulier worden gepresenteerd. De meeste siteontwikkelaars of makers van inhoud erkennen dat 80% van de tijd, bepaalde landen worden geselecteerd.

Dus hoewel het een slechte oefening lijkt te zijn voor zo'n lange lijst om het alfabetiseren van de lijst te doorbreken, staat de 80/20-regel toe dat die conventie wordt verbroken door de meest geselecteerde landen bovenaan te plaatsen, zoals te zien in de onderstaande scherm-grab van Fenn Wright Manson's afrekenpagina:

De meest waarschijnlijke landenopties van Fenn Wright Manson


In andere gevallen, zoals bij het toevoegen van een nieuw adres aan uw adresboek Amazon.com , de standaardkeuze is het meest geselecteerde land - in dit geval de Verenigde Staten:

Amazon's standaardlandoptie


Hier is nog een voorbeeld, dit keer vanuit een bedrijf in het Verenigd Koninkrijk dat is genoemd North Rock Gallery , waarbij de optie VK standaard is geselecteerd:

Standaardlandoptie Norht Rock Gallery

Deze eenvoudige voorbeelden hierboven tonen het belang van het optimaliseren voor de functies en opties die het vaakst worden gebruikt of geselecteerd.

Waar zien gebruikers eruit?

De F-Pattern lees- en scangewoonten van internetgebruikers zijn inmiddels behoorlijk ingeburgerd. Natuurlijk is het F-patroon niet altijd een indicator in elke markt, maar het is een redelijk goed startpunt om te bepalen waar uw gebruikers zullen kijken wanneer zij met uw ontwerpen omgaan.

Bekijk de onderstaande heatmaps van het bekende Alertbox-artikel dat hierboven is gelinkt:

Heatmaps Het F-patroon weergeven

Ervan uitgaande dat dit een goede indicator is van waar het oog van een gebruiker is gericht, ondersteunt dit het concept van de 80/20-regel. De meest intense gebieden op de kaart kunnen de 80% van de tijd de 20% van de pagina weergeven waarop de ogen van de gebruiker reageren.

Vanuit die kennis, als ontwerpers, kunnen we beslissingen nemen die helpen de gebieden te verbeteren en optimaliseren waar de gebruiker gewoonlijk naar toe zal worden getrokken.

Natuurlijk zal het ontwerp vaak de bepalende factor zijn van waar de gebruiker naar kijkt, dus deze suggestie zou slechts een basisgids moeten zijn en niet noodzakelijk een dogmatische manier om te beslissen wat onder de 20% valt.

Mobiele ontwerptrends en de 80/20 regel

Onlangs met de explosie van mobiele apparaten wereldwijd, sommige ontwerpers en ontwikkelaars, met name Luke Wroblewski , waren bemoedigend mobiel-eerste webontwerp . Dat wil zeggen, bij het ontwerpen en ontwikkelen van een website moet de mobiele versie eerst worden gedaan, in plaats van andersom, om bepaalde voordelen te bereiken.

In een traditionele website of web-app vallen bepaalde delen van uw site vanzelfsprekend onder de 20% die het meest worden gebruikt en waarmee wordt gecommuniceerd. Wanneer een mobiele site is ontworpen, wordt de focus gelegd op die 20% (of daaromtrent).

Dus hoewel de mobiele versie van een website mogelijk 20% meest gebruikte opties heeft, in verhouding tot de volledige inhoud die beschikbaar is op een traditionele website, heeft de mobiele versie normaal gesproken alleen de belangrijkste functies.

Hier is een eenvoudig voorbeeld hieronder met behulp van de PETCO.com website:

Petco volledige website

Hierboven is de volledige versie van de site te zien, in al zijn rommelige glorie. Hoewel er enkele call-to-action-gebieden zijn, en het is zeker niet het slechtste ontwerp ter wereld, is het over het algemeen niet erg geconcentreerd en zijn er te veel opties.

Vergelijk dat eens met de mobiele versie, hieronder:

Petco mobiel

De hierboven getoonde mobiele interface is daarentegen eenvoudig en helpt de gebruiker om eerst de belangrijkste gebieden te bereiken, zonder deze te overweldigen. Welke opties en inhoudsgebieden het meest worden gebruikt in de volledige versie zijn de enige beschikbare opties in de mobiele versie.

Dus goed gerichte mobiele web-apps zijn geweldige voorbeelden van ontwerpers die hun energie richten op de belangrijkste aspecten van hun projecten, gefocust blijven op de functionaliteit en inhoud (de 20%) die het grootste deel van de tijd wordt gebruikt (de 80%).

Lessen samengevat

Met begrip van hoe de 80/20-regel werkt, zijn ontwerpers uitgerust om op verschillende manieren actie te ondernemen, zoals hieronder samengevat:

  • Analyseer waar mogelijk analytics en usability-gegevens zorgvuldig om de 20% meestgebruikte functies van uw website te bepalen
  • Prioriteren; dat wil zeggen, focus op de belangrijkste aspecten van uw website of web-app, en verbeter die
  • Besteed niet te veel tijd aan het optimaliseren van dingen die in de 80% vallen en die niet vaak worden gebruikt
  • Vereenvoudig uw ontwerpen en lay-outs op basis van gegevens die bepalen wat valt onder de 20% meest gebruikte functies
  • Verwijder niet-kritische functionaliteit of inhoud die niet vaak wordt gebruikt
  • Investeer niet te veel tijd en geld in het optimaliseren van minder gebruikte functies, omdat het rendement op uw investering waarschijnlijk laag zal zijn
  • Zoek naar manieren om de functionaliteit en het ontwerp van minder gebruikte meer kritieke elementen te verbeteren die een grotere impact op conversies kunnen hebben als die elementen van het ontwerp vaker werden gebruikt


Hoewel de 80/20-regel een omstreden principe is met enkele inherente tekortkomingen, is het niet zonder waarde. Overweeg deze regel dus tijdens het proces van uw herontwerpen, opnieuw uitlijnen of zelfs voor nieuwe projecten.

Dit moet uw gebruikers helpen om gefocust te blijven op de belangrijkste functionaliteit en inhoud en uiteindelijk de conversiepercentages helpen verbeteren.


Dit bericht is exclusief geschreven voor Webdesigner Depot door Louis Lazaris, een freelance schrijver en webontwikkelaar. Louis rent Indrukwekkende webs waar hij artikelen en tutorials over webdesign plaatst. Jij kan volg Louis op Twitter of neem contact met hem op via zijn website.

Hebt u de 80/20-regel in uw ontwerpbeslissingen overwogen? Welk effect heeft dit gehad op het succes van uw website of web-app? Deel uw opmerkingen hieronder.