Paretoprincipe in webdesign - ontwerp een effectievere website met de 80/20-regel

Het probleem van perfectionisme in webdesign

Perfectionisme kan een uitdaging zijn voor veel grafische en webontwerpers. Streven naar uitmuntendheid is bewonderenswaardig, maar het kan leiden tot frustratie door eindeloos veranderen en aanpassen tot elk element van de website perfect is. Veel ontwerpers laten zich gemakkelijk meeslepen in het ontwerpproces en verliezen de tijd uit het oog bij het kiezen van lettertypes, kleurenpaletten en honderden pixel-perfecte ontwerpbeslissingen. Zeker, het is belangrijk om goed werk af te leveren, maar als ontwerper is het gemakkelijk om de aandacht te verliezen voor wat dit betekent? Een website moet niet draaien om de doelstellingen van de ontwerper, maar om het gewenste resultaat van de klant, en tegelijkertijd de beperkingen van tijd, middelen en energie. Zonder beperkingen kan een website gemakkelijk over-engineered en traag worden, met te veel elementen en functies die de gebruikers in verwarring brengen. Het is ook moeilijk om alle functies in de beperkte tijd in te passen, dus de ontwerper kan simpelweg tijd te kort komen, en het niet afleveren van een goede website binnen de deadline is zeer stressvol voor alle betrokkenen.

Wat is het Paretoprincipe?

De "80/20-regel", ook wel het Pareto-principe genoemd, stelt dat 80% van de effecten voortkomt uit 20% van de oorzaken. Het Pareto-principe werd voor het eerst geïntroduceerd door de Italiaanse econoom Vilfredo Pareto in 1895, toen hij constateerde dat 80% van de rijkdom van Italië in handen was van slechts 20% van de bevolking. Hij merkte ook op dat 20% van de erwtenpeulen in zijn tuin 80% van de erwten produceerde! Het Pareto-principe suggereert dat een paar sleutelelementen verantwoordelijk zijn voor het grootste deel van een bepaald resultaat. Sindsdien is het toegepast op vele andere gebieden, waaronder het bedrijfsleven, de economie en de psychologie, en kan het zelfs praktisch zijn in het dagelijks leven.

Dit vertaalt zich ook goed naar voorbeelden op kleinere schaal; is het u ooit opgevallen dat het grootste deel van uw inkomen afkomstig is van een handvol dezelfde vaste klanten? Of dat je altijd dezelfde kledingstukken lijkt te dragen, terwijl het grootste deel van je garderobe niet gebruikt wordt? Hoewel de verhouding niet altijd precies 80/20 is en er altijd uitzonderingen zijn, is het een geweldig hulpmiddel om mensen te helpen vaststellen welke acties de grootste impact hebben op hun succes en deze dienovereenkomstig te prioriteren.

Het Paretoprincipe in webdesign en digitale marketing

Het Pareto-principe, toegepast op webdesign, gaat ervan uit dat de meeste resultaten komen van een klein aantal belangrijke kenmerken. Bij marketing zullen sommige campagnes het veel beter doen dan andere. Om het beste resultaat te bereiken, is het zinvol zich eerst te concentreren op dit kleine aantal belangrijke kenmerken en ervoor te zorgen dat deze de meeste aandacht krijgen, terwijl de minder belangrijke onderdelen sneller kunnen worden gedaan. Een manier om het Paretoprincipe toe te passen is door te focussen op gebruikerservaring en bruikbaarheid - door aandacht te besteden aan hoe gebruikers omgaan met uw online content en ervoor te zorgen dat ze kunnen vinden wat ze nodig hebben, zult u waarschijnlijk meer vruchten plukken dan wanneer u zich alleen op esthetiek zou richten. Het leert ons dat perfectie niet altijd nodig is, en dat het mogelijk is een nog effectievere website te bereiken door de belangrijke 20% van de functies te optimaliseren.

Als voorbeeld: we hebben net de verkeersgegevens bekeken van een kleine e-commercewinkel die handgemaakte producten verkoopt en we hebben verschillende Pareto-trends opgemerkt. Bijvoorbeeld, bijna al hun bezoekers bezoeken de site via mobiel. De meeste productverkopen komen uit een klein aantal categorieën. Facebook was hun grootste bron van social media verkeer. Als we een heatmap van de productpagina bekijken, zien we dat sommige gebieden meer engagement krijgen. Het typische F-patroon kan enigszins worden waargenomen, met clusters van interacties in de bovenste rij en aan de linkerkant van de pagina.

