80/20-regeln tillämpad på webbdesign
Har nyligen börjat läsa lite mer om designprinciper, kom jag över en intressant princip kallad 80/20 regel , även benämnt Pareto-principen , Jurans princip , den väsentliga få och trivial många regeln och principen om faktorfarsitet .
Denna princip, som jag refererar till i detta stycke helt enkelt som 80/20-regeln, när den beaktas i samband med webbdesign och webbappdesign kan ha en djupgående inverkan på användarupplevelsen, och i slutändan på effektiviteten av innehållet eller funktionen på din webbplats eller webbapp.
I det här inlägget ska jag först ge en grundläggande definition, då ska jag överväga några specifika exempel på hur 80/20-regeln visar sig vara till nytta, och sedan sammanfattar jag några lektioner som kan hämtas från att ha kunskap om denna regel.
Vad är regeln?
80/20-regeln observerades ursprungligen av italiensk ekonom Vilfredo Pareto, och den faktiska principen namngavs Pareto-principen av Joseph M. Juran.
Nedan finns definitioner från två olika källor. Först från boken Universella principer för design :
80/20-regeln hävdar att cirka 80 procent av effekterna som genereras av något stort system orsakas av 20 procent av variablerna i det systemet.
Och nästa, från Wikipedia :
Pareto-principen säger att för många händelser kommer ungefär 80% av effekterna från 20% av orsakerna
Så omedelbart märker du att detta inte alltid är en princip som vi som designers har direkt kontroll över, men snarare är det en princip som vi observerar som sker nästan naturligt.
Med kunskap om förekomsten av denna princip eller förekomstmönster är vi sedan utrustade med värdefull information för att fatta beslut som hjälper oss att förbättra användbarheten och effektiviteten i våra mönster.
Aldrig tänka på den hypotetiska arten av regeln ...
Ja, det finns kritiker och de som känner 80/20-regeln är ingenting annat än en hypotes eller övergripande teori som inte alltid gäller.
Men att lägga det åt sidan, är själva konceptet till nytta för dem som arbetar med användargränssnitt och funktionalitet som kräver undersökning och optimering - även om regeln är mer som 70/30 eller 90/10.
Hur kan vi tillämpa det på användarupplevelsen?
På vilken webbplats som helst, webapp eller mjukvarumiljö, säger 80/20-regeln att 20% av funktionaliteten och funktionerna i någon miljö kommer att ansvara för 80% av resultaten eller åtgärder som vidtas inom den omgivningen.
I vissa fall är det enkelt att räkna ut vad som utgör 20% som har så stor inverkan. Statistik för webbanalys, formulärinsändningar och sessionskakor kan alla användas för att spåra användarbeteende. Analys av dessa objekt hjälper oss att bestämma vilka områden av gränssnittet som samverkar med de flesta.
Å andra sidan kan mindre uppgifter som inte spåras med hjälp av dessa metoder vara svårare att analysera. I det här fallet kan användbarhetsstudier utföras där användarna observeras när de interagerar med webbplatsens användargränssnitt.
Några exempel som erkänner 80/20 regeln
Oavsett om det är avsiktligt eller inte, finns det gott om bevis för att UI- och UX-designers överväger värdet av denna princip.
Ta till exempel ett enkelt användargränssnitt som en rullgardinslista med länder som presenteras i ett registreringsformulär. De flesta webbplatsutvecklare eller innehållsskapare känner igen att 80% av tiden kommer vissa länder att väljas.
Så även om det uppenbarligen skulle vara en dålig övning för en så lång lista att bryta alfabetiseringen av listan, tillåter 80/20-regeln att konventionen bryts genom att de mest utvalda länderna är överst, vilket visas i skärmsteget nedan från Fenn Wright Mansons kassa sidan:
I andra fall, som när du lägger till en ny adress i din adressbok på Amazon.com , standardvalet är det mest valda landet - i det här fallet USA:
Här är ett annat exempel, den här gången från en brittisk baserad verksamhet som heter North Rock Gallery , som har det brittiska alternativet valt som standard:
Dessa enkla exempel ovan visar vikten av att optimera för de funktioner och alternativ som används eller väljas oftast.
Var gör användarens titt?
De F-Mönster läsning och skanning vanor hos webanvändare har blivit ganska etablerade vid nu. Naturligtvis är F-Pattern inte alltid en indikator på alla marknader, men det är en ganska bra utgångspunkt för att överväga var dina användare kommer att se när de interagerar med dina mönster.
Ta en titt på de värmekartor som visas nedan från den välkända Alertbox-artikeln som är länkad ovan:
Förutsatt att detta är en bra indikator på var användarens öga är inriktat, stöder detta konceptet 80/20-regeln. De mest intensiva områdena på kartan kan representera 20% av sidan som användarens ögon interagerar med 80% av tiden.
Med den kunskapen som designers kan vi fatta beslut som hjälper till att förbättra och optimera de områden som användaren kommer att dra vanligt till.
Naturligtvis är utformningen ofta den avgörande faktorn för var användaren ser ut, så det här förslaget bör bara vara en grundläggande guide och inte nödvändigtvis ett dogmatiskt sätt att bestämma vad som faller under 20%.
Mobile Design Trends och 80/20 Rule
Nyligen med explosionen av mobila enheter över hela världen, några designers och utvecklare, framförallt Luke Wroblewski , har varit uppmuntrande mobil första webbdesign . Det vill säga när man utformar och utvecklar en webbplats, bör den mobila versionen göras först, istället för tvärtom, för att uppnå vissa fördelar.
På en traditionell webbplats eller webapp kommer vissa områden på din webbplats naturligtvis att falla under de 20% som oftast används och interageras med. När en mobil webbplats är utformad ligger fokus på den 20% (eller därutöver).
Så medan mobilversionen av en webbplats kan ha sina egna 20% mest använda alternativ, i förhållande till det fulla innehållet som finns tillgängligt på en traditionell webbplats, kommer den mobila versionen normalt bara ha de viktigaste funktionerna.
Här är ett enkelt exempel nedan med hjälp av PETCO.com hemsida:
Ovanstående är den fullständiga versionen av webbplatsen, i all sin röriga ära. Medan det finns några handlingsområden, och det är verkligen inte den värsta designen i världen, totalt sett är det inte särskilt fokuserat och det finns för många alternativ.
Jämför det med den mobila versionen nedan:
Däremot är det mobila gränssnittet som visas ovan enkelt och hjälper användaren att komma till de viktigaste områdena först utan att överväldiga dem. Oavsett vilka alternativ och innehållsområden som används mest i den fulla versionen är de enda alternativen som finns i mobilversionen.
Således är bra fokuserade mobilwebapplikationer bra exempel på designers som kanaliserar sina energier på de viktigaste aspekterna av sina projekt. De fokuserar på funktionalitet och innehåll (de 20%) som används mest (80%).
Lektioner summerad
Med förståelse för hur 80/20-regeln fungerar, är designers utrustade för att vidta åtgärder på ett antal sätt, sammanfattat nedan:
- Om möjligt analyserar analysdata och användbarhetsdata noga för att bestämma webbplatsens 20% mest använda funktioner
- prioritera; det vill säga fokusera på de viktigaste aspekterna av din webbplats eller webbapp, och förbättra dem
- Spendera inte för mycket tid på att optimera saker som faller i 80% som inte används ofta
- Förenkla dina mönster och layouter baserat på data som bestämmer vad som faller under de 20% mest använda funktionerna
- Ta bort icke-kritisk funktionalitet eller innehåll som inte används ofta
- Investera inte för mycket tid och pengar för att optimera mindre användbar funktion eftersom avkastningen på din investering sannolikt kommer att vara dålig
- Hitta sätt att förbättra funktionaliteten och utformningen av mindre använda mer kritiska element som kan få större inverkan på omvandlingar om dessa element i designen användes oftare
Medan 80/20-regeln är en diskutabel princip med vissa inneboende brister, är det inte utan värde. Så överväga den här regeln under processen med omkonstruktioner, anpassningar eller till och med för nya projekt.
Detta borde hjälpa dina användare att fokusera på den viktigaste funktionaliteten och innehållet, och hjälper till att förbättra omvandlingsfrekvensen.
Detta inlägg skrevs uteslutande för Webdesigner Depot av Louis Lazaris, en frilansskribent och webbutvecklare. Louis körs Imponerande Webs där han postar artiklar och handledning om webbdesign. Du kan följ Louis på Twitter eller ta kontakt med honom via hans hemsida.
Har du funderat på 80/20-regeln i dina designbeslut? Vilken effekt har det på framgången med din webbplats eller webbapp? Dela dina kommentarer nedan.