Stäng Huvudmeny

Mobile first = Desktop last?

Mobil UX-Design

Mobile First är hett. Säg att du inte tror på det – Då blir det dålig stämning i rummet. Men vi har sett ett antal fall den senaste tiden där ett fokus på mobilt gör att man offrar desktop-upplevelsen, och därmed det totala resultatet.

”Mobile First” betyder att man i sin webb-utveckling börjar med att designa och utveckla för den mobila upplevelsen istället för det som var vanligt innan, dvs att mobila sidor gjordes som nedskalade, förkrympta versioner av desktop-designen.

Webb-strategin Mobile First bygger på två idéer

  1. Det är lättare att designa för mobilt och skala upp än tvärtom.
  2. Mobilt är viktigare än desktop

Låt oss syna dessa idéer.

1. Det är lättare att designa för mobilt

Ja, det är sant. Men frågan är om vi ska låta vad som är enkelt för utvecklarna vara det som styr hur vi prioriterar den digitala upplevelsen?

Låt mig kontra, med en annan idé- Vi låter användarnas behov och affärsmålen styra hur vi prioriterar.

2. Mobilt är viktigare än desktop

För ett tag sedan arbetade vi med ett företag som riktar sig mot ungdomar. Ung = Mobil, eller hur? Ja det stämde, mer än hälften av trafiken till företagets ehandelsplats kom från mobila enheter. Och man förväntade sig att denna andel bara skulle växa.

Alltså gick man Mobile First. Satt som en smäck.

Men när den nya responsiva webb-platsen lanserats visade det sig att nästan all försäljning fortfarande kom från desktop. Trafiken var gott och väl över 50% mobil, men det var inte där kunderna köpte.

Låt oss ta ett räkneexempel:

Säg att den nya designen ledde till en ökning av konverteringsgraden från 0,3 till 0,9 % i mobilen. En ökning med 200% – Grymt.

Ok, man tappade lite på desktop som gick från  3,6 till 3,5 % – No big deal.

 

Men om försäljningen är 90% via desktop blir ekvationen:

  • (0,9-0,3) x 10%
  • (3,5-3,5) x 90%

=  – 3% i tappad total försäljning

 

Dvs, den nya fina responsiva sajten sålde mindre än den gamla sugiga icke responsiva.

Att Multichannel, eller Omnichannel, betyder olika beteenden och olika behov i olika kanaler är inget nytt. Men det som inte hängt med är att webb-byråer och andra inte dragit slutsatsen att det betyder att man inte kan smeta ut en Mobile First-strategi över alla sidor och flöden på en webbplats.

 

Man kan inte kan smeta ut en Mobile First-strategi över alla sidor och flöden på en webbplats

 

Kissmetrics blogg hade ett inlägg nyss kallat ”Some Ecommerce Channels Aren’t Meant to Close Sales”, där säger man att det är viktigt att definiera målet för varje kanal. Om målet med mobil-kanalen inte är att stänga köpet, då ska köp-sidorna inte vara optimerade för mobil i första hand.

Desktop last – i praktiken

Låt oss kolla på några exempel där Desktop last-strategin blir tydlig.

Vi tittar på beställningssida/checkout på två sidor. Om vi utgår från tanken att de flesta köper/beställer just på desktop, då blir den versionen viktigast att optimera.

Mobil-version

Här ser du två prydliga flöden. Två perfekta åk rätt ned i fallinjen. Fyll i lite grejer tryck på knappen och du är klar.

Varukorgen - mobil-versionCheckout - mobil-version

Desktop-version

Nu när designen stretchats ut på bredden så har vi istället två trixiga slalombanor som till och med skulle utmanat Ingemar Stenmark.

Vi har sett i våra tester att rena vertikala formulär konverterar bättre än formulär i flera kolumner. I sin bok ”Designing Web Forms”, Kallar Luke Wroblewski detta för  ”Clear scan lines”.

Så här misstänker vi starkt att vi har två fall av ”Desktop last”.

Svårt att scanna formuläret

Slalomåkning i formulär

Vad göra?

”- Ok, nu bitchar John på igen, kom med nåt konstruktivt”, tänker du.

-”Tack för att du frågar, tänkte just göra det”, säger jag.

Slutpoängen blir att inte titta på webbanalysdata på sajten som helhet. Titta istället på flöden och sektioner. Ställen där du har mycket mobiltrafik – Kör Mobile First och vice versa.

Rent generellt kan man väl säga att produktsidor där besökare browsar och landningssidor för nyhetsbrev bör vara mobiloptimerade, medan köpflöden och checkout kommer domineras av desktop och tablet fortfarande ett tag.

Men varje sajt har sina förutsättningar och utmaningar – Hur funkar det på din sajt? Dela med dig av mobila take i kommentarerna här nedan.

 


John Ekman Om John

John är galet passionerad av att förbättra Konvertering och Konverteringsgrad. Han har lång erfarenhet av att Optimera Affärsutfallet för online-företag och är grundare av Conversionista! - nr 1 på Online-konvertering i Sverige.

  • Sebastian Westberg

    När jag designar för ”desktop first” hamnar jag ofta i en situation där jag måste ta bort, flytta undan eller ”minifiera” mindre viktiga element vid mobilanpassningen. Jag tror att optimeringsglasögonen åker på naturligt när jag prioriterar elementen för
    mobil då ytorna och ”viewporten” ofta är begränsade i sin storlek.

    Om jag anpassar en ”mobile first” till desktop borde jag därför ha en bättre optimerad grund att stå på än om jag hade börjat i andra änden. Eller vad tror ni?

  • Pingback: Webb- och IT-nyheter 07/03/2014 | Läsvärt | Attefall Allehanda()

Få gratis konverteringstips

Anmäl dig till vårt nyhetsbrev

Nyhetsbrev

Lär av…

Kundcase Mathem ✻ Guldkorn
✻ Mallar och metoder
✻ A/B-tester och resultat
Lär av case

Kan du göra lika?

Se kundcase Se kundcase✔︎ Analys & webbpsykologi
✔︎ A/B-tester & resultat
Se alla case

Få platser kvar till flera seminarier

Anmäl dig till seminarium ✔︎ Webbpsykologi & verktyg
✔︎ A/B-testning & Google 360
✔︎ Snacka med experterna

Flera tillfällen i vinter

Säkra din plats

Spara 1000 kr

Conversion Jam 2017

Missade du?

Världens största CRO-event

Spara 1000 kr på din biljett till CJAM8

Du, kontakta oss!

Kontakta oss
Gitte eller hennes awesome kollegor hjälper dig.