Wat kan met deze informatie worden gedaan om de verkoop voor deze klant te verbeteren?

In dit voorbeeld zou de snelste winst erin bestaan de mobiele ervaring te verbeteren van deze website, die oorspronkelijk was gebouwd voor desktop. Heatmaps van alle pagina's zouden kunnen worden onderzocht om meer te weten te komen over de gebruikersvoorkeuren. Zo zouden de meest aangeklikte vragen uit de FAQ-sectie naar de homepage kunnen worden verplaatst in plaats van weggestopt. Goed renderende producten zouden kunnen worden getoond op de pagina's waar het meest op wordt geklikt.

Begin altijd met het "Waarom

(Afbeelding Bron: Envato Elements)

Vanuit mijn ervaring in de industrie heb ik gemerkt dat veel ontwerpers graag de opdracht accepteren en beginnen te werken aan ontwerpen, zelfs als ze belangrijke informatie missen met betrekking tot het doel van het project. Misschien dacht degene die de briefing opstelde dat deze informatie impliciet was, of heeft de klant het niet bondig verwoord. Neem even de tijd om een stapje terug te doen voordat je aan de slag gaat. Zonder een duidelijk begrip van waarom je doet wat je doet, zal je webdesign richting missen. Uw website kan er goed uitzien voor u en zelfs voor de klant, maar ondanks uw vele uren zal het resultaat teleurstellend zijn als het niet de verwachte resultaten van de klant bereikt.

Vraag jezelf af: Waarom bestaat deze website? Wie zullen de eindgebruikers van de website zijn en hoe zullen zij interageren op de website? Hoe zal de website waarde en succes creëren voor uw klant? Hoe zal de klant dit succes meten? Hoe zal de website bezoekers aantrekken en leads vastleggen? Als u deze vragen kunt beantwoorden, en u begrijpt het 'Waarom', dan wordt het gemakkelijker om prioriteiten te stellen in het 'Wat' en 'Hoe' van de ontwerpelementen. Als u het gewenste resultaat kunt visualiseren, kunt u uw energie concentreren op de belangrijkste gebieden om dit te bereiken.

Omarm de minimum viable product aanpak in web design

Met zoveel te nemen beslissingen bij het ontwerpen van een website kan het moeilijk zijn om te weten waar te beginnen. De minimum viable product (MVP)-aanpak houdt in dat alleen de kernelementen van een website meteen worden gebouwd en vervolgens voortdurend worden verfijnd aan de hand van feedback van de klant. Dit wordt meestal gedaan om kosten en tijd te besparen, of wanneer een bedrijfsidee gebaseerd is op veel aannames. In plaats van alles in één keer te proberen, kunnen ontwikkelaars functies prioriteren op basis van de behoeften van de klant en zo snel mogelijk prototypes maken. Zelfs wanneer u niet onder tijds- of budgetdruk staat, is het omarmen van de website als MVP een fantastische manier om het Pareto-principe toe te passen en perfectionistische neigingen te bestrijden. Mentaal helpt het om te weten dat je later altijd meer functies kunt toevoegen, maar dat je je voor nu moet richten op de belangrijkste elementen.

Ontwerpen voor mobile-first kan u helpen uw website te vereenvoudigen

Bij het ontwerpen van een website wilt u gebruikers een effectieve en intuïtieve ervaring bieden. De beste manier om dit te bereiken is om te ontwerpen met een "mobile-first" ontwerpaanpak. Dit concept houdt in dat websites eerst worden geoptimaliseerd voor mobiele apparaten, in plaats van desktop websites die worden aangepast voor mobiel. Waarom is dit nodig? Volgens techjury.net genereren mobiele telefoons in 2022 60,66% van het websiteverkeer, terwijl desktops en tablets samen verantwoordelijk zijn voor 39,34%. Dit kan variëren in verschillende industrieën en op verschillende websites, maar de trend is het vermelden waard. Door uw ontwerp te richten op de mobiele versie van de site kunt u de kansen op succes in uw voordeel stapelen.

