Så får ni en användarvänlig hemsida som ökar er försäljning

En användarvänlig hemsida och webbdesign är grunden för fler leads. Den hänger dessutom ihop med mer organisk trafik.

Här kommer vi gå igenom vilka delar vi hade kollat extra på, hur ni ökar försäljningen och hur ni kan använda verklig data för att förbättra användarvänligheten.

Tipsen kommer från vår 10+ års erfarenhet som webbyrå i Malmö. Vi gör skräddarsydda hemsidor i WordPress med fokus på att öka våra kunders försäljning.

Användarvänlig webbdesign innebär att besökaren direkt förstår vad ni erbjuder, hittar det den letar efter och kan ta nästa steg utan att behöva tänka efter, i mobilen lika väl som på datorn.

En användarvänlig hemsida, eller webbplats, känns igen på samma saker oavsett bransch:

1. Det syns direkt vad ni gör och vem det är för.
2. Menyn använder kundens ord, inte era interna avdelningsnamn.
3. Sidan laddar snabbt och reagerar direkt när man klickar.
4. Texten går att skumma tack vare rubriker, korta stycken och punktlistor.
5. Varje sida har ett tydligt nästa steg.
6. Formulären frågar bara efter det ni behöver.
7. Den fungerar för alla, även för den som ser dåligt eller navigerar med tangentbordet.

En användarvänlig hemsida brukar hänga ihop med fler förfrågningar, och det är alltid målet för oss på Sunbird.

Här är de delar av en hemsida vi sett ger goda resultat när man gör användaren nöjd.

Mobilanpassning, alltså responsiv design, är numera en självklarhet. Att hemsidan fungerar i mobilen är däremot bara början.

För er som vill förbättra användarens upplevelse bör man inte bara göra en mobilvariant av hemsidan utan anpassa den mer.

Exempelvis är det mer sannolikt att personer ringer er från telefonen än om de besöker er via datorn. Att på mobilen ha telefonnumret tydligare än på datorn kan därför vara något som förbättrar användarupplevelsen.

Samma sak gäller inloggning och betalning. Enligt Internetstiftelsen (Svenskarna och internet, 2026) använder 94 procent av den svenska befolkningen e-legitimation, och mobilt BankID är den lösning som dominerar. Låt besökaren logga in, signera eller betala med BankID i stället för att knappa in lösenord och kortnummer på en liten skärm.

Tänk också på tummen. Ju längre bort en knapp sitter och ju mindre den är, desto längre tid tar det att träffa den (Fitts lag, om någon undrar). Lägg de viktigaste knapparna där tummen når och gör dem stora nog att träffa på första försöket.

Människor läser sällan texter ord för ord, framför allt inte om de letar efter en tjänst. Vill de däremot lära sig något, exempelvis som detta blogginlägg, är det mer accepterat att ha längre textstycken.

Vi har märkt att hemsidor som istället använder tydliga rubriker, kortare textstycken, markerade ord/meningar och punktlistor hjälper användaren att snappa upp det väsentliga.

Att försöka säga allt som är bra med er brukar oftast resultera i att man inte uppfattar något.

Precis som att användaren skummar på hemsidor dras ögat till saker med högre visuell hierarki. Hög kontrast, stor text och rörliga element tar mycket fokus för ögat. Nedan är ett exempel på hur ögat kan flöda:

Rörelse drar blicken, men bildkaruseller på startsidan har besökarna lärt sig att hoppa över. Enligt University of Notre Dame och Nielsen Norman Group (2022) klickar bara cirka 1 procent på en karusell, och 84-89 procent av de klicken hamnar på första bilden. Det ni lägger på bild två och tre ser i princip ingen. Välj ett budskap och en knapp i stället.

Strukturera er hemsida så att informationen är lätt att hitta och förstå. Använd en tydlig och konsekvent menynavigering, välorganiserade kategorier och en sökfunktion för att hjälpa besökare att snabbt hitta vad de letar efter.

Effektiv navigering är grunden i en användarvänlig hemsida. Använd enkel och intuitiv menynavigering som hjälper användare att snabbt förstå hur de navigerar på er hemsida. Undvik komplexa eller dolda navigeringsmenyer som kan förvirra användare.

