• UI & UX

Pareto-princippet i webdesign - design et mere effektivt websted med 80/20-reglen

  • Lene Wandrey
  • 1 min read
Pareto-princippet i webdesign - design et mere effektivt websted med 80/20-reglen

Problemet med at være perfektionist inden for webdesign

Perfektionisme kan være en udfordring for mange grafiske designere og webdesignere. Det er beundringsværdigt at stræbe efter ekspertise, men det kan føre til frustrationer, når man skal ændre og justere i en uendelighed, indtil alle elementer på webstedet er perfekte. For mange designere er det let at blive opslugt af designprocessen og miste tidsfornemmelsen, mens man vælger skrifttyper, farvepaletter og overvejer hundredvis af pixelperfekte designbeslutninger. Selvfølgelig er det vigtigt at levere et godt stykke arbejde, men som designer er det let at miste fokus på, hvad det betyder? Et website bør ikke handle om designerens mål, det bør handle om at opfylde kundens ønskede resultat og samtidig balancere begrænsningerne i form af tid, ressourcer og energi. Uden begrænsninger kan et website let ende med at blive over-engineered, langsomt, med for mange elementer og funktioner, der forvirrer brugerne. Det er også svært at få plads til alle funktionerne på den begrænsede tid, så designeren risikerer simpelthen at løbe tør for tid, og det er meget stressende for alle involverede parter, hvis det ikke lykkes at levere et godt websted inden for den fastsatte frist.

Hvad er Pareto-princippet?

"80/20-reglen", der også kaldes Pareto-princippet, siger, at 80 % af virkningerne kommer fra 20 % af årsagerne. Pareto-princippet blev første gang introduceret af den italienske økonom Vilfredo Pareto i 1895, da han konstaterede, at 80 % af Italiens rigdom var ejet af kun 20 % af befolkningen. Han bemærkede også, at 20 % af ærtebælgene i hans have producerede 80 % af ærterne! Pareto-princippet antyder, at nogle få nøgleelementer er ansvarlige for at producere størstedelen af et givet resultat. Siden da er det blevet anvendt på mange andre områder, herunder forretning, økonomi og psykologi, og det kan endda være praktisk anvendeligt i hverdagen.

Dette gælder også for mindre virksomheder; har du nogensinde lagt mærke til, at størstedelen af din indkomst kommer fra en håndfuld af de samme faste kunder? Eller at du tilsyneladende altid går med de samme tøjstykker, mens det meste af din garderobe ikke bliver brugt? Selv om forholdet ikke altid er nøjagtigt 80/20, og der altid er undtagelser, er det et fantastisk værktøj til at hjælpe folk med at identificere, hvilke handlinger der har størst indflydelse på deres succes, og prioritere disse i overensstemmelse hermed.

Pareto-princippet i webdesign og digital markedsføring

Pareto-princippet, der anvendes på webdesign, går ud fra, at de fleste resultater kommer fra et lille antal nøglefunktioner. Inden for markedsføring vil nogle kampagner give langt bedre resultater end andre. For at opnå det bedste resultat giver det mening at fokusere på disse få nøglefunktioner først og sikre, at de får mest opmærksomhed, mens de mindre vigtige dele kan gøres hurtigere. En måde at bruge Pareto-princippet på er ved at fokusere på brugeroplevelse og brugervenlighed - ved at være opmærksom på, hvordan brugerne interagerer med dit onlineindhold og sikre, at de kan finde det, de har brug for, vil du sandsynligvis høste større gevinster, end hvis du blot fokuserer på æstetik alene. Det lærer os, at perfektion ikke altid er nødvendig, og at det er muligt at opnå et endnu mere effektivt websted ved at optimere de vigtige 20 % af funktionerne.

Vi har f.eks. lige kigget på trafikdataene for en lille e-handelsbutik, der sælger håndlavede produkter, og har bemærket flere Pareto-tendenser. For eksempel får næsten alle deres besøgende adgang til webstedet via mobilen. De fleste produktsalg kommer fra et lille antal kategorier. Facebook var deres største kilde til trafik via sociale medier. Når man undersøger et heatmap af produktsiden, er der nogle områder, der får mere engagement. Det typiske F-mønster kan i nogen grad observeres, med klynger af interaktioner i den øverste række og ned langs venstre side af siden.

