Har du någon gång undrat varför ser din webbplats annorlunda ut beroende på vilken enhet du använder?
Det är s.k. mobilanpassad eller responsive webbdesign. Responsiv webbdesign är en strategi där utvecklare skapar en webbsida som ändrar storlek beroende på vilken typ av enhet visas på. Det kan vara en stor stationär datorskärm, en bärbar dator eller enheter med små skärmar som mobiler och surfplattor.
Responsiv webbdesign har blivit ett viktigt verktyg för alla med digital närvaro. Med tillväxten av mobiler, surfplattor och andra mobila datorenheter använder fler människor mindre skärmar för att se webbsidor.
Från och med mars 2018 har Google påbörjat sin indexering av mobilen först så det blev ännu viktigare att ha sin webbplats mobilanpassad.
Skillnad på ”fast” och responsiv design
Om vi tittar till exempel på en ”fast” designat webbplats på stationär dator kan webbplatsen visa tre kolumner, men när du visar samma layout på en mindre surfplatta kan det tvinga dig att rulla horisontellt, för att vissa alla tre kolumner, något som användare inte gillar eller så kan objekt på sidan vara dolda eller se förvrängda ut.
På en liten mobilskärm kan webbplatser bli ännu mer utmanande att se. Stora bilder kan ”bryta” layouten och webbplatser kan vara långsamma att ladda på mobiler om de är grafiska tunga.
Men om en webbplats använder responsiv design kan surfplattans version automatiskt anpassas för att bara visa två kolumner. På så sätt är innehållet läsbart och lätt att navigera. På en mobil kan innehållet visas som en enda kolumn, kanske staplad vertikalt. Bilder kommer att ändra storlek istället för att ”förstöra” layouten eller bli avstängda.
Så hela poängen med responsiv design är att den anpassas webbplatsen automatiskt baserat på den enhet som tittaren ser den i.
Är min webbplats responsive och mobilanpassad?
Du kan snabbt se om en webbplats är mobilanpassad eller inte i din webbläsare.
- Öppna Google Chrome
- Gå till din webbplats
- Tryck på Ctrl + Shift + I för att öppna Chrome DevTools
- Tryck på Ctrl + Shift + M för att växla enhetens verktygsfält
- Visa din sida från ett mobilt, surfplatta eller skrivbordsperspektiv
Du kan också använda ett gratis verktyg, Googles mobilvänliga test, för att se om sidor på din webbplats är mobilvänliga.