Allt för ofta hör vi att ”allt ska gå att nå inom tre klick”. Den regeln håller inte. Användbarhetsstudier har inte hittat något samband mellan antalet klick och om besökaren hittar rätt. Det som spelar roll är att varje klick känns som rätt väg, det som kallas information scent.

Ser besökaren att den kommer närmare det den letar efter klickar den gärna flera gånger. Ser den inte det räcker ett par klick för att den ska ge upp. Skriv därför menyrubrikerna med samma ord som kunden använder.

En hemsida som tar lång tid att ladda är en hemsida som förlorar besökare. Använd komprimerade bilder, minimerad kod och pålitlig hosting för att hålla laddningstiderna korta. Använd verktyg som GTMetrix eller PageSpeed Insights för att kontinuerligt övervaka och förbättra er hemsidas prestanda.

Laddningstid räcker dock inte. Sidan måste också reagera direkt när besökaren klickar, öppnar menyn eller fyller i ett formulär. Det mäts med Interaction to Next Paint (INP), och enligt Google (web.dev, 2024) ska INP vara 200 millisekunder eller lägre.

Ligger ni över det upplevs sidan som trög. Då klickar folk igen, eller lämnar. Tunga skript, inte minst från tredjepart, brukar ligga bakom. INP mäts på verkliga besökare via Googles Chrome User Experience Report (CrUX), så det är där ni ser hur sidan upplevs på riktigt.

Att allt på er hemsida är konsekvent, så att användaren kan börja förstå den, är viktigt för användarupplevelsen. Framför allt för större hemsidor, e-butiker och konton.

Besökarna har lärt sig hur en meny, en varukorg och ett formulär fungerar på andra hemsidor (Jakobs lag, om ni vill ha ett namn på det). Finns det etablerade normer och något ni kan återanvända, gör det.

Att finslipa varje enskilt block för att göra det så snyggt som möjligt brukar försämra användarupplevelsen.

Er hemsida ska självklart erbjuda samma användarupplevelse oavsett vilken webbläsare besökaren använder. Testa er hemsida i olika webbläsare och se till att alla element och funktioner fungerar korrekt i var och en av dem.

Kolla i Google Analytics vilka webbläsare era egna besökare använder. Testa de största noggrant på alla sidor och resten på de viktigaste delarna.

Footer, sektionen längst ner på hemsidan, används av många för att navigera på hemsidan.

• Ange kontaktuppgifter
• Använd ytan för navigering (men inte identisk med headern om den följer med på scroll)
• Passa på att få ut ett budskap

Gör er hemsida tillgänglig för alla, inklusive personer med olika funktionsnedsättningar. Använd tydliga och stora teckensnitt och kontrastrika färgscheman för att säkerställa att er hemsida är lika tydlig för alla.

Detta gäller inte bara folk med tydliga synnedsättningar utan även en äldre målgrupp uppskattar när texten är enkel att läsa.

Tänk på att alla användare inte är lika vana med hemsidor som ni som gör dem.

Säljer ni till konsumenter kan tillgänglighet dessutom vara ett lagkrav. Mer om det under tekniska och juridiska krav längre ner.

En användarvänlig hemsida hanterar fel effektivt och tydligt. Visa felmeddelanden och hur användaren kan åtgärda det. Skriv felet i text vid fältet och inte bara som en röd ram, annars missar den som är färgblind det.

Tänk på att släppa igenom olika format, exempelvis ska både 070-3078883 och 0703078883 fungera.

Ett annat tips är också att inte kräva mer information än nödvändigt. Man får exempelvis ofta både namn och webbadress från mejladressen.

Man kan också bygga formulär så den kräver telefonnummer eller mejladress. En kund som vill bli kontaktad kommer ange båda. Men om de inte vill bli uppringda i en första kontakt ska man inte heller tvinga dem ange det.

En 404-sida är något som en användare möts av när de besökt en URL som inte finns. Det vanliga är att man enbart har ett felmeddelande och en länk till startsidan.

Vår rekommendation hade varit att inkludera flera länkar. För en e-handel kan man exempelvis välja att gå till startsidan, shoppen eller kontaktsidan.

