Intégration HTML5 native
On code chaque bannière à la main. Pas de redimensionnement automatique. Chaque format est produit individuellement, avec le bon code pour le bon rendu.
La production display, c’est plus que de l’animation
Formats IAB, specs de régies, contraintes de poids, compatibilité DCO, rich media… La bannière display ressemble à quelque chose de simple. Ce n’en est pas un. Notre studio le sait depuis 2004.
Une bannière mal produite, ça ne passe pas
Les régies publicitaires ont des exigences précises : poids maximum, formats acceptés, types d’animations, durées, comportements au clic… Une bannière qui dépasse 150 Ko est refusée. Une animation qui boucle après 30 secondes aussi.
Produire des bannières HTML5, c’est connaître ces contraintes avant de commencer, pas les découvrir à la livraison. C’est ce que vingt ans de production display nous ont appris.
Notre savoir-faire technique
Bannières animées avancées
Transitions fluides, synchronisation, effets cinétiques. GSAP pour le contrôle fin, CSS3 pour les animations légères, After Effects pour les séquences complexes exportées en HTML.
Optimisation du poids
150 Ko pour Google Ads, 200 Ko pour certaines régies. On optimise les images (WebP, sprites), on réduit le JS et on précharge. La bannière passe ou on ne livre pas.
Rich media
Expandables, interstitiels, skins et formats fullscreen. Une connaissance précise des specs et une maîtrise des interactions JavaScript.
DCO
Un gabarit HTML structuré, alimenté par un flux de données externe, que la plateforme instancie à la volée. On les conçoit flexibles, robustes et compatibles programmatique.
Déclinaisons à grande échelle
50 formats IAB à partir d’une maquette ? On industrialise avec méthode, en maintenant la cohérence visuelle sur l’ensemble du kit.
Notre environnement de production
On choisit l’outil en fonction du format et de la régie cible, pas l’inverse.
| Outil | Usage |
|---|---|
| HTML5 / CSS3 | Structure et style |
| JavaScript | Interactions |
| GSAP | Animations fluides |
| Google Web Designer | Formats GMP-compatibles |
| Photoshop / Illustrator | Préparation des assets |
| After Effects | Animations complexes (export HTML) |
| Ocedrive | Visualisation et validation multi-formats |
Comment on produit une campagne
-
Analyse du kit créatif
On vérifie : les assets sont-ils aux bonnes dimensions ? Les polices intégrables ? Les specs de poids atteignables ? On identifie les problèmes avant de commencer.
-
Préparation des assets
Export au bon format, compression, sprites et versions retina si le format l’exige.
-
Production format par format
Chaque format est codé individuellement. On ne redimensionne pas mécaniquement un 300×250 en 728×90 : chaque format mérite son propre traitement.
-
Tests de comportement
Animation, clics, chargement, boucle, expansion/retrait pour le rich media. On vérifie tout, dans le navigateur et via les outils de preview des régies.
-
Vérification du poids
Chaque fichier est pesé. Si un format dépasse le seuil, on optimise jusqu’à passer, sans dégrader le rendu.
-
Livraison sur Ocedrive
On centralise tous les formats pour validation. Quand tout est validé, on livre les fichiers finaux packagés.
Ce que l’expérience change
- Les specs changent : ce qui passait hier peut être refusé demain. On fait de la veille.
- Chaque régie a ses bizarreries : DV360, Google Ads, Xandr… On connaît les particularités de chacune.
- La vitesse ne s’oppose pas à la qualité : avec des process éprouvés, on livre vite et bien.
- Les gabarits, ça se conçoit : un bon template DCO demande une réflexion en amont.
On connaît leurs specs
Autre régie ? On analyse les specs et on s’adapte.
| Régie / Plateforme | Format |
|---|---|
| Google Ads / DV360 | HTML5 standard + rich media |
| Meta (Facebook/Instagram) | Social Display |
| Amazon Ads | Display + rich media |
| Criteo | Dynamic retargeting |
| Xandr (ex-AppNexus) | Formats standards et rich |
| Régies locales et privées | Sur analyse |
Nos références
Questions sur notre façon de travailler
Pourquoi coder chaque format à la main ?
Les outils automatiques produisent du code lourd et traitent le redimensionnement comme un problème de pixels, pas de mise en page. Un 300×250 et un 728×90 n’ont pas la même hiérarchie visuelle. En codant à la main, on adapte la composition à chaque format.
Qu’est-ce qu’un gabarit DCO exactement ?
Un fichier HTML avec des variables balisées (titre, image, prix, CTA) que la plateforme instancie à la volée selon le contexte. On le conçoit robuste à toutes les combinaisons de données, y compris les cas limites.
Comment optimiser le poids sans dégrader le rendu ?
Compression WebP, sprites pour les assets répétés, minification du JS, suppression des frames inutiles et optimisation GSAP. On itère jusqu’à atteindre le seuil cible.
Rich media ou format standard ?
Un format standard reste dans son emplacement. Le rich media en sort : il s’expand, prend l’écran, se superpose. Plus complexe à produire, soumis à des specs spécifiques.
Utilisez-vous Google Web Designer ?
Oui, pour les formats DV360 ou Google Ads qui l’exigent. Pour les autres régies, on code directement en HTML5 / JS pour un contrôle total.
Une campagne display à produire ?
Vous voulez comprendre notre façon de travailler, ou vous avez une campagne à produire ? On en parle.