Lazy Loading progressif pour Joomla

Créer du contenu de qualité sur Joomla! est une chose, le rendre accessible en est une autre. Lazy loading est une solution qui combine les deux sans modifier votre flux de travail. Avec lazy loadingprogressif, les images se chargent uniquement si et quand elles sont nécessaires. Si le lecteur n'atteint jamais une image sur la page Web, elle n'est jamais téléchargée. Maintenant, lazy loading est également disponible sur Joomla!

Les avantages de lazy loading sont nombreux ; les pages se chargent plus rapidement, ce qui signifie que l'expérience utilisateur est meilleure, les scores SEO s'envolent et votre contenu Joomla est plus accessible aux utilisateurs sur des appareils bas de gamme ou avec une connexion internet lente. Il y a quelques semaines, nous avons présenté une amélioration de la recette de base lazy loading sur WordPress. Aujourd'hui, nous le présentons également pour Joomla !, mais avant cela, un aperçu de la façon dont vous pouvez activer lazy loading progressif sur Joomla !

Activation de Lazy Loading sur Joomla !

Lazy loading sur Joomla ! fait partie de l'extension Speed Cache. Activer lazy loading est aussi simple que de basculer un interrupteur. Cependant, Joomla ! Speed Cache comprend également d'autres fonctionnalités qui vous aident à tirer le meilleur parti de lazy loading.

Pour configurer sur votre blog Joomla !, accédez à votre tableau de bord . À partir de là, cliquez sur le bouton configuration pour accéder à la toute nouvelle page de paramètres .

Les lazy loading paramètres sont situés dans l'onglet paramètres. Accédez-y ou utilisez la toute nouvelle fonctionnalité de recherche pour rechercher les paramètres lazy loading. Pour activer lazy loading, il suffit d'activer l'option lazy loading. Dès que vous faites cela, Speed Cache affiche de nouvelles options pour personnaliser lazy loading en fonction de votre site Web.

Exclure les images du chargement différé Joomla !

Avec les deux premiers champs, vous pouvez exclure certaines images du chargement différé si elles sont très petites, comme des icônes ou des petits logos. Ceci est utile pour activer le chargement différé uniquement pour les images qui ont un impact réel sur le temps de chargement de votre blog Joomla !. Pour cette raison, assurez-vous de n'exclure que les très petites images afin de ne pas rendre le chargement différé inefficace.

Dans certains cas, cependant, vous pourriez vouloir exclure (ou inclure) des ensembles entiers d'articles ou de pages Joomla! de lazy loading. Les raisons pour lesquelles vous feriez cela varient grandement et sont raisonnables — peut-être que les médias qu'ils incluent sont intégrés au contenu. Les deux champs suivants sont utilisés à cet effet.

Avec le premier champ, vous pouvez activer lazy loading uniquement pour certaines pages, et avec le deuxième champ, vous pouvez désactiver lazy loading pour une sélection de contenu uniquement. Dans les deux cas, les caractères génériques sont également autorisés ; utilisez le symbole astérisque pour appliquer lazy loading sur des ensembles de publications ou de pages Joomla ! portant des noms similaires. Enregistrez les modifications pour activer lazy loading: lazy loading prend effet automatiquement sur votre blog Joomla !.

Comment fonctionne le chargement différé progressif sur Joomla !

Lazy loading sert le contenu dès qu'il est nécessaire. Habituellement, les pages sont constituées d'une combinaison de texte et d'images. Le téléchargement de médias prend plus de temps que le téléchargement de texte, en particulier sur les téléphones mobiles bas de gamme ou avec une connexion internet lente. Alors que votre blog Joomla! ne peut pas magiquement accélérer les mobiles ou l'accès à Internet, il peut faire la chose suivante : améliorer l'expérience utilisateur.

