Bonjour à tous, c'est Lucas Martin sur Cash Astuce. Aujourd'hui, nous allons nous attaquer au plus grand dilemme des éditeurs web : comment monétiser son blog avec Google AdSense sans détruire sa vitesse de chargement et ses signaux Core Web Vitals ?
Si vous testez votre blog sur Google PageSpeed Insights, vous remarquerez que le fichier adsbygoogle.js bloque le fil d'exécution principal (Main Thread) et fait chuter votre score sur mobile. La solution des ingénieurs web modernes est le Lazy Loading (Chargement différé ou paresseux).
Dans ce tutoriel, nous allons implémenter un script qui empêche AdSense de se charger tant que le visiteur n'a pas commencé à interagir avec la page (scroll ou clic). Le résultat ? Un site ultra-rapide et un taux de clics (CTR) souvent amélioré !
Pourquoi le Lazy Load AdSense est crucial en 2026 ?
Le SEO technique ne pardonne plus les sites lents. Intégrer notre script de chargement différé vous apporte trois avantages majeurs :
- Explosion du score PageSpeed : En retardant l'exécution du JavaScript publicitaire, le contenu principal de votre article s'affiche instantanément.
- Amélioration de la "Viewability" (Visibilité) : Les annonces ne se chargent que lorsque l'utilisateur scrolle vers elles. Google adore cela et augmente le RPM (Revenu pour mille impressions) des annonces très visibles.
- Économie de bande passante : Pour les utilisateurs mobiles en 4G/5G, ne pas charger les publicités qu'ils ne verront jamais est une excellente pratique UX.
Tutoriel : Implémentation du Lazy Loading sur Blogger
Attention : Comme toujours, effectuez une sauvegarde de votre thème Blogger (Thème > Sauvegarder) avant toute modification du code HTML.
Étape 1 : Nettoyer votre blog des anciens scripts AdSense
Pour que cette astuce fonctionne, vous ne devez appeler le script adsbygoogle.js qu'une seule fois. Allez dans Thème > Modifier le code HTML et supprimez TOUTES les occurrences de la ligne suivante (que vous trouvez souvent dans le <head> ou au-dessus de vos blocs d'annonces) :
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXXXXXX" crossorigin="anonymous"></script>
Note : Conservez bien le code HTML de vos blocs d'annonces (ins, class="adsbygoogle"...), supprimez uniquement la balise script.
Étape 2 : Ajouter le Script Lazy Load (Magique)
Maintenant, descendez tout en bas de votre code HTML, juste au-dessus de la balise fermante </body>. Ajoutez le script suivant. N'oubliez pas de remplacer VOTRE-ID-EDITEUR par votre véritable ID AdSense (qui commence par pub-...).
Astuce : Grâce à notre récente optimisation, vous pouvez copier ce code en un seul clic via le bouton "Copier" en haut à droite du bloc !
<!-- Lazy Load AdSense Script par Cash Astuce -->
<script type='text/javascript'>
//<![CDATA[
var lazyAdsense = false;
window.addEventListener("scroll", function(){
if ((document.documentElement.scrollTop != 0 && lazyAdsense === false) || (document.body.scrollTop != 0 && lazyAdsense === false)) {
(function() {
var adScript = document.createElement('script');
adScript.type = 'text/javascript';
adScript.async = true;
adScript.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-VOTRE-ID-EDITEUR'; // Remplacez par votre ID
adScript.crossOrigin = "anonymous";
var firstScript = document.getElementsByTagName('script')[0];
firstScript.parentNode.insertBefore(adScript, firstScript);
})();
lazyAdsense = true;
}
}, true);
//]]>
</script>
Comment ça marche ?
Ce script en Vanilla JavaScript "écoute" (Event Listener) l'action de défilement (scroll) de l'utilisateur. Dès que l'utilisateur descend d'un seul pixel, le script injecte dynamiquement l'appel vers les serveurs de Google AdSense. L'impact sur le temps de chargement initial (First Contentful Paint) est ainsi réduit à zéro !
Conclusion de l'Expert
L'optimisation des performances web (WPO) est un processus continu. Retarder les scripts tiers comme AdSense est l'une des techniques les plus puissantes pour dominer les résultats de recherche sur mobile.
Cependant, la vitesse seule ne suffit pas si l'expérience utilisateur globale n'est pas optimisée. C'est pourquoi nous vous recommandons fortement d'accompagner cette amélioration de vitesse par une meilleure lisibilité de vos articles en intégrant notre Tutoriel pour ajouter un bouton Copier le Code sans jQuery (celui que vous venez d'utiliser !) et notre Guide sur l'intégration du Fil d'Ariane JSON-LD pour une structure SEO impeccable.
Testez votre site sur PageSpeed Insights avant et après cette modification, vous serez bluffé par la différence. Partagez vos nouveaux scores dans les commentaires !

Commentaires
Enregistrer un commentaire