WRInaute passionné
Depuis l'affaire du blocage AdBlock par défaut avec Free, nous sommes nombreux à perdre de l'argent (quelque soit la somme, même très modeste) avec les dispositifs AdBlock ou "Stop bannières" qui existent. Généralement, seules quelques régies sont visées, en particulier Adsense/Adwords, quelque soit la plate-forme distributrice des pubs Google (DFP, Adexchange ou le réseau simple Adsense). Je suppose que d'autres régies sont également stoppées dans les pubs "display" par ces adblockers.
Je propose ici le développement d'un script (ou plusieurs) et de conseils en développement de sites qui permettraient d'éviter les désagréments, tant en terme de revenus, mais aussi en terme de design!Selon la façon dont les pubs sont intégrées dans le code des pages, leur non-affichage peut, en effet, être désastreux quant à l'aspect, le rendu visuel du site. Ainsi, même si certains souhaitent respecter le choix des visiteurs de ne pas afficher de pubs, ce sujet apportera aussi une réponse à leur problème de rendu visuel, surtout avec la nouvelle "mode" du "responsive design".
Sans se focaliser sur les débordements de Free et de son ingérence dans NOS sites, le principe du double DIV semble une bonne réponse de principe aux divers systèmes Adblocks.
Pour éviter toute panique dans le design, un premier DIV fixe une hauteur minimale avec un css ressemblant à "height:auto;min-height:90px;" pour le cas d'une méga-bannière 728x90. Le min-height n'interdit pas que la hauteur soit plus importante (je pense à certains sites qui affichent des pubs non-standards IADC pour les formats).
Un second DIV va juste encapsuler la bannière afin de disposer d'un identifiant unique*** (de localisation dans la page) pour la bannière et juste fixer la hauteur à auto avec "height:auto;".
La structure d'affichage HTML d'une bannière display en 728x90 devient ainsi (j'adopte le HTML5, pour les stricts XHTML1.1... ils ajouteront toutes les fioritures nécessaires)** :
Maintenant, pour savoir si un emplacement est rempli, il suffit de tester, après chargement de la page, la hauteur de l'identifiant "mapub1". Si cette hauteur est restée à 0 (la valeur par défaut dans tout navigateur grâce à la valeur auto de l'attribut height), c'est que la bannière de pub n'est pas chargée! Est-ce dû à un bloqueur de pub ou un défaut de remplissage du diffuseur, rien ne permet de le détecter sans affiner (très difficilement) les tests de retour.
Si cette valeur reste à 0 (ou inférieur à une valeur pré-définie, comme 89px pour une bannière 90px de haut), c'est simplement qu'aucune bannière n'a été affichée, c'est tout ce qu'on sait.
Certains préconisent des solutions d'expulsion du visiteur, mais finalement, on peut se tromper : certaines régies publicitaires ne servent pas 100% des affichages (c'est même plutôt rare en fait, même AdSense n'atteint pas le 100%). Cela consiste à expulser un visiteur juste parce que la bannière n'a pas été chargée... Pas glops AMHA.
Afin de tester la hauteur de l'identifiant "mapub1", c'est très facile en JQuery (largement implanté dans de nombreux sites, cela ne fera ainsi pas appel à des ressources supplémentaires consommatrices de bande passante) :
Il devient ainsi possible de faire à peu près ce qu'on veut dans le code de traitement : il n'y a pas de bannière à cet emplacement, c'est tout ce qu'implique la hauteur nulle. Il est possible d'expulser le visiteur avec "window.location" ou, moins extrême, de remplir le cadre de bannière avec une autre régie non-censurée, ou même de faire de l'auto-promotion grâce à innerHTML.
Mais c'est là que mon message s'arrête car JQuery et moi, on n'est pas 100% au point!
Pour ceux qui souhaiteraient continuer dans cette voie, je propose les développements suivants :
- gestion du onLoad dans le Body avec, éventuellement, un timer SetTimeOut pour éviter des temps d'attente trop longs en synchrone pour certains scripts.
- remplissage de l'emplacement pub par gestion du innerHTML de l'identifiant.
- possibilité d'affichage d'une pop-up DIV pour indiquer que les publicités initiales sont remplacées par d'autres en raison d'un problème technique (faire un peu de démagogie... sans brutalité et d'éducation, sans vexer les "vrais" utilisateurs de systèmes adblocks). Pour le cas Proxad/Free, il serait possible de proposer des consignes aux Freenautes, ou encore prévenir que l'inscription au site n'est permise qu'en cas d'accord avec la charte du site, incluant l'affichage publicitaire, etc.
- variabilisation de l'identifiant de test : certains bloqueurs de pubs récents fonctionnent par zone et non seulement par gestion des DNS du diffuseur, la zone étant repérée par un identifiant. Si l'identifiant est variable, ces atomiseurs d'emplacement ne peuvent plus travailler aussi sereinement. On peut imaginer un identifiant unique par jour de l'année : exemple = nous sommes le 7 janvier, mon id "mapub1" devient "mapub8" automatiquement, ou un identifiant par session, etc. Un peu de JS et PHP feront l'affaire.
Pour les forts en scripts et surtout en JQuery, à vos claviers SVP... :mrgreen:
** ne pas oublier d'utiliser ces class un peu partout dans le design du site : si un bloqueur de pub vient à travailler sur le nom des class, le site deviendrait vite illisible.
*** surtout avec HTML5, l'identifiant ID doit être unique par page, il faut ainsi en créer autant qu'il y a de blocs à afficher dans une page.
Note, selon la source Wiki sur AdBlock, la popularité du système est telle qu'elle "a dépassé les 175 millions de téléchargements en novembre 2012". On est loin de 1 ou 2 millions d'utilisateurs de Freebox Revolution!
Je propose ici le développement d'un script (ou plusieurs) et de conseils en développement de sites qui permettraient d'éviter les désagréments, tant en terme de revenus, mais aussi en terme de design!Selon la façon dont les pubs sont intégrées dans le code des pages, leur non-affichage peut, en effet, être désastreux quant à l'aspect, le rendu visuel du site. Ainsi, même si certains souhaitent respecter le choix des visiteurs de ne pas afficher de pubs, ce sujet apportera aussi une réponse à leur problème de rendu visuel, surtout avec la nouvelle "mode" du "responsive design".
Sans se focaliser sur les débordements de Free et de son ingérence dans NOS sites, le principe du double DIV semble une bonne réponse de principe aux divers systèmes Adblocks.
Pour éviter toute panique dans le design, un premier DIV fixe une hauteur minimale avec un css ressemblant à "height:auto;min-height:90px;" pour le cas d'une méga-bannière 728x90. Le min-height n'interdit pas que la hauteur soit plus importante (je pense à certains sites qui affichent des pubs non-standards IADC pour les formats).
Un second DIV va juste encapsuler la bannière afin de disposer d'un identifiant unique*** (de localisation dans la page) pour la bannière et juste fixer la hauteur à auto avec "height:auto;".
La structure d'affichage HTML d'une bannière display en 728x90 devient ainsi (j'adopte le HTML5, pour les stricts XHTML1.1... ils ajouteront toutes les fioritures nécessaires)** :
Code:
<style>
.mapub{height:auto;min-height:90px}
.mapubid{height:auto}
</style>
<div class=mapub><div id=mapub1 class=mapubid>
... code bannière ...
</div></div>Maintenant, pour savoir si un emplacement est rempli, il suffit de tester, après chargement de la page, la hauteur de l'identifiant "mapub1". Si cette hauteur est restée à 0 (la valeur par défaut dans tout navigateur grâce à la valeur auto de l'attribut height), c'est que la bannière de pub n'est pas chargée! Est-ce dû à un bloqueur de pub ou un défaut de remplissage du diffuseur, rien ne permet de le détecter sans affiner (très difficilement) les tests de retour.
Si cette valeur reste à 0 (ou inférieur à une valeur pré-définie, comme 89px pour une bannière 90px de haut), c'est simplement qu'aucune bannière n'a été affichée, c'est tout ce qu'on sait.
Certains préconisent des solutions d'expulsion du visiteur, mais finalement, on peut se tromper : certaines régies publicitaires ne servent pas 100% des affichages (c'est même plutôt rare en fait, même AdSense n'atteint pas le 100%). Cela consiste à expulser un visiteur juste parce que la bannière n'a pas été chargée... Pas glops AMHA.
Afin de tester la hauteur de l'identifiant "mapub1", c'est très facile en JQuery (largement implanté dans de nombreux sites, cela ne fera ainsi pas appel à des ressources supplémentaires consommatrices de bande passante) :
Code:
jQuery(document).ready(function(){
if (jQuery('#mapub1').height() == 0) {...code de traitement en js... ou voir si on peut tester un < minheight, plus efficace qu'un 0!}
});Il devient ainsi possible de faire à peu près ce qu'on veut dans le code de traitement : il n'y a pas de bannière à cet emplacement, c'est tout ce qu'implique la hauteur nulle. Il est possible d'expulser le visiteur avec "window.location" ou, moins extrême, de remplir le cadre de bannière avec une autre régie non-censurée, ou même de faire de l'auto-promotion grâce à innerHTML.
Mais c'est là que mon message s'arrête car JQuery et moi, on n'est pas 100% au point!
Pour ceux qui souhaiteraient continuer dans cette voie, je propose les développements suivants :
- gestion du onLoad dans le Body avec, éventuellement, un timer SetTimeOut pour éviter des temps d'attente trop longs en synchrone pour certains scripts.
- remplissage de l'emplacement pub par gestion du innerHTML de l'identifiant.
- possibilité d'affichage d'une pop-up DIV pour indiquer que les publicités initiales sont remplacées par d'autres en raison d'un problème technique (faire un peu de démagogie... sans brutalité et d'éducation, sans vexer les "vrais" utilisateurs de systèmes adblocks). Pour le cas Proxad/Free, il serait possible de proposer des consignes aux Freenautes, ou encore prévenir que l'inscription au site n'est permise qu'en cas d'accord avec la charte du site, incluant l'affichage publicitaire, etc.
- variabilisation de l'identifiant de test : certains bloqueurs de pubs récents fonctionnent par zone et non seulement par gestion des DNS du diffuseur, la zone étant repérée par un identifiant. Si l'identifiant est variable, ces atomiseurs d'emplacement ne peuvent plus travailler aussi sereinement. On peut imaginer un identifiant unique par jour de l'année : exemple = nous sommes le 7 janvier, mon id "mapub1" devient "mapub8" automatiquement, ou un identifiant par session, etc. Un peu de JS et PHP feront l'affaire.
Pour les forts en scripts et surtout en JQuery, à vos claviers SVP... :mrgreen:
** ne pas oublier d'utiliser ces class un peu partout dans le design du site : si un bloqueur de pub vient à travailler sur le nom des class, le site deviendrait vite illisible.
*** surtout avec HTML5, l'identifiant ID doit être unique par page, il faut ainsi en créer autant qu'il y a de blocs à afficher dans une page.
Note, selon la source Wiki sur AdBlock, la popularité du système est telle qu'elle "a dépassé les 175 millions de téléchargements en novembre 2012". On est loin de 1 ou 2 millions d'utilisateurs de Freebox Revolution!
