Les formats de bannières display qui convertissent (les 5 qui comptent)

Un ami à moi tient une entreprise de nettoyage auto à domicile. Il avait créé une belle publicité — un carré 1080×1080, une photo du produit, trois lignes de texte, un bouton — et l'avait chargée dans Google Ads comme visuel display. Google l'a acceptée, l'a diffusée environ quatre cents fois en une semaine, et puis plus rien.

Le problème ne venait pas de la publicité. Il venait de ce que les formats de bannières display forment un monde à part, et qu'un carré pensé pour les réseaux sociaux ne couvre qu'une infime portion de l'inventaire. La plupart des emplacements publicitaires du web ne sont pas carrés. Ce sont des bandeaux étroits en haut d'un article de presse, des colonnes verticales le long d'un blog de recettes, ou de petits pavés coincés entre deux paragraphes. Si vous n'avez pas de visuel taillé pour l'emplacement, vous n'avez pas l'emplacement.

Ce qui compte vraiment : savoir quels formats produire, et pourquoi chacun réclame une mise en page différente plutôt que la même mise en page écrasée.

Les cinq formats de bannières display qui valent la peine

Le Réseau Display de Google accepte techniquement des dizaines de formats. Vous n'avez pas besoin de dizaines. Ces cinq-là couvrent l'écrasante majorité des emplacements disponibles :

Format	Nom	Où il s'affiche
300×250	Medium rectangle	Dans l'article, en colonne latérale. Le cheval de bataille.
336×280	Large rectangle	Mêmes emplacements, légèrement plus grand. Souvent un meilleur CTR.
728×90	Leaderboard	En haut des pages desktop.
300×600	Half page	Colonne latérale desktop. Immense surface, fort engagement.
320×100	Large mobile banner	En bas des pages mobiles.

Produisez ces cinq-là et vous êtes couvert. Ajoutez le 160×600 (wide skyscraper) et le 970×250 (billboard) plus tard si le cœur vous en dit, mais ils relèvent de la longue traîne.

Deux contraintes qui font trébucher : le fichier doit rester sous les 150KB, et le texte ne devrait pas dépasser environ 20 % du cadre si vous voulez qu'il se lise proprement à ces tailles. La seconde n'est plus une règle imposée, mais elle reste un bon conseil — c'est ce qui sépare une bannière d'un mur de texte.

La règle du message unique

Voici ce qui sépare une bannière qui fonctionne d'une bannière qui ne fonctionne pas : une bannière display a droit à un seul message. Pas trois. Un.

Votre publication sociale, elle, peut respirer. Elle a une légende, on peut faire défiler, la personne est déjà à moitié engagée quand elle la voit. Une bannière display se trouve dans la vision périphérique de quelqu'un qui lit tout autre chose. Vous avez peut-être une seconde d'attention, et dans cette seconde-là, la personne peut absorber exactement une idée plus un bouton.

Alors avant d'ouvrir le moindre outil de design, écrivez cette ligne unique. Pour l'entreprise de mon ami, la gagnante n'était pas « Services professionnels de nettoyage auto à domicile — intérieur, extérieur, traitement céramique — réservez en ligne dès aujourd'hui ». C'était :

On se déplace jusqu'à chez vous. $89.

Voilà. Le prix, l'argument qui différencie, six mots. Tout le reste — la vente additionnelle du traitement céramique, la zone d'intervention, les avis cinq étoiles — a sa place sur la page de destination, pas dans un pavé de 300×250.

Pourquoi on reconstruit chaque format au lieu de le redimensionner

C'est la partie que tout le monde rate, moi compris pendant longtemps. Vous ne pouvez pas prendre une seule mise en page et l'étirer dans cinq formes. Un 300×250 et un 728×90 ont presque la même surface mais des proportions diamétralement opposées, et une composition qui marche dans l'un est illisible dans l'autre.

300×250 (medium rectangle) s'empile à la verticale. Bandeau image en haut, titre en dessous, bouton en bas. En gros : 40 % d'image, 35 % de texte, 25 % de bouton et d'air. Titre autour de 22–26 px. C'est le plus proche d'une mini-affiche.

728×90 (leaderboard) bascule à l'horizontale et abandonne presque tout. Logo à l'extrême gauche, titre au centre, bouton à l'extrême droite. Une seule ligne de texte, 20 px environ. Il n'y a pas de place pour une ligne de soutien — si vous insistez, les deux lignes finissent trop petites pour être lues à distance. Coupez.

300×600 (half page) est celui qui offre de la vraie place. C'est là que vous pouvez vous permettre une véritable photo, un titre, une ligne de soutien et un bouton avec des marges généreuses. Ne le remplissez pas bord à bord simplement parce que vous le pouvez — c'est le vide qui lui donne l'air soigné plutôt que l'air d'une bannière de 2011.

