Blogg/ Bild
Bild · Praktisk guide

Bildkomprimering för webbplatser: mindre vikt utan att offra fotot

Välj upplösning, kvalitet och bildformat för att minska storleken på foton på webbsidor utan att text och kanter suddas ut.

SättaFabiano Freitas· · 2 min läsning
Redaktionell illustration av bildkomprimering för webbplatser: mindre vikt utan att offra fotot
FileBito redaktionell illustration

En receptsida tar tid att öppna eftersom varje bild skickades direkt från kameran och väger flera megabyte. Läsaren behöver bara se maten tydligt i mobilens bredd. Att minska filvikten kan förändra upplevelsen, så länge som komprimeringen görs med kriterier.

Mått kommer före kvalitetsprocent

Om bilden upptar 800 pixlar på sidan finns det ingen anledning att alltid publicera versionen med 6000 pixlar. Ändring av storlek först minskar ofta kvaliteten mer än aggressiv åtdragning. AnvändaKomprimera bildenatt prova och observera både dimensionen och slutvikten.

JPEG och WebP fungerar bra på fotografier; PNG tenderar att vara mer meningsfullt i grafik eller bilder med transparens. Valet beror på innehållet och kompatibiliteten som krävs. En bild med små siffror kan se dålig ut vid acceptabla komprimeringsnivåer för landskap.

Testet ska ske där bilden visas

Tre steg till bildkomprimering för webbplatser: mindre vikt utan att offra fotot
Steg och uppmärksamhetspunkter för att granska denna typ av fil.

Jämför original och komprimerat i full storlek på sidan, på ljusa och mörka skärmar där det är relevant. Se ansikten, produktkanter, övertoningar och infogade bokstäver. De vanligaste defekterna är synliga block, dubbla konturer och fläckar i enhetliga områden.

Namn, versioner och ansvar

Anta beskrivande filnamn, som t.exkaka-choklad-skiva.webp, och alternativ text som beskriver innehållet för de som inte kan se bilden. Bevara originalversionen i ditt bibliotek. Om du publicerar många bilder, standardisera bredder och jämför laddning på en långsam anslutning. Att komprimera väl är att hitta den minsta versionen som förblir trevlig och begriplig.

Sidvikten är summan av bilderna

Ett foto reducerat från 3 MB till 280 KB innebär viktiga besparingar, men ett galleri med tjugo bilder av denna storlek kräver fortfarande flera megabyte. Titta på uppsättningen: omslagsstorlek, miniatyrer, artikelbilder och version för större skärmar. Att lägga upp samma enorma foto i varje utrymme slösar besöksdata. När plattformen stöder responsiva bilder, tillhandahåll versioner som är proportionella mot skärmstorleken.

Undvik också på varandra följande komprimeringar under hela redigeringen. Om någon sparar en redan reducerad JPEG och nästa redigerare komprimerar den igen, ackumuleras förlusten. Behåll en kvalitetskopia av originalfotot, med ett namn och en organisation som gör att du kan hitta det månader senare. På så sätt kan du generera nya storlekar när layouten ändras, utan att vara beroende av filer som redan har förlorat detaljer.

Läs också

Teknisk referens: bildformat, komprimering och transparens (MDN).

Foto av Fabiano Freitas
Om Fabiano Freitas

Fabiano Freitas har en examen i Information Technology Management och skriver om teknik tillämpad i vardagen, digitala verktyg och produktivitet. På FileBito publicerar den praktisk vägledning om PDF, bilder, data och konverteringar, med uppmärksamhet på integritet, filkvalitet och kontroll av resultat.

← Se alla artiklar