En 2020 Google a introduit plusieurs mesures pour réguler la publicité sur internet dans le navigateur Google Chrome. La mesure Heavy Ad a été créée pour identifier et supprimer les publicités en ligne ayant une consommation de ressources jugées trop importante.
Lorsque le Player est initialisé sur vos propriétés via un script ou un outil tiers, Google Chrome peut considérer l'Iframe du Player comme étant une publicité, et empêcher son fonctionnement à travers Heavy Ads.
Dans cet article, vous allez apprendre comment fonctionne Heavy Ad, et pourquoi cela impacte parfois votre Player. Vous allez aussi apprendre à vérifier votre intégration pour voir si celle ci est impactée par Heavy Ad, et comment corriger votre intégration.
Comment fonctionne Heavy Ad ?
Pour faire simple c'est un système qui détecte, décharge et supprime les publicités qui nécessitent trop de ressources système, telle que la bande passante ou le processeur de l'utilisateur.
Selon Google, Les publicités peu performantes nuisent à l’expérience utilisateur en rendant les pages internet lentes et contraignantes à utiliser pour les utilisateurs.
Ainsi, Heavy Ad considère une publicité peu performante si elle répond à l'un des critères suivants :
- La publicité a utilisé le thread principal du processeur pendant plus de 60 secondes au total.
- La publicité a utilisé le thread principal du processeur pendant plus de 15 secondes dans une fenêtre de 30 secondes.
- La publicité a utilisé plus de 4MBs de bandes passantes pour charger la ressource
Heavy Ad & l'interaction utilisateur
Heavy Ad ne pourra pas être déclenché sur le contenu ayant été généré par une action de l'utilisateur. Ainsi, les Player intégrés qui n'ont pas activés l'option "Autostart" ne seront pas impactés quand un utilisateur cliquera sur le bouton de lecture pour visionner son contenu.
Pourquoi le Player est t-il impacté par Heavy Ad
Heavy Ads ne devrait intervenir que sur les publicités affichées au sein du player Dailymotion, et qui ne respectent pas les critères listés ci-dessus.
Par conséquent, cette fonctionnalité ne devrait pas interférer avec l'expérience de visionnage du Player.
Cependant, en fonction de la méthode d'implémentation utilisée, Google ne considérera pas le Player de la même façon.
En effet, si votre player est initialisé par des scripts ou par des outils tiers qui ont également un rôle sur la gestion de la publicité sur votre domaine, alors il est possible que le Player soit vu par Google comme étant une publicité et qu'il soit par conséquent inaccessible car bloqué par le navigateur.
Voici quelques exemples de méthodes d'implémentation qui peuvent mener à une intervention de Google sur le player :
| Méthode d’implémentation | Description |
|---|---|
| Intégrer le Player ou la librairie du player en utilisant une solution tierce | Les solutions de publicités de tierces comme Google Ads Manager, responsable du chargement des différent scripts de vos pages web, dont ceux initialisant le Player. |
| Intégrer le Player ou la librairie en utilisant un fichier Javascript qui a déclenché l'une des règles dans la "Chrome ads detection list" (aussi appelé EasyList) |
La liste peut-être consultée ici, Si Chrome détecte que l'un de vos scripts appelle une URL contenue dans la liste ci-dessus, et que ces scripts sont également en charge de l'initialisation du player, alors le Player risque d'être considéré comme étant une publicité. |
| Intégrer le Player via un autre script en charge de générer des publicités | Si le script qui a chargé le Player ou la librairie du Player charge aussi des éléments publicitaires, alors le player risque d'être considéré comme étant une publicité également. |
Si un de vos scripts est catégorisé comme étant un script publicitaire par Google Chrome, alors toute requête ou injection d'éléments DOM gérée ou dépendant de ce script peuvent être également catégorisée comme étant des éléments publicitaires.
Dailymotion recommende de suivre les bonnes pratiques mises en place par Chrome, ainsi que les bonnes pratiques disponibles sur sa documentation Player. Ainsi nous vous recommendons d'initialiser le Player (sa librairie ainsi que son contenu) directement, sans dépendre d'autres scripts ou éléments pouvant être considérés comme étant une publicité.
Comment voir si mon intégration pose problème pour Heavy Ad ?
Nous considérons comme "script publicitaire" tout script pouvant entrer en conflit avec la Chrome ads detection list (aussi appelée EasyList) ou tout script en charge d'initialiser le player tout en ayant en charge l'impression d'éléments publicitaires.
Pour vérifier si votre intégration peut-être impactée par les règles d'Heavy Ad vous devrez vérifier si votre Player est initialisé à partir d'un script publicitaire.
Dans ce guide, vous allez apprendre comment filter des informations via votre console développeur, vérifier les scripts en charge d'initialiser le Player et inspecter en détail ces scripts si besoin.
Pour ce tutoriel, vous aurez besoin :
- D'utiliser Google Chrome.
- De désactiver tous vos bloqueurs de publicité
- Accéder à une page de votre site ayant intégré le lecteur Dailymotion
Configurer votre console de développeur
Premièrement, vous allez avoir besoin de configurer la console de développeur intégrée à Google Chrome et la filtrer pour commencer votre diagnostic
- Ouvrez une nouvelle page sur Google Chrome
- Ouvrez les options développeur, avec la touche F12 ou via un clic droit sur votre page Google Chrome puis cliquez sur "Inspecter"
- Cliquez sur le filtre "Network"
- Filtrez les éléments en cliquant sur le filtre "Doc" et, dans la console de développeur, marquez dans la barre de recherche "Dailymotion.com"
Inspecter le chargement du Player
Maintenant que votre console de développeur est prête, vous allez devoir vérifier les scripts exécutés pour charger le lecteur sur votre site avec les étapes suivantes :
- Allez sur une page de votre site ayant le lecteur Dailymotion intégré
- Quand la page va se charger, votre console de développeur devrait afficher un résultat, cliquez dessus.
- Sur le panneau qui vient de s'ouvrir, cliquer sur le filtre " Initiator ".
Ce filtre va lister tous les scripts qui se sont exécutés pour charger le lecteur Dailymotion dans un ordre antéchronologique. Nous vous invitons à vérifier tout script inconnu avec votre équipe technique en utilisant les méthodes décrites dans le chapitre suivant.
Analyser les scripts
Si vous avez détecté des scripts inconnus, vous allez pouvoir avoir des informations complémentaires en utilisant le filtre Sources via les étapes suivantes :
- Cliquez sur "Sources", sélectionnez le menu "..." et cliquez sur "Open file"
- Une barre de recherche va s'ouvrir, ici remplissez le nom du script apparu dans l'étape précédente
- La barre de recherche va se remplir automatiquement en fonction de votre recherche, et vous allez pouvoir trouver le fournisseur du script
- En cliquant sur le nom du script, vous pourrez naviguer dans celui-ci et analyser sa fonction.
Si ce script semble être en charge de la gestion de la publicité sur vos domaines, cela veut dire que le script peut être identifié et ciblé comme une publicité par Google Chrome
Sachez que vous pouvez contacter votre Content Manager ou le Support si vous avez une intégration spécifique, ou si vous avez besoin d'aide supplémentaire pour investiguer la source des interventions Heavy Ad sur votre site.
Suivi du côté client avec la Player API
Il est possible de suivre les interventions Heavy Ad au sein du lecteur en utilisant la Player API. Cette information est exposée en tant qu'event 'PLAYER_HEAVYADSINTERVENTION' et peut être facilement utilisé avec nos dernières méthodes d'intégration.
Une fois cet évènement suivi de votre côté, vous pourrez ensuite suivre le nombre d'interventions Heavy Ad sur vos lecteurs, et voir comment corriger votre intégration.
Pour plus d'informations, consultez le code ci-dessous ou un exemple depuis notre blibliothèque Codepen
dailymotion
.createPlayer('myPlayer', {
video: 'x6feo7b',
})
.then((player) => {
player.on(window.dailymotion.events.PLAYER_HEAVYADSINTERVENTION, ({
playerHeavyAdsInterventionReports
}) => {
console.log('PLAYER_HEAVYADSINTERVENTION', playerHeavyAdsInterventionReports)
})
})
.catch((e) => console.error(e))