Läs mer om hur du optimerar dina bilder till din hemsida
Generellt sett är så liten filstorlek som möjligt att föredra på alla bilder. Dock ska kvalitet ändå hållas, för att undvika att bilderna upplevs som pixliga.
Bilder som kräver högre upplösning (helbreddsbilder, läs mer under ”upplösning”) kan tillåtas vara aningen större filmässigt än övriga bilder.
Att sträva efter:
- Försök att hålla samtliga bildfiler under max 250kb.
- Mindre bilder som upptar mindre än halvskärm bör kunna ligga runt max 150kb.
Generellt sett är det bra med så låg upplösning på bilder som möjligt på hemsidan, men ändå tillräckligt hög för att bilden skall se bra ut (Ingen gillar ju pixliga bilder).
Vad är då tillräcklig upplösning?
- Om bilden skall uppta hela hemsidans bredd kan det vara bra om bilden ligger runt 2000px i bredd.
- Om bilden skall uppta halva skärmens bredd räcker det generellt sett med 1000px i bredd.
- Övriga bilder, produktbilder etc. kan generellt sett sättas till mellan 800-1000px.
Skillnad på upplösning, beroende på bildformat?
- Värt att nämna: om bilden är en PNG, är den generellt sett större i filstorlek.
- Fråga dig själv: Måste bilden vara PNG? (Läs mer under bildformat).
- Om JA, skala ner bilden så mycket som det går i upplösning, så att du tycker att bilden fortfarande kan utföra sitt ”jobb” på hemsidan.
Om du har tillgång till t.ex. Photoshop så rekommenderar vi att du sparar dina bilder i maximalt 96dpi och minimalt 72dpi.
Detta optimerer storleken på dina bilder ytterligare utan att du tappar nämnvärd synlig kvalité.
Det finns ett flertal olika bildformat att välja på där ute.
Två av de vanligaste bildformaten är .jpg och .png.
Om möjligt, UNDVIK PNG, använd JPG. Läs mer nedan.
Dessa format har lite olika egenskaper.
JPG:
- Kanske det vanligaste filformatet.
- Går generellt sett att få ner till små filstorlekar även vid lite större upplösning.
- Använd generellt hellre JPG än PNG.
PNG – Transparent bakgrund:
- PNG tar med transparens i bilder. På en frilagd bild, utan bakgrund, tillåter PNG-formatet att bakgrunden är transparent.
- Detta betyder inte att alla PNG-bilder automatiskt har transparent bakgrund – Detta måste utföras i t.ex. Adobe Photoshop.
- Filer som kan vara lämpliga att ladda upp i PNG:
- Bilder som behöver transparent bakgrund för att de ska ligga mot en färgad bakgrund på hemsidan.
- Hemsidans logotyp samt ev. övriga logotyper som skall ligga på hemsidan.
- PNG genererar generellt sett större filstorlek på bilden. Om det inte är nödvändigt att bilden är PNG (Ex. att den inte har en transparent bakgrund) är det bättre att göra om bilden till JPG.
Undvik stora bokstäver, åäö samt mellanslag i dina bildnamn.
Döp inte en fil såhär:
Smör Pop.jpg
Döp den så här:
smor-pop.jpg
Alt-attribut är textalternativet till dina bilder, som visas när en webbläsare inte kan visa bilden. Bildens altattribut är också det som ses om du för muspekaren över en bild.
Alt-attributen bidrar till en sidas sökmotoroptimering och användningen av rätt nyckelord i denna beskrivning kan därför bidra till en högre ranking på sökmotorerna. Om du har en e-handel, är det troligtvis bästa sättet för dina produkter att synas i sökresultat.
Obs! Om du är osäker på hur du ska göra med alt-optimering, ta kontakt med oss på Dalarna Digital.
Nedan följer några enkla regler för bildoptimering genom alt-text:
- Proppa inte dina alt-attribut med massa nyckelord, ex om du säljer en rosa tröja som i exemplet ovan, skriv inte: ”gul tröja sommar func rea”.
- Använd inte alt-attribut för dekorativa bilder, sökmotorer kan straffa dig om du försöker optimera för mycket.
- Beskriv din produkt i enkelt språk, precis som med filnamnet.
- Om du säljer olika variationer av en produkt, ex gul tröja och grön tröja – skriva gul och grön för respektive bild.