Progressieve Lazy Loading voor Joomla

Geweldige content maken op Joomla! is één ding, het toegankelijk maken is een ander. Lazy loading is één oplossing die beide combineert zonder uw workflow te wijzigen. Met progressieve lazy loadingworden afbeeldingen alleen geladen als en wanneer nodig. 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 vele; pagina's laden sneller, wat betekent dat de gebruikerservaring beter is, SEO-scores stijgen en uw Joomla-inhoud toegankelijker is voor gebruikers met low-end apparaten of trage internettoegang. Een paar weken geleden presenteerden we een verbetering van het basis lazy loading recept op WordPress. Vandaag presenteren we het ook voor Joomla!, maar daarvoor een kijkje op hoe u progressieve lazy loading op Joomla! kunt inschakelen.

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. Echter, Joomla!'s Speed Cache bevat ook andere functies die je helpen om het meeste uit lazy loading te halen.

Om lazy loading te configureren op uw Joomla!-blog, gaat u naar uw Speed Cache-dashboard. Klik daar op de configuratie-knop om naar de nieuwe Speed Cache-instellingenpagina te gaan.

De lazy loading instellingen bevinden zich in de parameters tab. Navigeer daarheen of gebruik de nieuwe zoekfunctionaliteit om de lazy loading instellingen te vinden. Om lazy loading in te schakelen, zet u eenvoudig de lazy loading optie aan. Zodra u dat doet, toont Speed Cache nieuwe opties om lazy loading aan te passen aan uw website.

Afbeeldingen uitsluiten van Joomla! Lazy Loading

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 daadwerkelijk de laadtijd van uw Joomla!-blog beïnvloeden. Zorg er daarom voor dat u alleen zeer kleine afbeeldingen uitsluit, zodat lazy loading niet nutteloos wordt.

In sommige gevallen wilt u mogelijk hele sets Joomla-berichten of pagina's uitsluiten van (of opnemen in) lazy loading. De redenen waarom u dit doet, variëren enorm en zijn redelijk—misschien is de media die ze bevatten integraal onderdeel van de inhoud. De volgende twee velden worden hiervoor gebruikt.

Met het eerste veld kunt u lazy loading alleen inschakelen voor bepaalde pagina's, en met het tweede veld kunt u lazy loading uitschakelen voor slechts een selectie van de inhoud. In beide gevallen zijn ook jokertekens toegestaan; gebruik het sterretje om lazy loading toe te passen op sets van gelijksoortig benoemde Joomla!-posts of pagina's. Sla de wijzigingen op om lazy loadingin te schakelen: lazy loading wordt automatisch van kracht op uw Joomla!-blog.

Hoe Progressieve Lazy Loading werkt op Joomla!

Lazy loading levert inhoud zodra het nodig is. Meestal bestaan pagina's uit een combinatie van tekst en afbeeldingen. Het downloaden van media duurt langer dan het downloaden van tekst, vooral op low-end mobiele apparaten of bij een langzame internetverbinding. Hoewel uw Joomla!-blog de mobiele apparaten of internetverbinding niet magisch kan versnellen, kan het wel het op één na beste doen: de gebruikerservaring verbeteren.

Wat lazy loading in feite betekent is dat de browser eerst de tekst laadt, wat gewoonlijk het integrale deel is van uw Joomla!-blog. Tekst is ook veel kleiner van formaat, dus het laadt sneller en uw lezers kunnen volgen. Als ze naar beneden scrollen en een afbeelding in beeld komt, downloadt en geeft lazy loading de afbeelding weer.

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

Progressieve lazy loading wordt automatisch ingeschakeld met lazy loading, wat betekent dat u geen extra wijzigingen hoeft aan te brengen. Het beste van alles is dat progressieve lazy loading door het gebruik van alleen kleine versies van de afbeelding zeer weinig overhead toevoegt aan uw Joomla!-opslagruimte.

Lazy Loading in Joomla! Galerijen

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

Het beste van alles is dat Speed Cache's lazy loading uw workflow niet belemmert. In plaats daarvan injecteert het lazy loading in uw proces: voeg eenvoudig een afbeelding of een galerij toe overal op uw Joomla!-blog en Speed Cache laadt automatisch de afbeeldingen lui met behulp van AJAX één voor één nadat de hoofdinhoud — voornamelijk de tekst en kleine afbeeldingen uitgesloten door uw voorkeuren — is geladen.

Slimme Lazy Loading Gebaseerd op Schermhoogte

Lazy loading gaat helemaal over scrollen en schermhoogte. Speed Cache’s lazy loading is erg slim omdat het alleen wordt toegepast op de huidige schermhoogte (gebaseerd op de viewport) en de volgende vooraf laadt. Dus als je een snelle verbinding hebt of als je langzaam scrolt, merk je niet eens dat lazy loading is geactiveerd op je Joomla-website.

Bovendien is deze lazy loading gebaseerd op de schermhoogte en is 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 de lazy loading toegepast zodra u omhoog of omlaag scrollt.

Joomla SEO en Lazy Loading

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

• De laadtijden van de pagina zijn veel beter;
• Alle afbeeldingsinhoud, inclusief alternatieve tekst, afbeeldingstitel en beschrijving worden onmiddellijk geladen zonder lazy loading; en
• Bij het eerst renderen van de pagina worden ook afbeeldingsbijschriften geladen.

Progressieve lazy loading is een compromis tussen het tonen van media en het vertragen van het downloaden ervan door visuele aanwijzingen toe te voegen. Tegelijkertijd maakt lazy loading het navigeren door uw Joomla!-blog een snellere en aangenamere ervaring. Er zouden geen grenzen moeten zijn aan het delen van geweldige content en nu, met progressieve lazy loading op Joomla!, zijn er geen grenzen aan het toegankelijk maken ervan.

Natuurlijk kunnen we ook in gedachten houden dat Speed Cache ook vele andere geweldige tools biedt, zoals een mooie Cache-module die ons in staat stelt onze sites te versnellen en naar een hoger niveau te tillen!

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