Navigera med tangentbordet

För webbplatser som är tillgängliga är detta inget nytt. En webbplats som är tillgänglig innebär att du ska ha möjlighet att använda webbplatsen oavsett dina tekniska eller personliga förutsättningar. Det vill säga om du använder en äldre dator, har en mindre skärm eller har någon form av funktionsnedsättning.

Jag ser en trend i att fler och fler har börjat med tangentbordsnavigering, vilket är en bra sak ur ett UX-perspektiv. Kort sagt skapar du genvägar till sidor och funktioner på din webbplats som användaren kommer åt via olika tangenter.

JavaScript biblioteket Mousetrap gör det ganska enkelt att komma igång. Med Mousetrap kan du ange tangenter som CTRL, Shift eller Alt att utföra särskilda funktioner på din webbplats. Vilket även fungerar bra i äldre webbläsare.

Agus på Hongkiat har skrivit en bra guide i hur du kommer igång med tangentbordsnavigering och Mousetrap.

Läs guiden How To Add Keyboard Shortcuts To Your Website →

Att designa för att märkas

Om du designar för att märkas kan du vara fel ute. Bra design fungerar bra – i visuella och funktionella sinnen – och märks inte. Kanske är det dags att tänka om vid nästa redesign?

Good design is obvious. Great design is transparent.
– Joe Sparano, grafisk designer på Oxide Design Co.

Kolla in 20 andra inspirerande designcitat →

Att jobba som en albatross

Stefan är fotograf, han har skrivit en intressant reflektion kring sitt arbetssätt på sin blogg om hur han ser på sitt sätt att jobba som egenföretagare och frilans.

Igenkänningsfaktorn är hög då vi båda arbetat mycket och intensivt, både ihop med andra men framförallt som egna företagare. Under mina första år som egenföretagare jobbade på i 110, stannade aldrig upp, körde på, det blev pengar av det men till slut tråkigt då jag varken hade något liv utanför jobbet eller tid till att reflektera och förbättra mitt arbetssätt.

Numera jobbar jag inte riktigt så hårt, och tar tid till vila och reflektion och stannar upp för att se vad jag kan förbättra i mitt arbete. Kan jag effektivisera något av det jag gör varje vecka/månad, vad har gått bra, vad har gått mindre bra osv.

Jobbar du som egenföretagare eller frilans är det ett ganska intressant sätt att se på det, att jobba som en albatross.

Varannan avbryter sitt nätköp

Varannan avbryter sitt nätköp

I dagens DN kan du läsa att över hälften av alla svenskar uppger att de avbrutit sitt köp på nätet på grund av att processen varit för komplicerad. Och betyget på e-handlarnas kundservice sjunker.

Över hälften av svenskarna, 55%, uppger att det händer att de avbryter sitt köp på internet på grund av att det tar för lång tid eller att processen är för komplicerad. Detta enligt en färsk undersökning från Silentium där 1038 svenskar mellan 20 och 70 år svarat på frågor om e-handel.

Hittar tyvärr inte artikeln digitalt varken på dn.se eller Silentium’s webbplats.

Uppdatering: nu kan du läsa undersökningen i sin helhet, Köpbeteende på internet dec 2014 (PDF)

Som du kanske vet arbetar jag med konverteringsoptimering på RevRise, hör gärna av dig om du vill ha hjälp att optimera din köpprocess.

Glad utvecklarkultur

Chad Dickerson, tidigare CTO, numera CEO på Etsy pratar om ”Developer Happiness” och hur de på Etsy lyckas skapa en bra kultur där alla utvecklare och hundar (?) kan deploy:a kod till produktion. De gör ca 25 deploy till produktion varje dag.

En mycket bra föreläsning om utvecklarkultur, där Chad menar att mycket handlar om just kulturen, att lita på varandra och drar jämförelser till mentaliteten hos Dilbert och Charlie Chaplin.

Recension av nyhetstjänsten Omni i mobilen

Senaste tiden har jag börjat använda mig mer och mer av nyhetstjänsten Omni. Till en början via webbläsaren på iOS men senaste veckan via deras iPhone-app. Bra konvertering där! 😉