Devices popularity

Dashboard with website analytics data

Hvad kan man gøre med disse oplysninger for at forbedre salget for denne kunde?

I dette eksempel ville den hurtigste gevinst være at forbedre mobiloplevelsen af dette websted, som oprindeligt blev bygget til desktop. Heatmaps af alle sider kunne undersøges for at få mere at vide om brugerpræferencerne. F.eks. kunne de mest klikkede spørgsmål fra FAQ-sektionen flyttes til forsiden i stedet for at blive gemt væk. Produkter med høj indtjening kunne præsenteres på de områder af siden, hvor der sandsynligvis bliver klikket mest.

Start altid med "hvorfor

Always start with the Why(Billedkilde: Envato Elements)

Ud fra min erfaring i branchen har jeg bemærket, at mange designere er glade for at acceptere briefingen og begynde at arbejde på design, selv om de mangler vigtige oplysninger om formålet med projektet. Måske troede den person, der udarbejdede briefingen, at disse oplysninger var underforstået, eller kunden har ikke formuleret dem kortfattet. Tag et øjeblik til at træde et skridt tilbage, før du begynder at arbejde. Uden en klar forståelse af, hvorfor du gør det, du gør, vil dit webdesign mangle retning. Dit websted ser måske godt ud for dig og endda for kunden, men på trods af dine mange timer vil resultatet være skuffende, hvis det ikke opnår de forventede resultater for kunden.

Spørg dig selv: Hvorfor findes dette websted? Hvem vil være slutbrugerne af webstedet, og hvordan vil de interagere på webstedet? Hvordan vil webstedet skabe værdi og succes for din kunde? Hvordan vil kunden måle denne succes? Hvordan vil webstedet tiltrække besøgende og fange kundeemner? Når du kan besvare disse spørgsmål, og du forstår "hvorfor", bliver det lettere at prioritere "hvad" og "hvordan" designelementerne. Når du kan visualisere det ønskede resultat, vil det hjælpe dig med at koncentrere din energi om de vigtigste områder for at opnå dette.

Omfavn tilgangen til minimum levedygtigt produkt i webdesign

Der er så mange beslutninger at tage, når man skal designe et websted, at det kan være svært at vide, hvor man skal begynde. MVP-tilgangen (minimum viable product) indebærer, at man kun bygger de centrale elementer af et websted med det samme og derefter løbende forfiner dem gennem feedback fra kunderne over tid. Det gøres normalt for at spare omkostninger og tid, eller når en forretningsidé er baseret på mange antagelser. I stedet for at forsøge alting på én gang kan udviklerne prioritere funktionerne ud fra kundernes behov og skabe prototyper så hurtigt som muligt. Selv når du ikke er tids- eller budgetmæssigt presset, er det at omfavne webstedet som en MVP en fantastisk måde at anvende Pareto-princippet og bekæmpe perfektionistiske tendenser. Mentalt hjælper det at vide, at du altid kan tilføje flere funktioner senere, men at du bør fokusere på de vigtigste elementer lige nu.

Design til mobile-first kan hjælpe dig med at forenkle dit websted

Når du designer et websted, skal du give brugerne en effektiv og intuitiv oplevelse. Den bedste måde at opnå dette på er at designe med en "mobile-first"-designtilgang. Dette koncept indebærer, at man først og fremmest skaber websteder, der er optimeret til mobile enheder, i stedet for desktopwebsteder, der er tilpasset til mobilen. Hvorfor er dette nødvendigt? I 2022 vil mobiltelefoner ifølge techjury.net generere 60,66 % af webside-trafikken, mens stationære computere og tablets tilsammen står for 39,34 %. Dette kan variere i forskellige brancher og på forskellige websites, men tendensen er værd at bemærke. Ved at fokusere dit design på den mobile version af webstedet kan du stable oddsene for succes i din favør.