Call to actions är en viktig del i er avslutningsfrekvens, vilket är avgörande för att få in fler leads. Användare som söker efter något vill hitta rätt alternativ. Ni förbättrar användarupplevelsen genom att:

1. Ha tydlig text och undvika att vara vag
2. Använda flera olika budskap, exempelvis ”Kontakt”, ”Offertförfrågan” och ”Ställ en fråga”
3. Ha hög kontrast mot bakgrunden så att er CTA syns
4. Använda en färg som bryter av (men inte för ofta)

Läs gärna mer om hur man skriver en call to action som besökarna vill klicka på.

Ni ökar försäljningen på hemsidan genom att fler av de besökare ni redan har tar nästa steg. De flesta tips på hemsidor handlar om hur det ser ut. Men det är budskapet, erbjudandet och tröskeln in som avgör om någon hör av sig.

Ta ett räkneexempel. Har ni 1 000 besökare i månaden och 2 av 100 hör av sig får ni 20 förfrågningar. Kommer ni upp i 3 av 100 blir det 30, utan att ni lagt en krona mer på annonser (siffrorna är påhittade, matematiken är det inte). Det är så man springer om konkurrenter som har mer trafik än en själv.

Besökaren ska förstå direkt om ni är till för just dem. ”Vi hjälper företag att växa” säger ingenting. ”Redovisningsbyrå för restauranger i Skåne” gör det lätt för rätt kund att känna igen sig, och lika lätt för fel kund att gå vidare.

Allt för ofta ser vi att enda vägen in är ”Kontakta oss”. Det är ett stort steg för den som bara vill veta mer. Ge besökaren något som kostar lite att säga ja till: en snabb prisuppskattning, en checklista eller en genomgång.

Det är därför vi erbjuder en kostnadsfri skiss till företag som funderar på en ny hemsida. Man ser hur det kan bli innan man bestämt sig för något.

Funktioner beskriver vad ni gör, fördelar beskriver vad kunden får. ”Molnbaserat bokningssystem” är en funktion. ”Kunderna bokar själva, även en söndagskväll” är en fördel. Börja med fördelen och låt funktionen bekräfta den.

Människor gör gärna som andra redan har gjort. Lägg omdömen, kundlogotyper och case nära knappen där beslutet tas, inte på en egen sida som ingen besöker. Ett omdöme med namn och företag väger i regel tyngre än ett anonymt ”Supernöjd!”.

Tre paket som ser likvärdiga ut gör att besökaren fastnar och jämför. Markera det ni rekommenderar och säg varför. (Det är inte samma sak som tipset om flera CTA-budskap ovan, där varje knapp passar en egen typ av besökare.)

Ta två knappar under samma formulär.

Knapp 1: ”Skicka”

Knapp 2: ”Få ett förslag på er nya hemsida”

Vilken hade ni klickat på, om resten av sidan var likadan? Jag hade valt alternativ 2, eftersom jag vet vad jag får.

Varje extra val är ett beslut till för besökaren. En meny med en lång rad punkter eller fem knappar i samma vy gör att många inte väljer något alls. Ta bort det som inte hjälper besökaren att ta nästa steg.

Varje fält i formuläret är en anledning att avbryta. Enligt Baymard Institute (2026) överger 70,2 procent varukorgen. Vanliga orsaker är krångliga kassor, krav på att skapa konto och kostnader som dyker upp först i sista steget.

Erbjud köp som gäst, fyll i det ni redan vet och fråga bara efter det ni behöver nu. Säljer ni tjänster gäller samma sak: namn och mejl räcker ofta för första kontakten. Samma knep gör susen på era landningssidor, där besökaren i regel kommer med ett enda syfte.

Psykologin bakom besökarens beslut handlar om att människor sällan väljer helt rationellt. Man tar genvägar, och en hemsida som är byggd efter dem hänger i regel ihop med fler avslut än en som bara listar fakta.

Tänk på att knepen nedan bara fungerar om de är sanna. Falsk brådska och påhittade lagersaldon märks, och då är förtroendet borta.

Människor vill vara konsekventa med det de redan har gjort. Har någon tagit ett litet steg är nästa steg lättare. Börja därför formuläret med en enkel fråga, till exempel klickbara val om vad besökaren behöver hjälp med, och be om kontaktuppgifterna först efter det. Den som redan valt ”Ny hemsida” har på sätt och vis redan sagt ja till att berätta mer.