Efter några veckors användande finns det några saker jag tror skulle förbättra användarupplevelsen för mobila användare. Jag säger tror för jag har ingen aning om Omni-gänget har gjort några användartester på deras nuvarande version. Fullt möjligt att det är en vinnare av flera tester, jag kan ha fel.

Tänkte ändå skriva ett par rader med förbättringsförslag baserat på min erfarenhet av användartester för mobila appar/webbplatser och jämför också med några andra nyhetstjänster.

Positivt

  • Väldigt snygg och stilren tjänst överlag, bra typsnitt och fördelning av artiklar.
  • Liten navigering, fokus på innehåll – bra!
  • iPhone-appen: Direkt vid uppstart får jag tillgång till innehållet – bra!
  • iPhone-appen: Vid klick på menyknapparna har jag fortfarande möjlighet att gå tillbaka till innehållet
  • Djupdykningsalternativet ”Läs mer om” gillar jag också
  • Bra att ni inte har en annons högst upp som täcker 60-70% av min mobila enhet – tack.

Element med förbättringspotential

  • iPhone-appen: Likvärdiga ikoner för Huvudmeny och Nyhetsmix
  • Ingen meny i sidfoten/bottenläge
  • Ingen ”Tillbaka till toppen” länk i sidfot/botten

Mina förbättringsförslag

iPhone-appen

  • Ändra ikonerna för Huvudmeny och Nyhetsmix, de är väldigt lika varandra
Omni's toppnavigering i mobilen
Omni’s toppnavigering i mobilen

Vet att ”hamburgarikon” börjar bli utbrett men med text blir det tydligare och särskiljer sig mer från ikonen för Nyhetsmix. Alternativt lägga en border runt ikonen mer likt en knapp.

Också nyfiken på användningen av ”Toppnyheter” och ”Senaste nytt”, behövs båda eller är det en markant skillnad mellan dem?

Både responsiva sajten och iPhone-appen

  • Lägg in huvudmenyn i sidfoten/bottenläget så användaren snabbt kan byta kategori
  • Lägg in en ”Tillbaka till toppen” knapp
Omni's bottennavigering i mobilen
Omni’s bottennavigering i mobilen

* I iPhone-appen dyker toppnavigeringen upp när jag börjar scrolla uppåt igen men en meny i sidfoten/bottenläget ger ännu snabbare åtkomst till nyhetskategorierna.

Menynavigeringen i sidfoten/bottenläget hos andra nyhetstjänster

SvD och DN's bottennavigering i mobilen
SvD och DN’s bottennavigering i mobilen

Ergonomin i mobilen

När det gäller användarmönstret för mobila enheter har Luke Wroblewski skrivit en intressant bloggpost om beteendemönstret i våra olika enheter. Läs gärna Responsive Navigation: Optimizing for Touch Across Devices

Ergonomin i mobilen

Navigering i mobilen

Det var lite snabb feedback kring nyhetstjänsten Omni. Om du är en i gänget vore det kul att höra hur ni resonerat.

Fortsatt skön sommar!

Tack för en bra tjänst och Happy Optimizing!

Användartester i verkliga situationer

Gänget bakom bostadssajten Hemnet gör något riktigt smart just nu.

Teddy Zetterlund, utvecklare på Hemnet twittrade nyss

Smart och smidigt sätt att se hur användare använder din produkt eller tjänst i verkliga situationer och svarar på om tjänsten används på det sätt du förväntar dig, definierar problem och ger dig en insikt i hur dina användare beter sig och använder din produkt eller tjänst.

Riktigt snyggt initiativ av Hemnet! Tummen upp!

Vill skriva mer om användartester känner jag men får bli en annan gång…

Julkalender om webbformulär

Lär dig allt om webbformulär i vår julkalender. Vi kör en julkalender för er som vill få tips på hur ni kan optimera och öka konverteringen i era formulär såsom registreringsformulär eller kassan i en kundvagn. Syftet med kalendern är att ni ska göra formulären optimala både vad gäller användarvänlighet och konvertering.

Blogginläggen så här långt

Kolla in RevRise blogg →

Problem att logga in i Nordeas internetbank