Når du begynder at designe til mobile enheder, vil du hurtigt opdage, at der er mindre plads til ord og rod. Det er ret svært at tilpasse sig, hvis man har designet til desktops i lang tid. Men denne tilgang passer godt ind i Pareto-princippet, da den hjælper dig med at vælge det indhold, der har størst effekt. Det har to fordele: Dit websted vil være optimeret til den mobile platform, som brugerne foretrækker, og når du tilpasser det til desktop, vil det visuelt se moderne og rent ud. Du skal stadig tilpasse dit websted til desktop senere, men når du arbejder ud fra mobile-first-tilgangen, bliver det meget nemmere, da du allerede har et forenklet design.

Lav research og analysér konkurrenternes websteder

Når det drejer sig om webdesign, tænker vi ofte på research som at se på andre inspirerende websteder eller skabeloner med smukke designelementer. Men research i forbindelse med webdesign går videre end blot at beundre æstetikken på andre websites. Det er nødvendigt at forstå, hvordan folk bruger nettet, hvordan brugerne interagerer med forskellige designs, og hvordan indholdet organiseres for at skabe et effektivt websted. Ved at bede om alle analysedata, som kunden kan give os, eller ved at bruge et overvågningsværktøj som Ranktracker kan vi bedre identificere områder med mulighed for forbedringer for at få et bedre fungerende website.

Forskningen bør omfatte en undersøgelse af eksisterende industristandarder, målgrupper og brugernes præferencer gennem konkurrentanalyse. Du kan finde konkurrenterne ved at spørge kunden eller ved at foretage dine egne søgninger og se, hvilke websteder der ligger øverst på listen. Når du har identificeret nogle konkurrenter, har du brug for en pålidelig kilde til data om dem. En af mine yndlingsfunktioner i Ranktracker er muligheden for at tilføje dine egne identificerede konkurrenter, hvorefter den viser konkurrenternes præstationer i en kolonne ved siden af dine egne domæneresultater. Hvis en konkurrent overrangerer dig på dine egne søgeord, er det værd at analysere deres websted for at lære af dem. For at tilføje en konkurrent skal du blot indsætte deres URL-adresse.

Add competitors in Rank Tracker

Rank Tracker board

Klik for at læse en god artikel om, hvordan du gennemfører en konkurrenceanalyse.

Mens du laver al din research, skal du lave en "drømmeliste" over alle mulige funktioner og elementer, du kunne inkludere (bare rolig, du skal nok indsnævre dem, men det er nyttigt at have alle ideerne samlet).

Planlægning: Identificering af centrale designelementer

Planning: Identifying Key Design Features(Billedkilde: Envato Elements)

Designet af et websted bør være baseret på dets formål. Se på alle elementerne/funktionerne fra din drømmeliste og vælg dem, som du mener vil hjælpe din kunde med at nå sit mål. Tag noget blankt papir og begynd at tegne nogle grove wireframes for dit websted. På dine wireframes skal du forbinde hvert element, du planlægger at inkludere, med et resultat: Hvis du ikke kan finde et klart formål med det, skal du skrotte den pågældende sektion. Tænk ikke på designæstetik, men fokuser på, hvad der er bedst for brugeroplevelsen og brugervenligheden.

I modsætning til hvad mange tror, behøver dine første wireframes ikke at blive designet med et smart designprogram. Den analoge tilgang med blyant og papir fungerer fint, og nogle gange endda bedre, da du ikke bliver distraheret af selve softwaren. Papir er mere tilgivende og mindre permanent; det er hurtigere at bruge, hvilket kan være en hjælp i den kreative proces. Hvis du skal præsentere wireframes for din kunde, kan dette gøres mere professionelt, når du har arbejdet dig igennem de grove tegninger.

Lav en mock-up først, design ikke på webplatformen for at spare tid

Der er et gammelt ordsprog, der siger, at man ikke kan flyve et fly, mens man er ved at bygge det. Det gælder også for webdesign: At forsøge at bygge et websted, mens du stadig er ved at finde ud af beslutninger om indhold, funktioner og design, er en opskrift på frustration. For at holde tingene effektive har du brug for en plan. At oprette en mock-up af hver side virker tidskrævende og kontraintuitivt her, men det tjener mange formål og vil spare tid i det lange løb. Mock-ups gør det muligt for din kunde at visualisere hjemmesiden, før webudviklingen overhovedet begynder. De kan opleve de forskellige farve- og skrifttypemuligheder og nemt forudse, hvad der skal ændres. Ved at diskutere en mock-up skabes der mange muligheder for diskussion og spørgsmål. Det øger chancerne for, at din kunde vil være tilfreds, når han/hun ser det levende websted for første gang. Vigtigst af alt giver arbejdet med en mock-up dig mulighed for at bygge webstedet meget hurtigere, når du kommer til udviklingsfasen, da næsten alle de kreative beslutninger allerede er truffet.

