L’essentiel en bref
- Les bannières publicitaires animées efficaces suivent en général un court storyboard en trois images : une accroche, la proposition de valeur, puis la marque et l’appel à l’action.
- La dernière image d’une bannière animée doit fonctionner seule, car beaucoup de régies limitent la durée ou le nombre de lectures de l’animation.
- Les formats display courants incluent 300×250, 728×90, 300×600, 160×600 et 320×50 pixels.
- Les bannières animées sont généralement livrées en paquets HTML5 ou en GIF, et les régies imposent des limites de poids strictes pour les deux.
- Le mouvement d’une bannière doit attirer l’œil une fois, puis laisser les mots immobiles assez longtemps pour être lus.
Sur cette page
Les bonnes bannières publicitaires animées utilisent le mouvement pour accrocher l’œil une fois, puis s’effacent devant le message. La structure fiable tient en trois images : une accroche, la proposition de valeur, et une image finale avec la marque et un appel à l’action clair qui reste à l’écran. Gardez la séquence courte, faites en sorte que cette dernière image fonctionne seule comme une publicité fixe, et gardez un fichier léger, car les régies limitent à la fois la durée de l’animation et le poids du fichier.
Le storyboard en trois images
Les bannières se voient en passant, à côté de ce que le lecteur est réellement venu chercher. Personne n’attend la fin d’une bannière. Préparez la séquence pour que chaque image ait du sens seule et que leur ordre raconte une toute petite histoire.
- 1
Image 1 : l’accroche
Une ligne courte ou une image frappante. Son seul rôle est de faire regarder. « Votre bureau, plus calme. » Deux à trois secondes.
- 2
Image 2 : la valeur
Ce que vous proposez, dans les mots du lecteur. « Des goulottes de câbles pour tous les bureaux. » Deux à trois secondes.
- 3
Image 3 : l’image finale
Logo, offre en bref et appel à l’action en forme de bouton. « Voir la gamme. » Cette image reste jusqu’à l’arrêt de la publicité.
Première image : une accroche en quatre mots sur une couleur en mouvement. Rien d’autre ne lui fait concurrence.
L’image finale : marque, valeur et appel à l’action ensemble. Si c’est tout ce que l’on voit, la publicité fonctionne quand même.
Le même storyboard fonctionne pour les publicités sociales, qui sont souvent de courtes vidéos plutôt que des bannières. Le design de publicité Facebook et le design de publicité Instagram couvrent ces formats.
Rythme et boucles des bannières animées
Beaucoup de régies et d’éditeurs limitent la durée de l’animation et le nombre de boucles, et ces limites varient. Google Ads, par exemple, limite les publicités animées importées à 30 secondes d’animation. Vérifiez la spécification en vigueur de chaque régie que vous utilisez, et concevez la publicité pour qu’elle se termine sur son image la plus forte, quelle que soit la limite.
Durée
Règle
Durée
Règle
Durée
Règle
Durée
Règle
Durée
Règle
Formats standard de bannières publicitaires
Les réseaux display utilisent un ensemble de formats standard. Une campagne en couvre généralement plusieurs : concevez donc un système plutôt qu’une publicité, une mise en page qui se réorganise pour les emplacements larges, hauts et petits en gardant les mêmes mots, la même couleur et le même mouvement.
Pavé
300 × 250
Demi-page
300 × 600
Skyscraper large
160 × 600
Leaderboard
728 × 90
Bannière mobile
320 × 50
Ce qui y tient
Ce qui y tient
Ce qui y tient
Ce qui y tient
Ce qui y tient
GIF ou HTML5 pour les bannières animées
La plupart des réseaux display acceptent les publicités animées en GIF ou en HTML5, un petit paquet de HTML, CSS, JavaScript et images. Le HTML5 offre un mouvement plus fluide, un texte net à toutes les densités et toutes les couleurs, et convient aux publicités plus riches. Le GIF est plus simple à produire et accepté presque partout, mais sa limite de 256 couleurs crée des bandes dans les dégradés. Les limites de poids sont serrées pour les deux, mesurées en kilo-octets plutôt qu’en méga-octets, donc vérifiez la spécification de chaque régie.
Si vous choisissez le GIF, les techniques des GIF animés réduisent le poids : moins d’images, une palette construite à partir de l’animation et aussi peu de surface en mouvement que possible. Pour le mouvement lui-même, un easing cohérent sépare une bannière soignée d’une bannière saccadée.
Les règles de design qui font fonctionner une bannière
À éviter
- Quatre ou cinq images de texte
- Un petit texte sur un mouvement rapide et chargé
- Le logo seulement sur la première image
- Un style d’animation différent pour chaque élément
- Une image finale sans appel à l’action clair
À faire
- Trois images, quelques mots chacune
- Un grand texte sur une couleur lente et calme
- La marque sur l’image finale qui reste
- Un seul style de transition du début à la fin
- Un appel à l’action en forme de bouton sur la dernière image
Un fond singulier est le moyen le moins cher d’être reconnu sur toute une campagne. Quand le même champ de couleur bouge derrière chaque image et chaque format, les gens associent le mouvement à vous avant de lire un mot. Testez des variantes de l’accroche plutôt que de la publicité entière ; le test de créations publicitaires explique comment le faire équitablement.
Gradiently convient au volet social d’une campagne. Concevez l’accroche et l’image finale sur un Mark qui vous appartient, déclinez en 1080×1080, 1080×1350 et 1080×1920 en une étape avec Pro, et exportez chacun en MP4. Le Mark est rendu pour chaque format, donc sa zone calme reste derrière les mots à toutes les tailles.
Les questions qu’on nous pose
Quelle durée pour une bannière publicitaire animée ?
Une lecture d’environ 6 à 10 secondes convient à la plupart des bannières. Beaucoup de régies limitent la durée totale d’animation, Google Ads à 30 secondes pour les publicités animées importées, donc vérifiez la spécification de chacune.
Combien d’images doit avoir une bannière animée ?
Trois est une structure fiable : une accroche, la valeur et une image finale avec la marque et l’appel à l’action. Plus d’images signifie généralement plus de mots que personne ne lira.
Quelles sont les tailles de bannières publicitaires les plus courantes ?
300×250, 300×600, 160×600, 728×90 et 320×50 pixels font partie des formats display les plus utilisés. Commencez par le 300×250 et adaptez les autres à partir de lui.
Bannière animée en GIF ou en HTML5 ?
Le HTML5 offre un mouvement plus fluide et un texte plus net, et convient aux publicités riches ; le GIF est plus simple et accepté presque partout, mais crée des bandes dans les dégradés. Les deux doivent respecter la limite de poids de la régie.
Que doit montrer la dernière image d’une bannière ?
La marque, l’offre en bref et un appel à l’action clair, mis en page pour que l’image fonctionne comme une publicité fixe complète si l’animation s’arrête là.
Écrit par Gradiently
L’équipe derrière Gradiently, un outil de création construit autour des Marks : des dégradés vivants qui donnent à tout ce que vous créez votre propre signature.
Voir notre profil