Jag har nyligen bytt bank både företag och privat. Häromdagen när jag skulle logga in upptäckte jag något som riskerar att ge frustrerade kunder och i värsta fall även leder till att kundens kort spärras (vilket det gjorde i mitt fall).

Jag använder min privata internetbank flera gånger i veckan. Den här gången skulle jag göra ett köp via min företagsbank och fick följande felmeddelande.

Du har angivit fel uppgifter, eller använt en gammal kontrollkod. Försök igen. Vid upprepade felaktiga inloggningar spärras kortet för inloggning med e-kod i en timme.

Så lyder felmeddelandet om du fyller i något av de tre obligatoriska fälten fel.

Nordea's internetbank - Företag
Inloggningsformuläret till Nordeas internetbank för företag.

Detta var vid en köpsituation så jag var lite pressad av tiden och efter två felmeddelanden ringde jag både support och fick kortet spärrat för att jag inte var uppmärksam på att mitt personnummer inte skulle innehålla sekelsiffror.

I deras instruktioner finns det inte heller någon information om att mitt personnummer ska skrivas inklusive sekelsiffror.

Som jag nämnde använder jag min privata internetbank ofta och kollar vi närmare på deras inloggningsformulär så har de ett något bättre (om än generellt) felmeddelande.

Felmeddelande privata internetbanken

Du har angivit fel uppgifter, använt fel format på personnummer eller använt en gammal kontrollkod. Försök igen. Vid upprepade felaktiga inloggningar spärras kortet för inloggning med e-kod i en timme.

Här får jag reda på att jag eventuellt har fel format på personnumret.

Inloggningsformuläret Nordeas privata internetbank
Inloggningsformuläret till Nordeas internetbank för privatpersoner.

Nordeas privata inloggningsformulär ska innehålla personnummer med sekel.
Nordeas inloggningsformuläret för företag ska innehålla personnummer utan sekel.

I instruktionerna nedanför privata inloggningsformuläret står det ingenting alls om hur personnumret ska formateras, all fokus är på bankdosan.

Ett tillägg i instruktionerna eller ett bättre formulerat felmeddelande skulle förmodligen minska samtal från frustrerade kunder och spärrade kort som i sin tur kanske leder till köp via annan bank eller kreditkortsbolag istället.

Jonas Karlsson är en av grundarna till RevRise, ett analysverktyg som automatiskt upptäcker fel i webbformulär.

Grunderna i konvertering

Som ett första steg i att skriva lite mer arbetsrelaterat om webboptimering och webbanalys har jag skrivit ett blogginlägg om vad konvertering är och vad du kan tänka på som nybörjare i konverteringsoptimering. Något jag arbetar med nästan dagligen numera.

Vad konvertering är

Konvertering är att få dina besökare att göra det du vill att de ska göra på din webbplats eller landningssida. Det kan vara att besökaren registrerar sig, laddar ner en app eller köper en tjänst. Det verkar självklart och av samma anledning blir det därför svårt men extremt viktigt, särskilt för dig som är e-handlare eller på annat sätt har en hög omsättning på internet.

Konverteringsgrad = möjligheten att göra dina besökare till kunder

Tre faktorer du kan titta på för att öka din konverteringsgrad

  • Webbdesign, titta på det du har och gör inte en fullständig re-design
  • Webbanalys
  • Användarvänlighet

Bra verktyg för att analysera din webbplats

A/B testa med Google Website Optimizer som numera är integrerat med Google Analytics. Två andra alternativ är Visual Website Optimizer och Optimizely, båda kostar pengar men är kraftfulla verktyg. Optimizely är riktigt bra!

Några saker att testa

  • Storlek på beställningsknappar och hur du formulerar texten där (call to action). Att förstora sina åtgärdsknappar brukar hjälpa.
  • Rubriker. Du bör ha en övertygande, stark och trovärdig rubrik som lyfter ditt erbjudande.
  • Webbplatsens navigering och layout
  • Ditt erbjudande (value proposition)

Jag har skrivit mer om konvertering, A/B tester och value propositions borta på pushforward.se
Grunderna i konvertering – vad är konvertering? →
Grunderna i konvertering: A/B tester →
Grunderna i konvertering: value propositions →