320×100 (mobile banner) est un leaderboard comprimé. Logo, titre court, bouton. Ici, votre titre doit tenir en quatre mots maximum : à 100 px de haut sur un écran de téléphone, tout ce qui dépasse devient une tache grise.

336×280 est un 300×250 avec un peu plus d'air. Même composition, typo un peu plus grande, marges un peu plus larges. C'est le seul qui soit vraiment un simple redimensionnement.

Remarquez ce qui change d'un format à l'autre : le nombre d'éléments de texte. Six mots dans le leaderboard, douze dans le half page. Même message, mais pas la même dose.

Le contraste, parce que ces bannières s'affichent au milieu du chaos

Votre bannière va se poser sur une page que vous ne contrôlez pas, à côté d'une photo que vous n'avez pas choisie, sur un fond peut-être blanc, peut-être gris foncé. Deux conséquences en découlent :

Donnez-lui une arête nette. Une bordure de 1 px, ou un aplat de fond dont on voit clairement la limite. Les bannières qui se fondent dans le fond de la page passent pour un morceau du site et se font ignorer comme du simple décor.

Rendez le bouton évident. Aplat de couleur, fort contraste avec tout ce qui l'entoure, vraie forme de bouton. Ce n'est pas l'endroit pour un bouton fantôme tout en subtilité. Si vous posez du texte sur une photo dans la bannière, les règles habituelles s'appliquent — j'ai écrit sur comment rendre un texte lisible sur une photo, et chaque ligne vaut double en 300×250.

Construire la série dans Ridvay Studio

Voici le déroulé concret. Commencez par le medium rectangle : c'est le format que vous diffuserez le plus, et réussir le message en 300×250 impose la discipline qui rendra les quatre autres faciles.

Tapez ceci dans Studio :

Crée une bannière display 300x250 pour un service de nettoyage auto à domicile. Fond bleu marine foncé, un bandeau photo en haut montrant une voiture impeccable, titre en gras « On se déplace jusqu'à chez vous », prix « $89 » en grand chiffre d'accentuation, et un bouton plein et vif « Réserver » en bas. Sans-serif gras, fort contraste, aucun encombrement.

Ce qui revient n'est pas une image plate qu'il faudrait régénérer pour la modifier. C'est un design éditable : le titre est un calque de texte, le prix est son propre calque, le bouton est une forme avec son propre remplissage, le bandeau photo est un élément image interchangeable. Et ça compte encore plus que d'habitude ici, puisque vous vous apprêtez à en construire quatre variantes.

Faites ensuite ces modifications :

1. Cliquez sur le titre et poussez la taille vers le haut jusqu'à ce qu'il occupe presque toute la largeur. En 300×250, l'erreur la plus fréquente est une typo trop polie. Remplissez l'espace.
2. Recolorez le bouton avec la couleur la plus vive de votre marque, pas avec la cousine du fond. Conformément à la section sur le contraste ci-dessus : il doit donner l'impression de ne pas appartenir à la page sur laquelle il atterrit.
3. Supprimez la ligne de soutien s'il y en a une. Un seul message. Si l'IA vous a glissé un sous-titre expliquant la zone d'intervention, coupez-le. C'est exactement ce qui rendra la version leaderboard impossible.
4. Appliquez votre Brand Kit pour verrouiller le logo, les polices et la palette avant de dupliquer. C'est cette mise en place faite une fois qui fera passer les quatre formats suivants de une heure à cinq minutes — le guide pas à pas du Brand Kit explique tout.

Pour les quatre autres formats, dupliquez le design, changez les dimensions du canevas, puis refaites la mise en page : déplacez le bandeau image vers la gauche pour le leaderboard, supprimez le texte de soutien, réancrez le bouton. Ne redimensionnez pas. Ridvay se charge du changement de canevas ; vous vous chargez des vingt secondes de réagencement qui le rendent réellement lisible. C'est le même réflexe que pour adapter un design à chaque réseau social, avec des contraintes plus serrées.

Exportez chaque version en PNG, vérifiez que chaque fichier reste sous les 150KB, et chargez la série.

Créez votre première bannière 300×250 →

Ce qui s'est passé ensuite

Mon ami a chargé cinq formats au lieu d'un. Les impressions sont passées de quelques centaines par semaine à quelques milliers — non pas parce que la créa était devenue meilleure, mais parce qu'il est soudain devenu éligible à des emplacements qui lui étaient fermés. Toute l'astuce est là. La publicité display récompense la couverture, et la couverture est un problème de design avant d'être un problème d'enchères.

Si vous menez aussi la même campagne en publication native dans un fil, c'est un tout autre métier — concevoir une publicité social media qui convertit donne les règles de ce côté-là.

Sinon : écrivez votre ligne unique, construisez le 300×250, reconstruisez-le quatre fois. Le travail d'une soirée, et c'est la différence entre exister sur le web et exister dans un seul coin du web.

Lancez votre série de bannières dans Studio →