Sådan optimeres WordPress-billeder og gør dit websted hurtigere

Hvis du vil give din besøgende en god brugeroplevelse, skal du sikre dig, at dit websted indlæses hurtigere, så det ikke frustrerer dem. Faktisk kan hastigheden på dit websted gøre eller ødelægge din online forretning. Du SKAL optimere WordPress-billeder for at gøre dit websted hurtigere - fordi billeder normalt er den tungeste del af dit indhold,

Walmart har fundet en 2% stigning i deres konverteringsfrekvens hver gang de forbedrede hastigheden med 1 sekund.

og Amazon fandt en stigning i omsætningen med 1% for hver 100 millisekunder forbedring af deres webstedshastighed. Disse statistikker viser, at det er afgørende for dit websted at gøre dit websted hurtigt. En nem måde at gøre dit websted hurtigere på er ved at optimere alle billederne på dit WordPress-websted.

Indhold[show]
 

optimere wordpress-billeder til forbedrede konverteringsfrekvenser

Hvis du endnu ikke har betragtet hastigheden på dit WordPress-websted som en kritisk komponent i din virksomhed, bliver du nødt til at tænke igen og begynde at træffe foranstaltninger til at forbedre hastigheden på dit WordPress-websted.

Anbefal læsning: Sådan får du et hurtigt WordPress-websted - en komplet guide [25 handlinger]

Der er mange måder at gøre dit websted hurtigere. Nogle af dem er angivet nedenfor.

  • Undgå at bruge for mange WordPress-plugins
  • Brug WordPress CDN-tjenester
  • Optimer CSS-levering
  • Optimer WordPress-billeder

Billeder, der ikke er optimeret til internettet, er typisk store. Disse billeder tager længere tid at indlæse. Det er vigtigt, at du optimerer dine billeder ved at gøre dem så små som muligt. Imidlertid er processen med at optimere billeder til WordPress og dit websted kedelig eller kommer i vejen for at producere indhold.

I dette indlæg forklarer vi forskellige måder at optimere dine WordPress-billeder på og dermed få dit websted til at indlæse hurtigere.

Komprimer billeder, eller gem dem på nettet

Det er en no-brainer, at størrelsen på dit billede kan påvirke indlæsningstiden på dit WordPress-websted. Da billeder i høj opløsning har en større filstørrelse, er det altid bedre at komprimere billederne før upload.

Nu har du muligvis et spørgsmål: hvad er WordPress-billedkomprimering, og hvordan kan det reducere størrelsen uden at påvirke kvaliteten?

Kompression er processen med dramatisk at formindske billedstørrelse ved algoritmisk at fjerne billedinformation, som et menneskeligt øje ikke kan opfatte. Dette er en meget effektiv måde at optimere WordPress-billeder på.

Skønt billedkomprimering er en sikker brand-metode til at reducere billedstørrelsen, når det kommer til komprimering af JPEG-filer, mister processen undertiden det faktiske indhold af billederne under processen. Dette er den eneste ulempe ved denne tilgang. Husk at kontrollere resultaterne efter komprimering nøje for at sikre, at du er tilfreds med resultaterne af komprimering.

WP Smush er et populært WordPress-plugin, der giver dig mulighed for nemt at reducere billedfilstørrelsen ved at scanne hvert billede, du uploader, og fjerne unødvendige dataoplysninger. Den gratis version af dette plugin giver dig mulighed for at komprimere billeder op til 1 MB i størrelse, mens du med pro-versionen kan komprimere billeder op til 32 MB.

Du kan downloade WP Smush her.

wp smush for at optimere wordpress-billeder

Bemærk også, at dette plugin giver dig mulighed for at optimere alle de nyligt uploadede billeder til dit WordPress-websted. Hvis du vil komprimere de eksisterende billeder, kan du bruge linket Bulk Smush.it under fanen mediebibliotek til at optimere eksisterende WordPress-billeder.

Lazy loading: Optimer indlæsningstiden for WordPress-billeder

[OPDATER: WordPress 5.4 har doven indlæsning indbygget i kernen, så du behøver kun at udføre denne handling, hvis din WordPress-version er under denne version]

Vi ved alle, at "Et billede er tusind ord værd".

Men at bruge for mange billeder på en enkelt side kan gøre, at dit websted indlæses langsommere.

En nem måde at forbedre din indlæsningstid på er at fjerne unødvendige billeder og kun beholde det, der er absolut nødvendigt. Imidlertid ønsker ikke alle at reducere antallet af billeder, der bruges på en webside, kun for at få siden til at indlæse hurtigere.

Hvordan kan dette problem løses?

Du har måske allerede bemærket det - websteder, der bruger mange billeder på hver side, løser dette problem ved kun at lade billedet indlæses, når det er synligt for brugeren. Denne taktik reducerer ikke kun sidens indlæsningstid, men det sparer også serverbåndbredde. Dette kaldes doven belastning. Fordi billedet er "doven", kommer det kun op, når det er nødvendigt.

Hvis du bruger WordPress, er det lettere at lade billedet kun indlæses, når det er synligt. Alt du skal gøre er at installere et Lazy load plugin. Endnu en gang er dette en glimrende måde at optimere WordPress-billeder til bedre hastighed.

Du kan hente den Lazy load plugin her.

Optimer wordpress-billeder med doven belastning

Dette plugin behøver ingen yderligere konfiguration, da det fungerer out-of-the-box efter installation og aktivering.

Læs mere: Divi vs Elementor

Brug det optimerede og korrekte billedformat

JPEG, PNG og GIF er de mest populære billedformater.

