Fremskynde WordPress - Hvordan lagre bilder optimalisert for web

Lagrer du bilder feil? De fleste nybegynnere vet ikke hvordan å lagre bilder på riktig måte som kan ha stor innvirkning på nettsidenes hastighet. I denne artikkelen vil vi vise deg hvordan du skikkelig lagrer bilder som er optimalisert for web.

Hver bloggingekspert vil fortelle deg at bildene bidrar til å øke engasjementet. Men det de ikke forteller deg, er at ikke optimalisere bilder for web kan senke nettstedet ditt. Ifølge Strangeloop kan en forsinkelse på en sekund koste deg 7% av salget, 11% færre sidevisninger og 16% reduksjon i kundetilfredshet.

Videoopplæring

Hvis du ikke liker videoen eller trenger mer instruksjoner, fortsett å lese.

Hvordan lagre bilder riktig?

Når du lagrer bilder, må du vurdere to ting: bildefilformat, og kompresjon. Ved å velge riktig kombinasjon, kan du redusere bildestørrelsen med 5x.

For de fleste av oss er de eneste to bildformatene som betyr noe, JPEG og PNG. For å holde det enkelt, bruk JPEG for bilder eller bilder med mye farge, og bruk PNG for enklere bilder eller når du trenger transparente bilder.

For de som ikke vet forskjellen, er PNG-bildeformat ukomprimert, noe som betyr at det er et høyere kvalitetsbilde. Ulempen er at filstørrelsen er mye større. På den annen side er JPEG et komprimert filformat som noe reduserer bildekvaliteten for å gi en betydelig mindre filstørrelse.

På WPBeginner er de fleste av bildene JPEG.

Den neste tingen er komprimering, som betyr å bruke et verktøy for å lagre bilder optimalisert for web. Kompresjon kan gjøre en stor forskjell.

Se tabellen under som fremhever de få kombinasjonene vi kunne ha brukt til å lagre Strangeloop-bildet som brukes i denne artikkelen.

Image Compression Tools for Bloggere

Nå som du har sett forskjellen som hver komprimeringstype gjør, er det nedenfor hvordan du kan lagre bilder som er optimalisert for web og lagre webområdet ditt på riktig måte..

Adobe Photoshop

Adobe Photoshop er en premium programvare som leveres med en funksjon for å lagre bilder optimalisert for web. Bare åpne bildet ditt og klikk på Fil> Lagre for web og enheter.

Dette åpner en lagringsskjerm. Til høyre kan du angi forskjellige bildeformater. For JPEG-format, vil du se forskjellige kvalitetsalternativer. Når du velger alternativene, vil det også vise deg filstørrelsen nederst til høyre.

Merk: Vi forstår at Photoshop er ganske dyrt. GIMP er et gratis alternativ som brukerne kan bruke. Andre Adobe-produkter som fyrverkeri kan gjøre jobben også.

TinyPNG

TinyPNG er en gratis webapp som bruker smart lossy komprimeringsteknikk for å redusere størrelsen på PNG-filene dine. Alt du trenger å gjøre er å gå til deres nettside og laste opp bildene dine. De vil komprimere bildet, og gi deg nedlastingskoblingen.

For utviklere har de også en API for å konvertere bilder automatisk.

JPEG Mini

JPEGmini bruker en rekomprimeringsteknologi som reduserer størrelsen på bildene betydelig uten å påvirke deres perceptuelle kvalitet. Du kan bruke webversjonen gratis, eller kjøpe programmet til datamaskinen. De har også en betalt API for å automatisere prosessen for serveren din.

ImageOptim

ImageOptim er et Mac-verktøy som lar deg komprimere bilder uten å miste kvalitet ved å finne de beste komprimeringsparametrene og fjerne unødvendige fargeprofiler.

Windows alternativ til dette er Trimage.

Som du kan se at det finnes flere verktøy du kan bruke til å optimalisere bilder for web. Ved bruk av Photoshop-komprimering så vi de beste resultatene i størrelse, men kvaliteten ble påvirket. TinyPNG var en klar vinner for å lagre alle typer PNG på nettet.

Noen antyder at du kan bruke en kombinasjon av TinyPNG eller JPEG Mini og Image Optim for enda bedre resultater. Men å kjøre to separate verktøy for å laste opp bilder kan øke arbeidsbelastningen litt.

Endelige tanker om bildeoptimalisering

Hvis du ikke lagrer bilder som er optimalisert for web, så begynn å gjøre det nå. Det kan gjøre en stor forskjell på webområdet ditt, og brukerne vil takke deg for det. Sikker på at bildekvaliteten kan falle litt, men de fleste brukere vil ikke legge merke til det.

Hvis du er på utkikk etter kvalitetsbilder, kan du se vår guide for hvordan du finner gratis bilder for blogginnleggene dine.

Sist men absolutt ikke minst, ved å bruke en CDN til å vise bilder til ditt WordPress-nettsted, kan du øke hastigheten på nettstedet ditt. Sjekk ut dette infografiske for å se hva som er en CDN, og bruk vår guide for hvordan du konfigurerer CDN for nettstedet ditt. Vi bruker MaxCDN til nettstedet vårt.

Vi håper du fant denne artikkelen nyttig.

Har du blogger venner som lagrer bilder feil? Del denne artikkelen med dem, slik at de kan øke hastigheten på nettstedet deres. De vil takke for det.

Hvis du har spørsmål, vennligst legg igjen en kommentar nedenfor. Ikke glem å følge oss på Twitter og Google+