Zodra je begint te ontwerpen voor mobiele apparaten, zul je snel merken dat er minder ruimte is voor formuleringen en rommel. Het is best moeilijk om je daaraan aan te passen, als je lange tijd voor desktops hebt ontworpen. Maar deze aanpak past goed bij het Pareto-principe, omdat het u helpt de inhoud met de grootste impact te kiezen. Dit heeft twee voordelen: uw site wordt geoptimaliseerd voor het mobiele platform dat de gebruikers verkiezen, en wanneer u hem aanpast voor desktop zal hij er visueel modern en strak uitzien. U zult uw website later nog steeds moeten aanpassen voor desktop, maar als u werkt vanuit de mobile-first benadering wordt dat veel gemakkelijker omdat u al een vereenvoudigd ontwerp hebt.

Doe onderzoek en analyseer websites van concurrenten

Bij webdesign denken we bij onderzoek vaak aan het bekijken van andere inspirerende websites of templates met mooie designelementen. Maar onderzoek voor webdesign gaat verder dan alleen het bewonderen van de esthetiek van andere websites. Het is noodzakelijk om te begrijpen hoe mensen het web gebruiken, hoe gebruikers omgaan met verschillende ontwerpen, en hoe de inhoud is georganiseerd om een effectieve website te maken. Door te vragen naar analysegegevens die de klant kan verstrekken of door een monitoring tool zoals Ranktracker te gebruiken, kunnen we beter de gebieden identificeren waar verbeteringen mogelijk zijn voor een beter presterende website.

Het onderzoek moet een onderzoek omvatten naar bestaande industriestandaarden, doelgroepen en voorkeuren van gebruikers door middel van een analyse van concurrenten. U kunt concurrenten vinden door de klant te vragen of door zelf te zoeken en te zien welke websites bovenaan staan. Zodra u enkele concurrenten hebt geïdentificeerd, hebt u een betrouwbare bron voor gegevens over hen nodig. Een van mijn favoriete functies van Ranktracker is de mogelijkheid om uw eigen geïdentificeerde concurrenten toe te voegen en het zal de prestaties van de concurrent weergeven in een kolom naast uw eigen domein resultaten. Als een concurrent u overtreft voor uw eigen trefwoorden, is het de moeite waard om hun website te analyseren om van hen te leren. Om een concurrent toe te voegen, plakt u gewoon hun URL in.

Klik voor een geweldig diepgaand artikel over het uitvoeren van een concurrentieanalyse.

Terwijl je al je onderzoek doet, maak je een "droomlijst" van alle mogelijke functies en elementen die je zou kunnen opnemen (maak je geen zorgen, je zult deze beperken, maar het is nuttig om alle ideeën bij elkaar te hebben).

Planning: Het identificeren van belangrijke ontwerpkenmerken

(Beeldbron: Envato Elements)

Het ontwerp van een website moet gebaseerd zijn op het beoogde doel. Kijk naar alle elementen/functies van uw droomlijst en kies de elementen waarvan u denkt dat ze uw klant zullen helpen zijn doel te bereiken. Neem wat blanco papier en begin met het tekenen van enkele ruwe wireframes voor uw website. Verbind op uw wireframes elk element dat u van plan bent op te nemen met een resultaat: als u er geen duidelijk doel voor kunt vinden, schrap dat onderdeel dan. Denk niet na over ontwerpesthetiek, maar concentreer u op wat het beste is voor de gebruikerservaring en bruikbaarheid.

In tegenstelling tot wat vaak wordt gedacht, hoeven uw eerste wireframes niet te worden ontworpen met ingewikkelde ontwerpsoftware. De analoge aanpak van potlood en papier werkt prima, en soms zelfs beter omdat je niet wordt afgeleid door de software zelf. Papier is vergevingsgezinder en minder permanent; het is sneller te gebruiken, wat kan helpen tijdens het creatieve proces. Als u wireframes moet presenteren aan uw klant, kan dat professioneler als u eenmaal de ruwe tekeningen hebt doorgewerkt.

Maak eerst een mock-up, ontwerp niet in het webplatform om tijd te besparen

