Hur mobilvänlig är din blogg?

december 05, 2016

Det blir allt viktigare att ha en webbplats som fungerar i mobilen. Dels blir det lättare för besökaren, dels kommer det att vara en mycket viktig faktor för hur din webbplats rankas i Googles sökresultat i framtiden. Har du funderat på denna fråga?


Mobilvänlig webbplats
Image: FirmBee (CC0 Public domain)

Redan i februari 2015 meddelade Google att man i sina sökresultat kommer att börja ta mer hänsyn till om webbplatsen är mobiloptimerad eller inte. Under samma vår konstaterades det att antalet sökningar via mobila enheter hade gått förbi antalet sökningar via dator.

Nyligen, i början av november 2016, lanserade Google sitt 'mobile first index' som innebär att man nu kommer att indexera webbplatser enligt hur de uppfattas av en mobil enhet. Småningom kommer detta index att köras fullt ut.

Vad innebär mobilvänlig, egentligen?


Det finns flera faktorer som tillsammans avgör hur mobilvänlig en webbplats är. Dels hur sidan ser ut i mobilen, dels hur snabbt sidan laddar, Det finns ännu fler faktorer, men dessa är de som jag nu tänkte ta upp.

Börjar vi med utseendet så betyder det att sidan ska gå att läsa i mobilen. Har du nån gång besökt en hemsida som inte är mobilvänlig så vet du vad jag menar. Texten är för liten för att den ska kunna läsas. Man får förstora på skärmen (ibland går inte ens det!) och scrolla sidledes. Ibland finns det många länkar placerade intill varandra och då är det lätt att trycka fel med fingret. Inte så roligt.

Responsiv design


Jag rekommenderar att man använder sig av responsiv design. Det innebär att sidan anpassar sig till den skärm som den visas på. Lättast kontrollerar man detta genom att dra och ändra storlek på webbläsarfönstret, möbleras innehållet om när fönstret blir smalare, är webbplatsen responsiv.

Texten är tillräckligt stor för att kunna läsas, menyerna finns ofta gömda bakom en knapp istället för att ta upp utrymme på skärmen, och innehållet är det samma oberoende av ifall du läser sidan på datorn eller i mobilen.

Eftersom mobilskärmen är så mycket mindre än en datorskärm, behöver man också tänka på att det väsentliga innehållet kommer högt upp på sidan.

Snabbhet och laddningstid


Förutom hur det rent konkret ser ut, är även snabbhet en faktor. Ofta har man en långsammare uppkoppling i telefonen jämfört med den man har i datorn. Visste du att de flesta ger en webbplats tre sekunder att ladda klart, innan de tröttnar? Efter detta kommer hälften av besökarna att försvinna från sajten.

Tre sekunder är oerhört kort tid, samtidigt som det känns som en evighet när man är otålig. Det finns många sätt att påverka sidans laddningstid, det som är lättåtgärdat ur bloggsynpunkt är att satsa på bildförminskning. Jag förklarar närmare här nedanför.

Optimera bilder för webben

Har man en långsam uppkoppling kommer det att ta evigheter att ladda en sida med många bilder med stor filstorlek. Därför bör man försöka se till att filstorleken blir så liten som möjligt. Observera att jag använder benämningen filstorlek, för detta har ganska lite med själva bildstorleken att göra - alltså hur stor bilden ser ut på skärmen.

Jag rekommenderar att du först kontrollerar hur stora bilderna kommer att vara på sidan. Exempelvis är bredden för mina blogginlägg max 675 pixlar på datorskärmen. Därför förminskar jag alltid bilderna till den storleken (eller OK, 680), eftersom allt utöver detta är "onödigt".

Upplösningen påverkar också filstorleken. Det finns en gammal myt om att en webb-bild ska vara 72 dpi, men i praktiken saknar detta betydelse rent "visningsmässigt" eftersom dpi anger information till skrivare, inte skärmar. Men rent praktiskt kommer filstorleken, alltså antal kilobyte (eller megabyte), att minska i takt med minskat antal dpi. Så du kan alltså skruva ner detta (en jpg-bild direkt ur systemkameran har troligtvis upplösningen 300 dpi) utan att det påverkar bilden på datorskärmen nämnvärt mycket.

Hur stor får en bild vara då? Jag säger max 150 kb, gärna så litet som 100 kb, om möjligt. Prova t.ex. att ladda ner Riot och se hur mycket det går att förminska en bild innan den förlorar kvalitet. Alternativ i mobilen är t.ex. appen Minska bilder.

Kontrollera din sidas användarvänlighet


Vill du kolla hur din sida "mår"? Här kan du testa din sidas mobilvänlighet via Googles eget verktyg.

Denna blogg verkar klara sig hyfsat bra. Jag får ett bra betyg för mobilvänlighet och för laddningstid via dator, men laddningstiden för mobila enheter kunde förbättras, även om det inte är riktigt uselt:

Mobilvänlig webbplats - Kajsa Snickars

Vilka poäng får din blogg? Är detta något du tänkt på?

You Might Also Like

0 kommentarer