Spring naar de hoofdinhoud
6 minuten leestijd (1121 woorden)

Progressive Lazy Loading voor Joomla

joomla-progressive-lazy-loading

Geweldige inhoud maken op Joomla! is één ding, het toegankelijk maken is iets anders. Lazy loading is een oplossing die de twee combineert zonder uw workflow te wijzigen. Met progressief lazy loading worden afbeeldingen alleen geladen als en wanneer dat nodig is. Als de lezer nooit een afbeelding op de webpagina bereikt, wordt deze nooit gedownload. Nu is lazy loading ook beschikbaar op Joomla!

De voordelen van lazy loading zijn legio; pagina's worden sneller geladen, wat betekent dat de gebruikerservaring beter is, SEO-scores stijgen en uw Joomla-inhoud beter toegankelijk is voor gebruikers op low-end apparaten of langzame internettoegang. Een paar weken geleden presenteerden we een verbetering ten opzichte van het basisrecept voor lazy loading op WordPress . Vandaag presenteren we het voor Joomla! maar eerst eens kijken hoe u progressief lazy loading op Joomla!

 

Lazy Loading inschakelen op Joomla!

Lazy loading op Joomla! maakt deel uit van de Speed Cache extensie. Het activeren van lazy loading is net zo eenvoudig als het omzetten van een schakelaar. Speed Cache echter ook andere functies die u helpen het meeste uit ' lazy loading .

 

Om lazy loading op uw Joomla! blog, ga naar je Speed Cache dashboard. Klik vanaf daar op de configuratieknop om naar de gloednieuwe Speed Cache instellingenpagina te gaan.

 

De instellingen voor lazy loading bevinden zich op het tabblad Parameters . Navigeer daarheen of gebruik de gloednieuwe zoekfunctionaliteit om de instellingen voor lazy loading te zoeken. Om lazy loading mogelijk te maken , schakelt u gewoon de optie lazy loading in. Zodra u dat doet, toont Speed Cache nieuwe opties om lazy loading aan te passen aan uw website.

Afbeeldingen uitsluiten van Joomla!

Met de eerste twee velden kunt u bepaalde afbeeldingen uitsluiten van lazy loading als ze erg klein zijn, zoals pictogrammen of kleine logo's. Dit is handig om lazy loading alleen in te schakelen voor afbeeldingen die de laadtijd van uw Joomla! blog. Zorg er daarom voor dat u alleen zeer kleine afbeeldingen uitsluit, om lazy loading niet ondoelmatig te maken.

In sommige gevallen wilt u misschien complete sets van Joomla! berichten of pagina's van lazy loading . De redenen waarom u dit zou doen, lopen sterk uiteen en zijn redelijk - misschien zijn de media die ze bevatten een integraal onderdeel van de inhoud. Hiervoor worden de volgende twee velden gebruikt.

 

Met het eerste veld kunt u lazy loading alleen voor bepaalde pagina's inschakelen en met het tweede veld kunt u lazy loading voor slechts een selectie van de inhoud uitschakelen. In beide gevallen zijn jokertekens ook toegestaan; gebruik het asterisk-symbool om lazy loading te passen op sets van gelijknamige Joomla! berichten of pagina's. Sla wijzigingen op om lazy loading mogelijk te maken: lazy loading wordt van kracht op uw Joomla! blog automatisch.

 

Hoe progressief Lazy Loading werkt op Joomla!

Lazy loading biedt inhoud zodra deze nodig is. Gewoonlijk bestaan ​​pagina's uit een combinatie van tekst en afbeeldingen. Het downloaden van media kost meer tijd dan het downloaden van tekst, vooral op lagere mobiele telefoons of trage internettoegang. Terwijl uw Joomla! blog kan mobiele telefoons of internettoegang niet op magische wijze versnellen, het kan het volgende beste ding doen: de gebruikerservaring verbeteren.

Wat lazy loading in feite betekent, is dat de browser in eerste instantie de tekst laadt, die gewoonlijk het integrale deel van uw Joomla! blog. Tekst is ook veel kleiner van formaat, dus het laadt sneller en uw lezers kunnen het volgen. Wanneer ze naar beneden scrollen en een afbeelding in beeld komt, downloadt lazy loading en wordt de afbeelding weergegeven.

 

In werkelijkheid kan het nog even duren voordat een afbeelding is geladen. Daarom creëert progressief lazy loading van afbeeldingen automatisch een kleine versie van afbeeldingen - 20 px breed, met 4 kleuren en slechts een paar KB groot - blaast ze op tot de oorspronkelijke grootte en vervaagt ze. Het effect is een wazige versie van de afbeelding op volledige grootte die aangeeft dat de afbeelding nog steeds wordt gedownload. Wanneer lazy loading klaar is met het downloaden van de afbeelding, zal Joomla! vervangt het wazige beeld door het volledige beeld.

