Hva er responsivt design?
En responsiv nettside 'flyter' etter skjermstørrelsen: på en bred PC-skjerm vises kanskje tre kolonner side om side, på mobil stables de under hverandre, menyen blir til et ikon, og knappene blir store nok for tommelen. Teknisk løses dette med fleksible rutenett og såkalte breakpoints: terskler der layouten endrer seg. Poenget er at innholdet alltid er lesbart og klikkbart uten at brukeren må zoome eller scrolle sidelengs.
Alternativene (en egen m.-mobilside eller en stiv PC-side som krympes ned) er i praksis døde. Alle moderne verktøy og publiseringsløsninger lager responsive sider som standard, men eldre nettsider fra før cirka 2015 kan fortsatt mangle det.
Hvorfor mobil kommer først
I Norge kommer typisk 60–70 prosent av trafikken til lokale bedrifter fra mobil, og for søk som haster ('tannlege åpen nå', 'elektriker akutt') er andelen enda høyere. Kunden som trenger deg mest, finner deg på mobilen. Derfor designes moderne nettsider 'mobil først': mobilversjonen er hovedproduktet, og PC-versjonen er utvidelsen, ikke omvendt.
Mobilbrukere er også mer utålmodige. Store trykkflater, kort vei til telefonnummeret og rask sidehastighet betyr mer for konverteringsraten på mobil enn noe annet designvalg.
Googles mobile-first-indeksering
Siden 2019 har Google brukt mobilversjonen av nettsiden din som grunnlag for rangeringen, såkalt mobile-first-indeksering. Det betyr at hvis innhold er skjult eller ødelagt på mobil, teller det ikke, uansett hvor bra PC-versjonen er. Mobilvennlighet og opplevelsessignalene i Core Web Vitals inngår i vurderingen, så en dårlig mobilside svekker hele SEO-arbeidet ditt. God mobilopplevelse er rett og slett god synlighet.
Konkret eksempel
En byggmester i Orkanger hadde en ti år gammel nettside som så grei ut på kontor-PC-en, men på mobil måtte man zoome for å lese, og telefonnummeret var et bilde man ikke kunne trykke på. Av 900 månedlige besøk kom 600 fra mobil, og nesten ingen av dem tok kontakt. Etter overgang til en responsiv side med klikkbart nummer og et kort skjema gikk mobilhenvendelsene fra 2–3 til 14 i måneden. Med snittprosjekter på 60 000 kr trengte bare én ekstra jobb i kvartalet å komme derfra for å forsvare hele investeringen.
Slik sjekker du din egen side
- Åpne siden på din egen mobil: kan du lese alt uten å zoome, og treffer du knappene med tommelen?
- Er telefonnummeret klikkbart, og er hovedknappen synlig uten å scrolle?
- Test i Googles PageSpeed Insights. Verktøyet viser både hastighet og mobilproblemer.
- Prøv skjemaet på mobil fra start til slutt. Fungerer det dårlig for deg, fungerer det dårlig for kundene.
- Sjekk siden på både en liten og en stor mobilskjerm. Layoutfeil dukker ofte opp i ytterpunktene.
Vanlige feil
- Sider som teknisk sett er responsive, men designet kun med PC i tankene: seks-ords overskrifter som brekker stygt, tabeller som sprenger skjermen og knapper på 20 piksler.
- Popup-er som dekker hele mobilskjermen og er umulige å lukke, irriterende for brukere og straffet av Google.
- Tunge bilder som gjør mobilopplevelsen treg selv om layouten er riktig. Responsivt design uten fart er bare halve jobben, og en del av en god brukeropplevelse totalt sett.