Ce que lazy loading signifie en effet, c'est que le navigateur charge initialement le texte, qui est généralement la partie intégrante de votre blog Joomla ! Le texte est également beaucoup plus petit en taille, il se charge donc plus rapidement et vos lecteurs peuvent suivre. Lorsqu'ils font défiler la page vers le bas et qu'une image apparaît, lazy loading télécharge et affiche l'image.

En réalité, il peut encore falloir un certain temps pour qu'une image se charge. Par conséquent, le chargement différé progressif d'image crée automatiquement une petite version des images — 20 px de large, avec 4 couleurs et juste quelques Ko en taille — les gonfle à la taille d'origine puis les floute. L'effet est une version floue de l'image pleine taille qui indique que l'image est encore en cours de téléchargement. Lorsque lazy loading termine le téléchargement de l'image, Joomla ! remplace l'image floue par l'image pleine.

Le chargement différé progressif est activé automatiquement avec le chargement différé, ce qui signifie que vous n'avez pas besoin d'apporter de modifications supplémentaires. Mieux encore, en utilisant uniquement de petites versions de l'image, le chargement différé progressif ajoute très peu de surcharge à l'espace de stockage de votre Joomla !.

Lazy Loading dans les galeries Joomla!

Lazy loading ne fait aucune discrimination. Le lazy loading de Speed Cachefonctionne pour n'importe quelle image, y compris les galeries, telles que les galeries Droppics . De même que pour les images normales, Speed Cache agrandit une petite version des images dans la galerie et la floute. Lorsque les utilisateurs font défiler la page vers le bas, lazy loading télécharge les images en taille réelle.

Mieux encore, le lazy loading de Speed Cachen'entrave pas votre flux de travail. Au lieu de cela, il injecte lazy loading dans votre processus : insérez simplement une image ou une galerie n'importe où sur votre blog Joomla! et Speed Cache charge automatiquement les images paresseusement en utilisant AJAX une par une après le chargement du contenu principal — principalement le texte et les petites images exclues par vos préférences —.

Chargement intelligent Lazy Loading basé sur la hauteur de l'écran

Lazy loading est tout sur le défilement et la hauteur de l'écran. Le lazy loading de Speed Cacheest très intelligent de manière qu'il s'applique uniquement sur la hauteur de l'écran actuel (basé sur la fenêtre d'affichage) et précharge le suivant. Donc, si vous avez une connexion rapide ou si vous faites défiler lentement, vous ne remarquerez même pas que lazy loading est activé sur votre site Web Joomla.

De plus, ce lazy loading basé sur la hauteur de l'écran ne s'applique qu'à la hauteur d'écran actuelle, même s'il est au milieu de la page, dans le cas d'un lien vers une ancre par exemple. Ensuite, le lazy loading est appliqué une fois que vous faites défiler vers le haut ou vers le bas.

SEO Joomla et Lazy Loading

Le chargement différé utilisé dans Speed Cache n'a pas d'impact sur le SEO. En fait, les moteurs de recherche qui analysent votre contenu, tels que le robot Google, ne verront que des avantages :

• Les temps de chargement de la page sont bien meilleurs ;
• Tout le contenu de l'image, y compris le texte alternatif, le titre de l'image et la description sont chargés immédiatement sans lazy loading; et
• Les légendes des images sont également chargées lorsque la page est rendue pour la première fois.

Le chargement progressif est un compromis entre l'affichage des médias et le retardement de leur téléchargement en ajoutant des indices visuels. Dans le même temps, le chargement différé rend la navigation dans votre blog Joomla ! plus rapide et plus agréable. Il ne devrait y avoir aucune limite au partage de contenu de qualité et maintenant, avec le chargement progressif sur Joomla !, il n'y a plus de limites pour le rendre accessible non plus.

Bien sûr, nous pouvons également garder à l'esprit que Speed Cache propose également de nombreux autres outils formidables comme un module de cache vraiment agréable qui nous permettra d'accélérer nos sites et de les amener au niveau supérieur !

Vérifiez pour Joomla :  https://www.joomunited.com/products/speed-cache