Si të ngarkoni me imazhe + video në WordPress (dhe të zëvendësoni iFrames në YouTube me një imazh parapamje) për rezultate më të mira të GTmetrix

Cila është mënyra më e mirë për të imazhe dhe video me ngarkesë dembel në WordPress?


Kjo varet nëse ju jeni duke përdorur tashmë një plug plug cache që mbështet ngarkimin dembel (WP Rocket, W3 Total Cache, Swift, LiteSpeed ​​Cache). Nëse shtojca juaj e cache mbështet imazhe dhe video ngarkesash, është më së miri ta përdorni atë për të mos pasur nevojë të instaloni një shtojcë shtesë. Por nëse shtojca juaj e cache nuk e mbështet ngarkimin dembel, unë rekomandoj të përdorni një që bën (veçanërisht WP Rocket), përndryshe kam listuar shtojcat alternative të ngarkimit dembel poshtë mund të instaloni individualisht.

Isfarë është duke ngarkuar dembel?
Ngarkimi dembel nënkupton se imazhet dhe videot ngarkohen vetëm pasi përdoruesit të lëvizin poshtë në faqe dhe t’i shohin në të vërtetë. Kjo rezulton në më pak kërkesa HTTP në faqe, megjithatë nëse keni shumë imazhe ose video të ngulitura, kërkon që t’i ngarkoni ato vazhdimisht duke lëvizur poshtë faqes.

Doesfarë do të thotë të zëvendësoni Iframe në YouTube me një imazh parapamje?
Nëse ngulitni video në faqen tuaj në WordPress, kjo ngarkon vetëm “riprodhuesin yndyrë të YouTube” sapo njerëzit klikojnë butonin Luaj. Me fjalë të tjera, e vetmja gjë e ngarkuar fillimisht është një imazh paraprak.

Duhet të ngarkosh me imazhe dhe video?
Unë nuk i ngarkoj imazhet e ngarkesës sepse ngarkimi i vazhdueshëm i imazheve ndërsa lëvizni poshtë në faqe mund të jetë i bezdisshëm për përdoruesit. Sidoqoftë, të gjitha imazhet e mia janë optimizuar në 100% në GTmetrix. Unë bëj video me ngarkesë dembel dhe zëvendësoj iframe me një imazh parapamje. Meqenëse çdo video e ngulitur mund të zgjasë 2 sekonda për t’u ngarkuar (shumë më e rëndë se një imazh), përfitimi i videove me ngarkesë dembel është i rëndësishëm.

1. Raketë WP

WP Rocket është zgjedhja ime # 1 për ngarkim dembel dhe ishte shtojca # 1 e cache në sondazhet në Facebook.

Meqenëse tashmë ka ngarkuar dembel brenda, kjo do të thotë që nuk do të duhet të instaloni një shtojcë shtesë. Ky është përfitimi i tërë i WP Rocket; ajo vjen me më shumë veçori sesa pothuajse çdo shtojcë tjetër e cache (duke rezultuar në kohë më të mirë ngarkese dhe rezultate GTmetrix), por më pak shtesa në faqen tuaj. Rocket WP ka një shtrirje të gjerë dokumentacion mbi ngarkimin dembel dhe konfigurimin e cilësimeve të WP Rocket.

Raketë WP

Si të aktivizoni ngarkesën me dembel në raketë WP
Për të mundësuar ngarkimin dembel në WP Rocket, shkoni te Parametrat > Raketë WP > Media > LazyLoad. Ju mund ta aktivizoni atë për imazhe, iframe dhe video, dhe të zëvendësoni iframes në YouTube me një imazh parapamje.

Fotografi me ngarkesë dembel Raketa WP

2. SG Optimizer

SiteGround futur ngarkimin dembel në azhurnimin e tyre të madh të SG Optimizer.