At kende forskellene mellem hvert billedformat giver dig mulighed for at bruge det rigtige format på dit websted, hvilket endda hjælper dig, når det kommer til billedoptimering.

Hvilket format er bedre for optimerede WordPress-webstedsbilleder, og hvornår skal du bruge det? Nedenfor er et par tip:

  • GIF: Brug GIF, når dit billede er for lille og bruger relativt less antal farver. For eksempel er GIF et godt valg til clipart, kugler og diagrammer. På den anden side kunne komplekse billeder med forbedringer som faldskygger ikke vises korrekt ved hjælp af GIF.
  • JPEG / JPG: Det er velegnet til komplekse billeder med mange farvevariationer, eller hvis det indeholder fotografiske billeder.
  • PNG: PNG-format er bedst egnet til gennemsigtige billeder.
  • WebP: dette er det bedste format i disse dage, men oprettelse af disse billeder kræver serversupport på dit websted

Bemærk, at dette kun er generelle anbefalinger. Som alle regler er der undtagelser, og nogle af disse regler er beregnet til at blive brudt.

Brug effektiv cache i browseren

Når du uploader billeder på en webside, skal du sørge for at uploade dem til et enkelt bibliotek. Uploade dine billeder til et enkelt bibliotek på en webside hjælper browseren med let at indlæse disse billeder ved hjælp af browserens cache under gentagne besøg.

Det er fint, hvis du uploader billeder via standard WordPress-billeduploader. Men for eksempel, hvis du opretter HTML-destinationssider på WordPress, er chancerne for, at du ikke bruger standard WordPress-billeduploader. I disse tilfælde skal du sørge for at uploade dem alle i en enkelt mappe i stedet for at uploade billederne på en webside til forskellige mapper.

Hvis du vil læse mere om cachelagring i browseren, og hvordan du udnytter den, kan du se vores detaljerede artikel her: Sådan udnyttes browsercaching i WordPress med eller uden et plugin [5 måder]

 

Brug det samme billede flere gange

En anden måde at bruge browser-caching til at reducere billedbåndbredde er ved at bruge de samme billeder flere gange på hele webstedet.

Når du f.eks. Bruger logoer eller menupunkter fra en side, skal du sørge for at ringe til de samme billeder på hele webstedet, så brugerne ikke behøver at downloade dem flere gange, men en gang, og browsere kan vise billederne fra browseren cache.

Mens du bruger en struktureret baggrund, skal du sørge for at bruge mindre billeder gentagne gange i stedet for at bruge et enkelt stort billede. Dette kan også hjælpe med at reducere indlæsningstiden.

Når du uploader billeder ved hjælp af medieuploader på WordPress-dashboard, går det som standard ind i mappen afhænger af, hvornår du uploader det. Det betyder, at alle de billeder, der uploades om en måned, vil være placeret i en enkelt mappe.

For eksempel, hvis du uploader et billede i 2021 januar, vil det være placeret i denne mappe: wp-content / uploads / 2021/01.

Lad os se på fordelene ved at uploade via medieoverføreren, og så fortæller vi dig, hvad du skal overveje, når du ikke uploader til din medieuploader for at fremskynde dit websted.

Medieuploader gør billedindlæsningen hurtigere: Indlæsningen sker hurtigere, hvis billederne er gemt i den samme mappe, mens du gennemsøger en webside. Når billederne kaldes gentagne gange, kan browseren nemt hente dem fra browserens cache, hvis de er i en enkelt mappe.

Ofte bruger WordPress-bloggere dog ikke standardmedie-uploader, især når de arbejder på en tilpasset destinationsside. Af hensyn til lethed uploader de billeder i en separat mappe.

I sådanne tilfælde skal du sørge for at uploade alle billederne på den side i en enkelt mappe i stedet for at uploade til flere mapper. Denne taktik kan forbedre indlæsningstiden, da caching af filer bliver lettere under gentagne besøg.

Brug CSS i stedet for billeder

Ved du, at du kan forbedre indlæsningstiden ved slet ikke at bruge noget billede?

For eksempel er det fuldstændigt muligt at generere bestemte former ved at bruge simpel CSS i stedet for billeder som afrundede rektangler, gradienter, dropskygger og gennemsigtige billeder. Når det er sagt, skal du sørge for at holde øje med browserkompatibilitetskontrol, når du udskifter et billede med CSS, fordi ikke alle browsere er i stand til at understøtte disse teknikker.

Om forfatteren
Shahzad Saeed
Forfatter: Shahzad SaeedInternet side: http://shahzadsaeed.com/
Shahzaad Saaed er blevet vist på et stort antal autoritetswebsteder som en WordPress-ekspert. Han har specialiseret sig i indholdsmarkedsføring for at hjælpe virksomheder med at øge deres trafik.

En ting mere... Vidste du, at folk, der deler nyttige ting som dette indlæg, også ser FANTASTISKE ud? ;-)
Vær venlig forlade a nyttigt kommenter med dine tanker, så del dette på din Facebook-gruppe (r), der ville finde det nyttigt, og lad os høste fordelene sammen. Tak fordi du delte og var god!

Afsløring: Denne side kan indeholde links til eksterne websteder for produkter, som vi elsker og helhjertet anbefaler. Hvis du køber produkter, vi foreslår, tjener vi muligvis et henvisningsgebyr. Sådanne gebyrer påvirker ikke vores anbefalinger, og vi accepterer ikke betalinger for positive anmeldelser.

Forfatter (e) Fremhævet den:  Inc Magazine-logo   Sitepoint-logo   CSS Tricks-logo    webdesignerdepot logo   WPMU DEV-logo   og mange flere ...