Människor reagerar starkare på att förlora något än på att vinna något lika stort. Därför fungerar det att visa vad det kostar att inte agera. ”Få en snabbare kassa” är en vinst. ”Varje månad med en trög kassa är kunder som handlar hos någon annan” är en förlust, och den brukar fastna bättre. Överdriv bara inte, för skrämselpropaganda genomskådar man snabbt.

En verklig deadline ger besökaren ett skäl att bestämma sig nu i stället för ”någon gång”. Det kan vara en kampanj som slutar ett visst datum, en sista beställningstid för leverans dagen efter eller ett begränsat antal mötestider i en viss månad.

”Men en nedräkningsklocka ökar ju försäljningen.” Tyvärr fungerar inte webben så. Besökaren kommer tillbaka, ser att klockan har börjat om och då har ni lärt besökaren att inte lita på er.

Det som finns i begränsat antal upplevs som mer värt. Visa lagersaldot när det är lågt, antalet platser kvar på en utbildning eller hur många nya projekt ni tar in per kvartal.

Har ni lanserat och vill jobba löpande med att skapa en användarvänlig hemsida rekommenderar vi tre knep.

En mycket underskattad del av de flesta företag är att ta in ärlig feedback på hemsidan.

Pratar ni med ett par passande kandidater (inte för nära eller någon som redan vet vad ni gör) kan ni få många insikter om var i er webbdesign användarupplevelsen behöver bli bättre.

Ni behöver inte många. Enligt Jakob Nielsen och Tom Landauer (Nielsen Norman Group, 2000) räcker 5 testpersoner för att hitta cirka 85 procent av användbarhetsproblemen, förutsatt att de tillhör samma målgrupp och testar samma sak. Har ni flera målgrupper behöver ni några personer per grupp.

Vill ni mäta i stället för att hitta problem, exempelvis hur lång tid något tar, krävs enligt Nielsen Norman Group (2024) minst 20 till 30 deltagare.

Undvik att göra allt som personerna ni pratar med säger. Det tenderar att bli för spretigt. Men när fler än en säger samma sak bör ni sannolikt fixa det.

Google Analytics är ett gratis verktyg från Google. Det ger er aggregerad information som kan vara värdefull, exempelvis om en sida har låg engagemangsgrad eller kort engagemangstid.

Man ska alltid jobba med någorlunda säkerställd information. URLen ”maskerad-url-2” i bilden ovan har bara en användare, vilket självklart gör det omöjligt att dra några slutsatser. När det börjar bli en del besökare kan låg engagemangsgrad och kort engagemangstid vara ett tecken på att sidan fungerar dåligt för användarna.

Självklart kan det också bero på andra faktorer såsom innehållet. Se detta som en av många taktiker att hitta svaga sidor. Den fungerar extra bra med många besökare på stora hemsidor.

Det Google Analytics inte visar är hur trög sidan känns. Där är det INP i Googles fältdata ni ska titta på.

Det finns verktyg såsom Hotjar (finns en okej gratisvariant) och Microsoft har även en heatmap via Clarity.

Inspelningar där ni ser hur användare använder er hemsida kan ge er bra insikter när de inte förstår eller hittar rätt.

Heatmaps ger er användbar information om hur långt användare scrollar och var de klickar. Det kan ge er en snabb uppfattning om någon del av er navigering inte används särskilt mycket. I så fall kan ni prova att byta ut den mot andra länkar, vilket kan förbättra användarupplevelsen.

Tekniska och juridiska krav på en användarvänlig hemsida är i dag mer än goda råd, eftersom tillgänglighet i flera fall är lag även för privata företag. Sedan juni 2025 gäller lag (2023:254) om vissa produkters och tjänsters tillgänglighet, som bygger på EU:s tillgänglighetsdirektiv (European Accessibility Act, EAA).

Enligt lagen (SFS 2023:254, 4 §) omfattas bland annat e-handelstjänster och banktjänster till konsumenter. Undantagna är tjänster från mikroföretag, alltså företag med färre än 10 anställda och högst 2 miljoner euro i årsomsättning eller balansomslutning. PTS har tillsyn och har enligt PTS (2026) inlett tillsynsärenden mot minst 28 e-handelsaktörer. Brister kan leda till vitesföreläggande och sanktionsavgifter.