Sigurisht, duhet të jesh një klient i SiteGround për të përdorur këtë shtojcë (gjë që unë do të bëja për një pritje të përbashkët duke pasur parasysh se ata u vlerësuan hosti # 1 në mbi 20 sondazhe në Facebook). SG Optimizer është i krahasueshëm me WP Rocket, por nuk ka me gati aq karakteristika. Pra, nëse jeni duke përdorur SiteGround për hostin tuaj, unë prapë do të favorizoja WP Rocket mbi SG Optimizer-in e tyre.

SiteGround SG Optimizer

Si të aktivizoni ngarkesën me dembel në Optimizer SG
Për të mundësuar ngarkimin dembel në SG Optimizer, shkoni te Parametrat > SG Optimizer > Paraqitjet në sit > Optimizimi i figurës. Ju mund të merrni imazhe të ngarkesës dembel, Gravatars, thumbnails, imazhe të përgjegjshme dhe pajisje. Nëse keni komente në blogun tuaj, Gravatars me ngarkesë dembel mund të ndihmojnë jashtëzakonisht shumë.

SG Optimizer Loading Lazy

3. W3 Total Cache

Nëse tashmë përdorni W3 Total Cache, ato gjithashtu kanë një opsion i ngarkimit dembel.

W3 Total Cache u konsiderua i braktisur për ca kohë, por zhvilluesi prej atëherë ka filluar të mirëmbajë plugin e tij. Kam një tutorial të gjerë për konfigurimin e cilësimeve të Cache Total Cache.

Plugin W3 Total Cache

Si të aktivizoni ngarkesën dembel në cache totale W3
Për të mundësuar ngarkimin e ngarkimit në W3 Total Cache, shkoni te Cilësimet > Cilësimet e përgjithshme > Eksperienca e perdoruesit > Loading Lazy. Ndrysho këtë, pastaj shko te Përvoja e Përdoruesit > Loading Lazy. Zgjidhni të përpunoni etiketat e figurave HTML, imazhet në sfond, të përjashtoni fjalët dhe metodën e ngulitjes së skenarëve.

W3 Gjithsej Loading Cache Lazy

4. Cache i Litespeed

Cache e litepseed ngarkim dembel do të bëjë punën gjithashtu (Litespeed është plugin cache i rishikuar mirë).

Shtojcë LiteSpeed ​​Cache

Si të aktivizoni ngarkesën me dembel në kutinë LiteSpeed
Për të mundësuar ngarkimin e ngarkimit në LiteSpeed ​​Cache, shkoni te LiteSpeed ​​Cache > Cilësimet > Media > Cilësimet e mediave. Këtu mund të aktivizoni imazhe me ngarkesë dembelësh, iframe, të përjashtoni imazhe, të kërkoni automatikisht optimizim përmes punës, të përfshini bibliotekën Javascript brenda dhe të ndryshoni cilësimet e tjera.

Piktura me ngarkesë të imazheve Video Cache Litespeed

5. Performanca e shpejtë

Performanca e shpejtë është një tjetër plug cache që mbështet ngarkimin dembel. Swift mori vlerësime të shkëlqyera në WordPress Speed ​​Up Facebook Group, por vlerësimet në faqen e shtojcave të WordPress janë vetëm rreth 4 yje. Unë nuk e kam provuar Shpejtësinë e Shpejtësisë; Jam plotësisht e lumtur me WP Rocket.

Shtojcë Swift Performance Lite

Si të aktivizoni ngarkesën me dembel në performancën e shpejtë
Për të mundësuar ngarkimin e ngarkimit në Swift Performance, shkoni te Parametrat > Media > Ngarkesa me dembel. Këtu do të keni mundësinë që të bëni imazhe të ngarkesës dembelë, të përjashtoni imazhe të caktuara dhe të futni imazhe të ngarkesës dembelë.

Imazhe të ngarkesës me ngarkesë Performanca e shpejtë

6. Autoptimizoni

Autoptimize shpesh përdoret me hoste si GoDaddy dhe WP Engine, ku ata kanë sistemin e tyre të brendshëm të memorimit dhe plugins cache të listës së zezë. Në këtë rast (pasi që ju doni të kujdeseni për optimizimet e tjera të shpejtësisë), Autoptimize është zakonisht shtojca e shkimit për atë. Një nga karakteristikat e shumta është ngarkim dembel, por gjithashtu ju lejon të zgjedhni HTML, CSS, JavaScript dhe Google Fonts.

Autoptimizoni shtojcën

Si të aktivizoni ngarkesën me dembel në autoptimizim
Për të aktivizuar ngarkimin e ngarkimit në Autoptimize, shkoni te Parametrat > images > Imazhe me ngarkesë dembelë. Ju gjithashtu keni mundësinë që të përdorni CDN të ShortPixel i cili për optimizimin e figurës (kjo është shtojca që unë përdor).

Imazhet me ngarkesë me Lazë Autoptimizojnë

7. Fërkoni

Smush është një shtojcë për optimizimin e imazhit që mbështet ngarkimin dembel. Wasshtë zhvilluar nga WPMU, megjithatë unë personalisht përdor ShortPixel për kompresim pa humbje pasi është i vetmi që kam përdorur që i bën imazhet e mia 100% në GTmetrix (dhe kam testuar shumë shtesa të optimizimit të imazhit).

Smush plugin

Si të aktivizoni ngarkesën me dembel në smush
Për të mundësuar ngarkimin e ngarkimit në Smush, shkoni te Smush > baltëpritëse > Ngarkesa me dembel. Ju mund të zgjidhni llojet e skedarëve që dëshironi të ngarkuar me dembel (.jpeg, png, .gif, .svg, iframe), dhe nëse dëshironi që të aktivizohet për përmbajtje, widget, thumbnails, Gravatars. Madje ka edhe cilësime të animacionit të ngarkesës dembel.

Smush Load Lazy

8. Load Lazy By WP Rocket

Ngarkesë dembel nga raketa WP është mirë nëse nuk përdorni WP Rocket por doni të bëni imazhe me ngarkesë.

Plugin me ngarkesë dembel

Si të aktivizoni ngarkesën me dembel në ngarkesën e dembelit nga WP Rocket
Shkoni te Parametrat > LazyLoad. Ju keni mundësinë të bëni imazhe të ngarkesës dembel, iframes & video, dhe zëvendësoni videot e YouTube me tablo. Nuk ka shumë cilësime për të konfiguruar; Unë personalisht uroj që të kishte më shumë. Ndoshta kjo është arsyeja pse kjo shtojcë e ngarkesës dembel nuk ka vlerësimet më të mira.

Ngarkesë dembel nga raketa WP

9. Ngarkesa A3 e Lazit

A3 ngarkesë me përtaci mbështet ngarkimin dembel të të dy imazheve dhe videove.

a3 Plugin me ngarkesë dembel

Si të aktivizoni ngarkesën me përtaci në ngarkesën me humbje A3
Për të mundësuar ngarkimin e ngarkimit në A3 Lazy Load, shkoni te cilësimet > A3 ngarkesë me përtaci. Mund të konfiguroni cilësimet për imazhe, video, iframes, gravatars, me ngarkesë dembelë dhe të zgjidhni cilat zona të faqes tuaj të internetit dëshironi të aplikoni ngarkimin dembel (përfshirë celularin). Ekzistojnë gjithashtu mundësi për të mundësuar një efekt ngarkimi dembel, duke ngarkuar ngjyrën e sfondit dhe opsionin për të përjashtuar URL-të dhe llojet e postimit.

a3 Cilësimet e ngarkesës dembel

10. Ngarkesa BJ me Lazy

BJ ngarkesë me përtaci nuk duket se është mirëmbajtur, kështu që unë ndoshta do të përdor një plugin tjetër.

Shtojca BJ Lazy Load

Si të aktivizoni ngarkesën me përtaci në ngarkesën dembel të BJ
Për të mundësuar ngarkimin e ngarkimit në BJ Lazy Load, shkoni te Parametrat > BJ ngarkesë me përtaci. Cilësimet janë relativisht të thjeshta dhe ju japin mundësinë që të bëni imazhe të ngarkesës demokratike, iframes, Gravatars, dhe të përjashtoni ngarkimin dembel nga përmbajtja, widget-et e tekstit dhe postat e minutave. Ekziston gjithashtu një mundësi për të përfshirë një imazh të mbajtësit të vendndodhjes, pragun e shikimit, dhe përdorimin e një imazhi të rezolucionit të ulët kur ngarkoni dembel.

Cilësimet e ngarkesës me ngarkesë BJ

11. Ngarkesa me ngarkesë për figurat

Ngarkesë dembel për imazhe është e mirë nëse dëshironi ta bëni vetëm për imazhe.

Shtojcë Lazy për plugin Images

Si të aktivizoni ngarkesën me përtaci për figurat
Nuk ka cilësime për të konfiguruar në shtojcën Lazy Load For Images (është automatike).

12. Ngarkesa me ngarkesë për video

Ngarkesë dembel për video zëvendëson videot e ngulitura me një pamje paraprake të klikueshme.

Ngarkesë dembel për shtojcën e videos

Si të aktivizoni ngarkesën me dembel në ngarkesën e dembelit për video
Për të mundësuar ngarkimin e ngarkimit në Lazy Load For Videos, shkoni te Cilësimet > Ngarkesë dembel për video. Zgjidhni të ngarkoni vetëm CSS / JS kur të jetë e nevojshme, të rregulloni butonin e luajtjes dhe të aplikoni CSS me porosi.

Ngarkesë dembel për shtojcën e videove

13. Ngarkesa e borës për komente

Ju mund të komentoni ngarkesën dembel duke përdorur Ngarkesë dembel për komente plugin.

Kjo mund të ndihmojë për të bërë më pak kërkesa të HTTP-ve nëse keni shumë komente në blogun tuaj, veçanërisht pasi Gravatars mund të marrë një kohë të gjatë për të ngarkuar midis të gjitha kërkesave të palëve të treta.

Ngarkesë dembel për shtojcën e komenteve

Si të aktivizoni ngarkesën me dembel në ngarkesën e dembelit për komente
Për të mundësuar ngarkimin e ngarkimit në Lazy Load For Comments, shkoni te Parametrat > diskutim > Komente të ngarkesës dembel. Kjo është konfigurimi i vetëm i cilësimeve për këtë shtojcë, por ka edhe vlerësime të mira.

Komente të ngarkesës dembel

14. WP YouTube Lyte

WP YouTube Lyte është një nga shtojcat e mia të preferuara (dhe të shqyrtuara më së miri) për videot me ngarkesë dembel. Wasshtë krijuar nga ekipi në Autoptimize i cili ka tendencë të ketë komente të mira për plugin-et rreth e qark.

Shtojcë shtesë WP YouTube Lyte

Si të aktivizoni ngarkesën me dembel në WP YouTube Lyte
Për të mundësuar ngarkimin e ngarkimit në WP YouTube Lyte, shkoni te Cilësimet > WP YouTube Lyte. Rrëmbej Keyelësi API i YouTube dhe futeni atë në Autoptimize. Zgjidhni madhësinë e luajtësit tuaj, nëse do të përfshini lidhje, pozicionin e luajtësit, forcën HD, veproni si lidhje normale / iframes në YouTube dhe shtoni mikrodata. Ruajtja e figurave të vogla në vend shpesh mund të rregullojë gabimet e GTmetrix kur fut video në YouTube.

Thumbnails të YouTube në GTmetrix

Cilësimet e YouTube Lyte

Akoma keni nevojë për ndihmë?

Kam një video të shkëlqyeshme për optimizimin e shpejtësisë së WordPress:

Unë gjithashtu kam mësime për optimizimin e imazheve, konfigurimin e WP Rocket, zvogëlimin e kohës së reagimit të serverit dhe më shumë. Unë jam në gjendje të marr 100% (ose afër) rezultate GTmetrix në pothuajse çdo postim tim duke përdorur këto këshilla. Nëse keni pyetje, mos ngurroni të më hidhni një koment – të lumtur për të ndihmuar!

Pyetjet e bëra më shpesh

&# X2705; Cila shtojcë është më e mira për imazhet e ngarkimit dembel?

Nëse tashmë përdorni një shtojcë cache që mbështet ngarkesën dembel (p.sh. WP Rocket, SG Optimizer, W3TC, Swift, LiteSpeed), është më mirë të provoni së pari. Përndryshe, Autoptimize ose shtesa Lazy Load nga WP Rocket janë shtojca të mira të ngarkesës dembel.

&# X2705; Po në lidhje me videot me ngarkesë dembelë?

Rocket WP dhe disa shtojca të tjera të cache ju lejojnë të ngarkoni videot me ngarkesë dhe të zëvendësoni iframe në YouTube me një imazh parapamjeje. Përndryshe, WP YouTube Lyte do të funksionojë.

&# X2705; A do të ngarkojë dembel përvojën e përdoruesit?

Unë nuk bie shumë në sy në ngarkimin e imazheve në këtë faqe në internet, por bëj video me ngarkesë dembel sepse u duhen shumë më gjatë për tu ngarkuar. Imazhet me ngarkesë me ngarkesë mund të jenë të bezdisshme për përdoruesit dhe ulën shitjet e anëtarëve të mi, kështu që e çaktivizova atë.

&# X2705; Doesfarë bën ngarkimi dembel?

Ngarkimi me përthitje shpejton kohën fillestare të ngarkesës duke pritur të ngarkojë imazhe dhe video derisa përdoruesit të lëvizin poshtë në faqe dhe t’i shohin ato në të vërtetë.

&# X2705; Si të çaktivizoni ngarkesën dembel në faqe të veçanta?

Shumica e shtojcave ju lejojnë ta bëni këtë. Për shembull, nëse përdorni WP Rocket dhe redaktoni një faqe ose postim, do të shihni një opsion në pultin tuaj për të çaktivizuar (ose aktivizuar) ngarkesën dembel në atë pjesë specifike të përmbajtjes.

Gëzuar,
mashkull

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map