Arbejd med indhold, der vil ranke godt på søgemaskinerne

Nogle gange vil en kunde insistere på, at du starter med at designe med "pladsholdertekst", da de tror, at din rolle kun er at designe de æstetiske elementer. Hvis det er muligt, skal du undgå at lave designarbejde med generisk pladsholdertekst. Selv om dine designs måske ser smukke ud, vil dit websted mangle formål, hvis du forsømmer en vigtig ingrediens som velskrevet indhold.

Et websted er kun værdifuldt, hvis det får besøgende, og søgemaskineoptimering (SEO) er den måde, hvorpå søgemaskinerne finder dit websted på organisk vis. De ordvalg, der anvendes på en side, er afgørende for SEO, og designelementerne skal understøtte ordvalget. Hvis du ved, hvad søgeordene er på forhånd, giver det dig ekstra indsigt. Hvis du samarbejder med en tekstforfatter til dit indhold, skal du sikre dig, at vedkommende er bekendt med SEO. Selv hvis du ikke er SEO-ekspert, så bliv fortrolig med dette emne, så du kan være mere opmærksom på dette under din webdesignproces.

Nogle søgeværktøjer til søgeord er komplicerede (især hvis du er nybegynder inden for SEO), men Ranktracker Keyword Finder er meget enkel og intuitiv: du skal blot tilføje søgeord til en liste, og resultaterne vises med farvekoder efter søgeordets sværhedsgrad. For at opnå god SEO ønsker du at vælge søgeord med lav konkurrence, men med tilstrækkelig søgemængde, så det er meget nyttigt, at søgemængderne vises lige der.

Keyword Finder

Så før du går i gang, skal du forsøge at få i det mindste et udkast til ordlyden. Hvis du er en selvstændig designer, er det sandsynligt, at du også skal hjælpe kunden med at finde ud af, hvor ordlyden passer bedst på webstedet. En realitet i designprocessen er, at denne ordlyd kan ændre sig et par gange, men det er meget bedre at have noget at starte med end slet ikke at have noget.

Forenkle valg af skrifttyper, farver, hierarki og visuelle elementer

Hvis du er en mindre erfaren designer eller bare gerne vil spare lidt tid, er det nyttigt at arbejde med skabeloner og bruge dem som grundlag. For et CMS som WordPress findes der tusindvis af gode skabeloner til rimelige priser. Disse har allerede skrifttyper, farver, hierarki og visuelle elementer, der er designet i en sammenhængende stil. Hvis du er bekymret for originalitet, kan du være sikker på, at dit resultat vil se anderledes ud end skabelonen, da du tilpasser den til dine wireframes. At have nogle designaktiver og en generel stil at starte med kan virkelig hjælpe dig med at finde en retning og mindske beslutningsmødigheden. Inddrag ikke for mange farver: Du kan roligt begrænse dine websitefarver til 2 farver eller højst 3. Tjek The 20 Best Color Combinations to Try on Your Website for at få nogle gode idéer og tendenser, når du vælger websitefarver.

Konklusion: Maksimering af virkningen

Ved at vide, hvor man skal fokusere, kan man hjælpe en designer med at styre sine perfektionistiske tendenser og samtidig opnå succes. Pareto-princippet er en tommelfingerregel inden for webdesign, der siger, at 80 % af brugeroplevelsen kan opnås med 20 % af indsatsen. Det betyder, at webdesignere skal fokusere deres indsats på at optimere indhold, designelementer på siden, brugervenlighed og andre faktorer for at skabe et effektivt websted, der vil ligge godt på søgemaskinerne.

Lene Wandrey

Lene Wandrey

Lene Wandrey is a tech-loving artist, graphic designer and entrepreneur living in South Africa. She's the founder of hot-designs.com. She is passionate about design and productivity.

Link: hot-designs.com

Prøv Ranktracker GRATIS