For de fleste har det længe været en selvfølge, at skal designe og udvikle en hjemmeside med fokus på, at den skal kunne fungere optimalt på en smartphone. Sådan har det efterhånden været i flere år, og det vil i høj grad fortsat være tilfældet fremadrettet.

Det kan godt være, at det er en selvfølge for de fleste, at man jo selvfølgelig skal udvikle et website med afsæt i mobile first-principperne, men ved du egentlig, hvad det helt konkret indebærer?

Lyder det her lidt for ”last year” til din smag? Føler du, at du allerede har styr på alt, hvad der vedrører mobile first? Jeg vil vove at påstå, at uanset hvor imponerende en helhedsoplevelse, du i forvejen tilbyder dine smartphonebrugere, så mon ikke, at der alligevel ligger et guldkorn eller to gemt i denne artikel, som du kan bruge til noget? 

Guiden her er ikke nogen komplet guide til, hvordan man designer og udvikler et website. Det er snarere med formålet om at give dig lidt input og sætte nogle tanker i gang til, hvordan man bør tænke webdesign i den digitale tidsalder, vi lever i.

Læs med, og bliv klogere.

Hvad er mobile first?

Mobile first er først og fremmest en designstrategi, hvor det altoverskyggende formål er at designe og udvikle med udgangspunkt i mobilbrugernes behov og ønsker.

I stedet for at man først udvikler et desktopwebsite og derefter tvinger hjemmesiden til med nød og næppe at passe i et mobilformat, så skal man tænke mobil, før man tænker noget andet. 55,64 % af al internettrafik foregår fra en mobilenhed.

Hvorfor er det vigtigt med en mobilvenlig hjemmeside?

Det er efterhånden ved at være længe siden, at Google proklamerede, at man nu ville begynde at tage udgangspunkt i mobilversionen af et website, når hjemmesider skal vurderes, og søgeresultater skal indekseres.

Dermed er det altså den oplevelse, som du præsenterer for dine mobilbrugere, som er den, Google også ser, og derfor kan der ikke være nogen tvivl om vigtigheden af at levere en mobiloplevelse, der siger spar 2.

Sådan skaber du et mobile first website

1. Jo mindre indhold, jo bedre (eller hvad?)

Indimellem vil man høre, at jo mere relevant kvalitetsindhold, man kan skrive, jo bedre.

Ifølge undersøgelsen her fremgår det, at meget lange og dybdegående blogindlæg er i stand til at skabe hele 9 gange flere leads, end korte blogindlæg er i stand til.

Det er sådan set også rigtigt i de fleste tilfælde, at store mængder kvalitetsindhold kan være særdeles fordelagtigt. I visse andre tilfælde kan det dog være en fordel, at man IKKE præsenterer brugeren for maratonindlæg.

Selvom skærmene på smartphones bliver større og større, efterhånden som nye udgaver kommer på markedet, så er det altså immervæk en ret lille skærm sammenlignet med en computerskærm.

Derfor er det vigtigt, at du er konkret og præcis i præsentationen af dit indhold for den bruger, der ser og læser indholdet på en mobilskærm.

Løsningen er, at du holder det kortfattet og præcist. Når det er muligt, bør du også dele indholdet op i mindre bidder, så det er så letspiseligt for brugeren som muligt.

2. Fokusér på et simpelt webdesign

Det kan lyde helt vildt banalt at fortælle, at du skal prøve at simplificere designet på din hjemmeside for at leve op til mobile first-principperne.
Ikke desto mindre er det altid godt lige at blive husket på, at man ikke skal proppe for mange overflødige elementer ind i sit webdesign på mobilen. Jo mere simpelt du kan gøre det, jo klarere står det for brugeren, hvordan vedkommende skal navigere videre rundt på sitet, og i sidste ende kan det hjælpe dig til at opnå en konvertering.

I langt de fleste tilfælde ønsker vi mennesker helt grundlæggende, at det, vi bliver præsenteret for, er simpelt og let at gå til. Det gælder i høj grad også, når vi taler mobile first webdesign.

Spørg dig selv ved hvert eneste element, om det virkelig er så vigtigt at få inkluderet på hjemmesiden?