Er is een oud gezegde dat je geen vliegtuig kunt besturen terwijl je het aan het bouwen bent. Dit geldt ook voor webdesign: proberen een website te bouwen terwijl u nog bezig bent beslissingen te nemen over inhoud, functies en ontwerp, is een recept voor frustratie. Om de zaken efficiënt te houden, hebt u een plan nodig. Het maken van een mock-up van elke pagina lijkt tijdrovend en contra-intuïtief, maar het dient vele doelen en zal op de lange termijn tijd besparen. Met mock-ups kan uw klant de website visualiseren voordat de webontwikkeling begint. Ze kunnen de verschillende kleuren en lettertypes ervaren, en gemakkelijk anticiperen op wat er veranderd moet worden. Het bespreken van een mock-up creëert veel mogelijkheden voor discussie en vragen. Het vergroot de kans dat uw klant tevreden zal zijn wanneer hij de live site voor het eerst ziet. Het belangrijkste is dat het werken met een mock-up u in staat stelt de website veel sneller te bouwen als u eenmaal in de ontwikkelingsfase zit, omdat bijna alle creatieve beslissingen al genomen zijn.

Werk met inhoud die goed scoort op zoekmachines

Soms staat een klant erop dat je begint te ontwerpen met 'placeholder-tekst', omdat hij denkt dat het jouw taak is alleen de esthetische elementen te ontwerpen. Vermijd, indien mogelijk, ontwerpwerk met generieke placeholder tekst. Hoewel uw ontwerpen er misschien mooi uitzien, zou uw website zijn doel missen als u een belangrijk ingrediënt zoals goed geschreven inhoud verwaarloost.

Een website is alleen waardevol als hij bezoekers krijgt, en Search Engine Optimization (SEO) is hoe zoekmachines uw website organisch vinden. De bewoordingen die u op een pagina gebruikt, zijn cruciaal voor SEO, en de ontwerpelementen moeten de bewoordingen ondersteunen. Als u vooraf weet wat de trefwoorden zijn, geeft dat extra inzicht. Als u werkt met een tekstschrijver voor uw inhoud, zorg er dan voor dat deze bekend is met SEO. Zelfs als u geen SEO-expert bent, raak dan vertrouwd met dit onderwerp, zodat u er tijdens uw webdesignproces meer rekening mee kunt houden.

Sommige trefwoorden zoek tools zijn ingewikkeld (vooral als u nieuw bent in SEO) maar de Ranktracker Keyword Finder is zeer eenvoudig en intuïtief: u voegt eenvoudig de trefwoorden toe aan een lijst en het toont de resultaten kleurgecodeerd naar trefwoord moeilijkheid. Voor goede SEO wilt u trefwoorden kiezen met lage concurrentie maar voldoende zoekvolume, dus het is erg handig dat de zoekvolumes daar worden weergegeven.

Probeer dus, voordat u begint, ten minste een ontwerp van de tekst te krijgen. Als u een zelfstandig ontwerper bent, zult u de klant waarschijnlijk ook moeten helpen uitzoeken waar de tekst het beste op de website past. De realiteit van het ontwerpproces is dat deze tekst een paar keer kan veranderen, maar iets hebben om mee te beginnen is zoveel beter dan helemaal niets.

Vereenvoudigen van keuzes over lettertypen, kleuren, hiërarchie en visuele elementen

Als u een minder ervaren ontwerper bent of gewoon wat tijd wilt besparen, is het handig om met sjablonen te werken en die als basis te gebruiken. Voor een CMS als WordPress zijn er duizenden geweldige sjablonen tegen redelijke prijzen. Deze hebben al lettertypen, kleuren, hiërarchie en visuele elementen ontworpen in een samenhangende stijl. Als u zich zorgen maakt over originaliteit, wees er dan van verzekerd dat uw resultaat er anders uit zal zien dan het sjabloon, omdat u het aanpast aan uw wireframes. Een aantal ontwerpelementen en een algemene stijl om mee te beginnen kunnen u echt helpen richting te vinden en de beslissingsmoeheid te verminderen. Gebruik niet te veel kleuren: u kunt uw website kleuren veilig beperken tot 2 kleuren of maximaal 3. Bekijk De 20 beste kleurencombinaties om te proberen op uw website voor een aantal goede ideeën en trends bij het kiezen van website kleuren.

Conclusie: Het effect maximaliseren

Als een ontwerper weet waar hij zich op moet concentreren, kan hij zijn perfectionistische neigingen onder controle houden en toch succes boeken. Het Pareto-principe is een vuistregel in webdesign die stelt dat 80% van de gebruikerservaring kan worden bereikt met 20% van de inspanning. Dit betekent dat webdesigners hun inspanningen moeten richten op het optimaliseren van de inhoud, ontwerpelementen op de pagina, bruikbaarheid en andere factoren om een effectieve website te maken die goed scoort bij zoekmachines.