Progressive lazy loading wordt automatisch ingeschakeld bij lazy loading , wat betekent dat u geen aanvullende wijzigingen hoeft aan te brengen. Het beste van alles is dat door het gebruik van slechts kleine versies van de afbeelding, progressief lazy loading zeer weinig overhead toevoegt aan uw Joomla! opslagruimte.

 

Lazy Loading in Joomla! Galerijen

Lazy loading discrimineert niet. Speed Cache lazy loading Speed Cache werkt voor elke afbeelding, inclusief galerijen, zoals Droppics-galerijen. Net als bij normale afbeeldingen, blaast Speed Cache een kleine versie van de afbeeldingen in de galerij op en vervaagt deze. Wanneer gebruikers naar beneden scrollen, downloadt lazy loading de afbeeldingen op volledige grootte.

 

Het beste van alles is dat het lazy loading Speed Cache uw workflow niet belemmert. In plaats daarvan injecteert het lazy loading in uw proces: voeg eenvoudig een afbeelding of galerij in waar dan ook op uw Joomla! blog en Speed Cache laden de afbeeldingen automatisch lui met behulp van AJAX een voor een nadat de hoofdinhoud - voornamelijk de tekst en kleine afbeeldingen die door uw voorkeuren zijn uitgesloten - is geladen.

 

Smart Lazy Loading basis van schermhoogte

Lazy loading draait alles om scrollen en schermhoogte. Speed Cache lazy loading Speed Cache is erg slim op een manier dat het alleen van toepassing is op de huidige schermhoogte (op basis van de viewport) en de volgende vooraf laadt. Dus als u een snelle verbinding heeft of als u langzaam scrolt, merkt u niet eens dat lazy loading is geactiveerd op uw Joomla-website.

Bovendien is dit lazy loading basis van schermhoogte alleen van toepassing op de huidige schermhoogte, zelfs als deze zich in het midden van de pagina bevindt, bijvoorbeeld in het geval van een link naar een anker. Vervolgens wordt het lazy loading toegepast zodra u omhoog of omlaag scrolt.

 

viewport-lazy-loading

 

Joomla SEO en Lazy Loading

Het lazy loading gebruikt in Speed Cache heeft geen invloed op SEO. In feite zullen zoekmachines die uw inhoud crawlen, zoals de Google-bot, alleen voordelen zien:

  • De laadtijden van de pagina zijn veel beter;
  • Alle afbeeldingsinhoud, inclusief alternatieve tekst, afbeeldingstitel en beschrijving, worden onmiddellijk geladen zonder lazy loading ; en
  • Bijschriften van afbeeldingen worden ook geladen wanneer de pagina voor het eerst wordt gerenderd.

alternate-lazy-loading

 

Progressive lazy loading is een compromis tussen het tonen van media en het vertragen van het downloaden door visuele aanwijzingen toe te voegen. Tegelijkertijd zorgt lazy loading ervoor dat u door uw Joomla! blog een snellere en prettige ervaring. Er mogen geen grenzen zijn aan het delen van geweldige inhoud en nu, met progressief lazy loading op Joomla! er zijn ook geen grenzen om het toegankelijk te maken.

Natuurlijk kunnen we ook in gedachten houden dat Speed Cache ook veel andere geweldige tools biedt, zoals een hele mooie Cache-module waarmee we onze sites kunnen versnellen en naar een hoger niveau kunnen tillen!

Controleer Speed Cache voor Joomla:  https://www.joomunited.com/products/speed-cache

7
Blijf geïnformeerd

Wanneer u zich abonneert op de blog, sturen we u een e-mail wanneer er nieuwe updates op de site zijn, zodat u deze niet mist.

gerelateerde berichten

 

Opmerkingen 1

hobbyist op dinsdag 18 februari 2020 06:25

Ik ben op zoek naar lazy loading van ingesloten videospelers (youtube). Een aantal daarvan veroorzaken veel verkeer wanneer de pagina wordt geladen. In dit artikel worden geen video's genoemd, alleen afbeeldingen, dus ik neem aan dat dit niet van toepassing is.

Overigens kan ik de tekst "Loading time is the page is way better" niet ontleden.

Ik ben op zoek naar het lazy loading van embedded videospelers (youtube). Een aantal daarvan veroorzaken veel verkeer wanneer de pagina wordt geladen. Dit artikel vermeldt geen video's, alleen afbeeldingen, dus ik neem aan dat het niet van toepassing is. Overigens kan ik de tekst "Laadtijd is de pagina is veel beter" niet ontleden.
Al geregistreerd? Hier inloggen
Donderdag 25 april 2024

Captcha-afbeelding