• Ville du måske kunne reducere antallet af spørgsmål i din kontaktformular?
• Kan du minimere antallet af menupunkter i din menu?
• Kan du nedbringe antallet af undersider på dit website?
• Kan du gøre det nemmere for brugeren at søge på dit website?
• Kan du øge brugen af whitespace på siden, så indholdet fremstår mere overskueligt, fremtrædende og opdelt?
• Kan du gøre brug af en mere letlæselig font? Skal skriftstørrelsen måske gøres større i brødteksten og i overskrifterne? Skal den måske gøres mindre?
• Kan du minimere antallet af kolonner i indholdet? Deler du indholdet op i mere end to kolonner, bliver det svært for dig at gøre det behageligt at kigge på, på en smartphone-skærm.

3. Tænk grafisk design i en mobilsammenhæng

Har det virkelig nogen betydning i en mobile first-sammenhæng, hvilke farver og grafiske virkemidler man gør brug af? Svaret er ja.

Helt grundlæggende ligger der en enorm værdi i kunsten at skabe et website, som brugeren rent faktisk husker for den behagelige brugeroplevelse, den er i stand til at tilbyde.

En undersøgelse viser, at hjemmesider, hvor der virkelig er lagt en stor indsats i at skabe et smukt og mindeværdigt design, udkonkurrerer hjemmesider, hvor grafisk design slet ikke har været et fokuspunkt.

Det lyder måske en smule banalt og sort-hvidt at stille det op på den måde.

Men et lækkert designet website vil i mange tilfælde fremstå mere troværdigt og altså nemmere at huske.

Der findes rigtig mange anbefalinger, man kan tage udgangspunkt i, når man skal designe et website med et flot grafisk udtryk.

Så hvad er egentlig vigtigt – rent grafisk og designmæssigt – når man designer et mobile first-website?

Det drejer sig om en række grundlæggende elementer, der ikke nødvendigvis er unikke for webdesign til mobilwebsites, men som i alle tilfælde er værd at arbejde målrettet med:

• Sats på rene linjer, lyse farver og stærke, fremtrædende typografier
• Hold det minimalistisk
• Benyt dig af whitespace, som både gør det visuelt indbydende at se på, og samtidig gør navigation nemmere
• Fart, fart og mere fart

Page speed har alle dage været et utrolig vigtigt parameter for alle websites i det hele taget og især også for mobiludgaven af hjemmesider.

For knap tre år siden gjorde Google det til en reel rankingfaktor. Fra og med 2018 blev page speed noget, Google tager med i sin vurdering, når et website skal indekseres og rankes i søgeresultaterne.

Vidste du eksempelvis godt, at mere end 40 % af alle brugere forlader et website, hvis det tager mere end 3 sekunder at indlæse det?

Driver du en webshop, og oplever de en bøvlet og langsom brugeroplevelse, så vil 79 % af alle brugere være mindre tilbøjelig til at købe fra dig i fremtiden.

Hvordan forbedrer man page speed på sit mobil website?

• Installér CDN

Dermed sikrer du, at indholdet indlæses fra den server/cache, som er tættest på brugeren, hvilket minimerer indlæsningstiden.

• Komprimér billeder

Ved at komprimere billederne på hjemmesiden, så de fortsat ser godt ud, men fylder mindre, sørger du for, at hjemmesiden indlæses hurtigere.

• Brug lazy loading

Lazy loading sikrer, at indhold på dit website først bliver indlæst, når der reelt er brug for det – f.eks. når brugeren scroller ned til et element længere nede på siden.

• Installér SSL-certifikat

Ved at installere et SSL-certifikat og sikre dit website og ikke mindst dine brugere med en HTTPS-forbindelse, opnår du en hurtigere, mere sikker og SEO-venlig hjemmeside.

Udviklingen går kun én vej.

I starten af artiklen nævnte jeg, at 55,64 % af al internettrafik foregår fra en mobilenhed. Det er et tal, der udelukkende kommer til at stige fremadrettet.

Langt de fleste har gjort eller gør sig allerede tanker om, hvordan de kan levere en behagelig brugeroplevelse på mobilen.

Men det betyder ikke, at der ikke findes steder, hvor man kan finpudse og blive endnu skarpere.

I løbet af artiklen her har du måske fået et input eller to, som du kan bruge i designet og udviklingen af dit mobile first website.