onhdesign Komplett guide: Så lyckas du med bilder på din hemsida
top of page

Komplett guide: Så lyckas du med bilder på din hemsida


En bild säger mer än tusen ord, och så är fallet även på internet. Så mycket som 90% av den information som överförs till hjärnan är visuell. Bilderna du väljer till din hemsida har därför en enorm påverkan på besökarens första intryck. Med rätt bilder kan du förhöja användarupplevelsen, förbättra sidans sökmotorsoptimering och i slutändan konvertera fler besökare till kunder. Den här guiden går igenom vad du ska göra för att lyckas med att välja rätt bilder till din hemsida.



Fotografen bläddrar mellan olika versioner av sin bild.


Vikten av att välja rätt bilder


Så varför är bilder så viktiga? Låt oss gå igenom de viktigaste punkterna.


Bättre användarupplevelse

Rätt bilder har förmågan att omedelbart fånga besökarens intresse. De kan även förmedla mer komplexa budskap på ett snabbt och enkelt sätt. Se till att de bilder du publicerar på sidan hjälper användaren att uppnå något, som att bättre förstå en process, en produkt eller en viss information.


Bättre SEO

Bildsökningar är väldigt viktiga för trafiken till din sida. När du väljer en bild som matchar med en text så förbättras hemsidans resultat hos sökmotorerna. Glöm inte att lägga till metadata och alt-attribut (mer om detta längre ner) för alla bilder på sidan, det underlättar för sökmotorerna att hitta och relatera din bild till informationen.


Det förlänger den tid användarna spenderar på hemsidan

Detta är både bra för sidans SEO-ranking och en bra indikator på högt engagemang bland besökarna.



Bättre räckvidd på sociala medier

Bilder gör att dina inlägg i sociala medier får bättre spridning. Det är mer delningsvänligt och väcker mer engagemang bland användarna.



Enkla tips på hur du snabbt kan förbättra hemsidans bilder


Använd alltid bilder med god kvalitet


Gryniga och dåligt reproducerade bilder på en småföretagares hemsida kan vara direkt avskräckande för en potentiell kund. Bilderna ska hålla god kvalitet, men se till att filerna inte är för stora.


Publicera inte större bilder än nödvändigt och optimera filstorleken vid behov. Att minska storleken på bilden utan att avsevärt försämra bildens kvalité är ett bra sätt att optimera sidan. Mindre filer leder till snabbare laddningstid, vilket innebär bättre användarupplevelse och förbättrad SEO.



Håll bildsättningen konsistent


Se till att hemsidans bilder håller en röd tråd, tillsammans med övrig stil, layout och färgsättning. Bilder med helt olika uttryck gör att sidan kan uppfattas som oorganiserad och spretig. En välplanerad och konsistent bildsättning gör istället hemsidan mer attraktiv för besökare och uppmuntrar dem till att surfa vidare.


Visa riktiga människor


Att välja bilder som inkluderar människor på ett bra sätt förbättrar besökarens upplevelse och är effektivt för att skapa engagemang. Var dock fortfarande noga med att bilderna är autentiska och visar människor som matchar med hemsidans eller företagets karaktär. Försök att undvika stock-foton och använd riktiga människor när det är möjligt.


Eftersträva bilder som representerar genuina historier. Fånga människor som gör intressanta saker. Om du exempelvis säljer en produkt, visa då hur personen på bilden interagerar med produkten.



Försök att använda unika bilder


Det är en klar fördel ifall du har unika bilder av hög kvalitet. Dagens prestanda på digitalkameror och mobilkameror gör att alla har goda förutsättningar för att lyckas knäppa en bra och unik bild, så gör ett försök! Om inte kanske det är värt att investera i en professionell fotograf för en dag?


Det kan vara lockande att bara använda stock-foton för hemsidan då det med ett par klick går att hitta bilder av hög kvalitet. Detta behöver inte vara en dålig lösning men överväg alternativ först. Om du dock bestämmer dig för att använda ett stock-foto så välj inte från den första sidan av bilder som visar sig på skärmen utan scrolla en bit ner. Chanserna är då större att du hittar något som inte är lika flitigt använt. På många plattformar kan du också se hur många gånger en bild har blivit nerladdad, vilket hjälper dig att välja något lite mer unikt. Var också noga med vilken licensieringstyp som följer med bilden när du köper stock-foton, eftersom det kan variera från fall till fall.


Optimera för SEO


Vi har redan varit inne på att bilder är viktiga för sidans SEO. Oavsett vilken verksamhet företaget bedriver så är det därför ett måste att optimera sidas bilder för sökmotorerna.


1. Justera url och filnamn för att underlätta sökmotorernas uppgift. Ett filnamn som "IMG_001" gör inte livet lätt för en sökmotor som ska indexera relevanta bilder. Det är som att beställa en bit mat från en meny som är på ett annat språk. Döp heller inte en bild på en produkt till "katt" utan försök att beskriva bilden mer, t.ex. "en katt sover på en filt" Se också till att filnamnet innehåller det sökord som du optimerar för.


Google guidelines säger inte explicit att filnamnet är en rankande faktor, men säger att:

“Likewise, the filename can give Google clues about the subject matter of the image.

For example, my-new-black-kitten.jpg is better than IMG00023.JPG."


Det kanske dock inte är värt att spendera timmar på att döpa om existerande bilder som redan är indexerade, utan fokusera i första hand på att applicera denna teknik på nytt material.


2. Skriv ett passande alt-attribut. Beskriv kort vad bilden innehåller genom att skriva en mening om ca. 3-7 ord. Se också till att alt-attributet finns med i någon grammatisk form. Se till att texten är naturlig och deskriptiv. Den behöver inte innehålla ord som "foto" eller "bild".



Välj rätt filformat


Det finns en mängd olika filformat att välja mellan så det är lätt att bli förvirrad. Vad ska man välja av typer som JPG, GIF, SVG, PNG osv? En enkel tumregel brukade vara att välja JPG för bilder och PNG för grafik. JPG är bra på att hantera färger i en bild, samtidigt som filstorleken hålls nere. PNG håller högre kvalité men tar också större plats. Det brukar dock användas för medier som infografik, texttunga bilder och logotyper. En fördel är att PNG stödjer transparent bakgrund, något som kan vara eftersträvansvärt när företagets logotyp ska presenteras.


Men! Det finns ett annat och kanske mer okänt alternativ, nämligen Google-utvecklade formatet WebP. Det tar väldigt liten plats och stödjer både bilder med och utan transparent bakgrund.


Behöver du hjälp med din hemsida? Se våra priser eller kontakta oss idag!

bottom of page