Säljer ni till konsumenter och inte är ett mikroföretag är tillgänglighet alltså inte längre något man gör när det finns tid över.

Nivån man i praktiken bygger efter är WCAG 2.2 AA, som den europeiska standarden EN 301 549 håller på att uppdateras mot. Ett av de nya kraven gäller hur stora knappar och länkar ska vara. Enligt W3C (2023) ska interaktiva klickytor vara minst 24 gånger 24 CSS-pixlar (kriterium 2.5.8).

Ett tillgänglighetsplugin som lägger sig ovanpå hemsidan låter som en genväg. Men det fixar inte koden under. I många fall krockar det dessutom med de hjälpmedel besökaren redan använder.

Så gör ni en första koll: Kör Lighthouse för att hitta de uppenbara felen. Tabba er sedan igenom hela hemsidan med tangentbordet. Fastnar ni någonstans gör era besökare det också.

Ja.

Användarsignaler har länge diskuterats som rankingfaktor och Google har lika länge förnekat det. Under en rättegång i USA 2023 kom det fram att de använder dem för att ranka hemsidor. Läs gärna inlägget om det här.

Google tjänar pengar på att folk fortsätter söka, och då vill de visa sidor där besökaren hittar det den letade efter.

Att ha en snygg hemsida med användarvänlig webbdesign är alltså inte bara bra för konverteringsfrekvensen utan även för er SEO. Läs gärna mer om konverteringsoptimering om ni vill gå djupare i den delen.

Utöver det spelar tekniska delar in, som Google PageSpeed, att hemsidan är mobilanpassad och att den inte har för många tekniska fel. Sedan Google bytte ut First Input Delay mot INP som Core Web Vital räknas också hur snabbt sidan svarar på klick.

En bra hemsida gör man genom att börja med vad besökaren ska göra, inte med designen. Bestäm vem den är för och vilket nästa steg ni vill att besökaren tar. Bygg sedan strukturen med kundens ord och testa på riktiga användare innan lansering.

Priset på en användarvänlig hemsida beror på hur många sidor och funktioner ni behöver, om design och text tas fram från grunden och vilka system den ska kopplas till. Det som brukar skilja mest är hur mycket tid som läggs på struktur, text och tester. Det är också där man oftast snålar in.

Användarvänliga hemsidor görs i regel av en webbyrå eller en frilansare med erfarenhet av både design, utveckling och konvertering. Be om exempel på hemsidor de byggt och hur de har mätt resultatet. Ställ också krav på WCAG 2.2 AA och att det kollas manuellt, inte bara med automatiska verktyg.

Man bör göra om hemsidan när den inte går att ändra utan stora ingrepp, när den fungerar dåligt i mobilen eller när den inte klarar tillgänglighetskraven. Har ni trafik men få leads är det ofta mer lönsamt att börja med budskap, knappar och formulär innan ni bygger nytt.

UX (user experience) är hela upplevelsen av att använda hemsidan, från att hitta rätt till att skicka formuläret. UI (user interface) är det man ser och klickar på, som knappar, menyer, färger och typsnitt. En snygg UI hjälper inte om UX:en är krånglig.

Att ha en användarvänlig hemsida är viktigt för både avslutningsfrekvensen och er SEO.

Vår erfarenhet är att hemsidan brukar underskattas. Har ni redan trafik är den ändå ett av de snabbaste sätten att öka försäljningen, och effekten syns i alla era kanaler. En användarvänlig hemsida hänger samman med bättre placeringar i Google och går i regel hand i hand med lägre CPA (Cost Per Acquisition) i betald annonsering.

Vi är en webbyrå i Malmö, och vårt bästa upplägg är en skräddarsydd hemsida i WordPress som säljer bra och ger er mer trafik från Google. Vi jobbar självklart med företag i hela Sverige.

Antingen gör ni det själva med tipsen ovan eller så får ni gärna be om en kostnadsfri skiss och boka ett möte med mig (Nils) digitalt eller fysiskt.