les formats de publicité sur le web : jpg, gif, normes
Tout d’abord, petite explication : sachez que sur Internet, tout est a priori possible à faire…. techniquement. C’est bien la raison pour laquelle il faut mettre en place quelques règles de fonctionnement pour que tout le monde s’y retrouve.
les formats de Fichier Pro
Les professionnels de la publicité se sont tout de suite penché sur la question, et on créé des standards de format web. L’objectif : pouvoir quantifier les volumes d’impression (le nombre de fois où une publicité dans un format particulier a été affichée sur la page web), et donc être en mesure de calculer ou estimer les coûts de ces investissements.
Les professionnels de la pub ont ainsi imposé des formats, que nous listons ci-dessous :
- La bannière classique : 468*60.
Ce format horizontal (468 pixels de large pour 60 pixels de haut) est l’un des premiers à être apparu sur le Net. Mais la tendance étant à faire toujours plus gros, il est de moins en moins utilisé, au profit d’autres.
- La megabanner : 728*90 :
c’est un format qui est encore très prisé par les communiquants et que l’on retrouve sur les sites internet. Toutefois, depuis quelques années, les sites les plus gros semblent s’en détourner et la megabanner prend le même chemin que la précédence bannière classique.
La megabanner extra large : son format dépend de la largeur des sites, vous devez donc demander les formats exacts à votre interlocuteur. Pour Concertlive.fr, le format est 960*120. Le principe de la megaxl est de s’étendre sur toute la largeur du site. Hors, les innovations graphiques et techniques permettent aux sites d’être plus originaux dans ces formats.
- Le pavé : 300*250.
Il s’agit d’un format rectangle qui est le plus souvent placé sur la colonne de droite des sites, au dessus de la ligne de flottaison (avant de scroller la page avec l’ascenseur).
- Skyscraper :
au départ il était en 120*600 puis en 160*600. C’est donc un format vertical (skyscraper veut dire gratte ciel en anglais). Force est de constater que ce format a tendance à disparaitre.
- Les formats expand :
Comme le nom l’indique « expand » veut dire « étendre ». Pour faire simple et sans entrer dans des considérations techniques que vous vous ferez un plaisir de laisser à votre webmaster, l’Expand banner est une bannière « classique » qui va « s’étendre » (sur la largeur, ou hauteur) en fonction d’une action du lecteur (passer la souris au dessus de l’image, cliquer sur l’image…). Technique, il s’agit d’un script qui est inclus dans le code de votre fichier, qui lui-même contient votre image et votre lien.
Inconvénients de ces formats : plus difficile techniquement (surtout pour les non techniciens). Le format peut « bugger » puiqu’il y a un petit programme (script) qui est lu par votre navigateur : le problème étant que tous les navigateurs (firefoxe, safari, explorer, chrome) ne réagissent pas de la même manière. Autre point soulevé par les pros de la pub : il peut ralentir la page, ou apparaitre comme intrusif pour l’internaute.
- Interstitiel :
c’est une format (en général pleine page) qui s’affiche entre deux pages web (d’un clic à un autre), ou à l’ouverture d’une page (première visite). En général l’affichage de ce format est « capé » à une visite, ce qui évite à un internaute de se sentir harcelé à chaque fois qu’il clique sur une page lors de sa visite sur le site. Dans certains cas, il est possible de mettre une image, une vidéo…
- L’habillage :
le principe de l’habillage est de placer une image de fond sur le site. L’effet visuel est très impressionnant, et le lecteur peut en plus cliquer sur l’image… et donc arriver sur votre « produit ».
Quelle résolution et poids pour la bannière ?
La résolution, pour faire simple, c’est la « taille » de votre image, qui aura un impact sur son « poids » et sur sa qualité. Pour les formats web, les photos et autres visuels sont toujours en 72 dpi. C’est la résolution la plus optimisée pour les pages sur Internet, qui permettent à la fois un affichage de qualité, et aussi un temps de chargement rapide.
En effet, si vous mettez en ligne une photo de haute résolution en 300 dpi, votre image sera certes de bonne qualité, mais vous aurez un « poids » trop élevé qui impactera négativement le temps de chargement de la page. Cela est une mauvaise chose car vous ralentissez le site, et le temps de chargement de la page. De quoi faire fuir le lecteur impatient qui ne supporte pas d’attendre plus de deux secondes pour voir une page s’afficher.
Faut-il utiliser le flash, le jpg ou le gif ?
- Le Flash ( non conseillé)
C’est le format le plus complexe et le plus risqué. Tout d’abord pour créer un fichier en flash vous devez avec le logiciel adequat, maîtriser le logiciel… et ne pas faire d’erreur ! Trop souvent ,les fichiers flash sont « buggés » avec des liens qui ne fonctionnent (le lien est inclus dans le fichier pour les flash), ou alors l’image tronquée… DE plus, pour le suivi des clics depuis les adservers (les outils qui permettent de gérer les campagnes publicitaires pour les éditeurs de sites internet), sont souvent ignorés.
Côté positif : le flash, c’est beau, élégant… Attention, toutefois ! N’oubliez pas que de plus en plus de lecteurs consultent les sites depuis une tablette ou smartphone et que les systemes d’exploitations Android et iOS (Apple) ne lisent pas le flash. Vous vous priverez sans doute de près de 60% des lecteurs du site, car c’est en moyenne le taux de fréquentation sur mobile des sites web.
- Le Jpeg :
ce format est le plus précis pour les images. Il a le mérite de conserver la résolution optimale, même à 72 dpi. Vous pouvez cliquer sur l’image directement, un lien url n’est pas inclus dans l’image mais ajouté dans le code html du site qui héberge le format.
Inconvénient à ne pas négliger : le jgep ne peut pas être une format animé. Votre image sera donc statique, ce qui est un handicap pour faire « cliquer » et pour donner plus de message et de call to action à votre lecteur.
- Le Gif :
Certes, la qualité du visuel est un peu moins bonne sur pour le jpg, mais le gif a l’avantage immense d’être un format animé. Vous pouvez, avec l’aide d’un logiciel tel que Photoshop, créer une « animation » avec un nombre illimité d’images. Le gif animé est une succession d’images, qui s’enchainent selon un rythme que vous pourrez choisir.
Risque : pas plus de trois images s’il vous plaît ! Attention à l’effet sapin de Noël, qui est tout à fait rédhibitoire pour les internautes. Les sites éditeurs peuvent même refuser votre format qui va nuire à leur image de marque.
- Le Png ( la star du web )
Il est particulièrement approprié lorsqu’il s’agit d’enregistrer des images synthétiques destinées au Web comme des graphiques, des icônes, des images représentant du texte (bonne conservation de la lisibilité), ou des images avec des dégradés. Le PNG surpasse régulièrement le format GIF en ce qui concerne la réduction de la taille des fichiers (avec une palette de couleurs bien choisie) ou la qualité (puisqu’il n’est pas limité à 256 couleurs)
Lorsque l’image PNG utilise une palette de 256 couleurs maximum, il est possible d’utiliser une des couleurs pour la transparence.
C’est le même comportement qu’avec le format GIF et cela fonctionne même avec Internet Explorer 6. Par conséquent, les images Web au format GIF peuvent être converties en cette version de PNG sans crainte d’incompatibilité avec la majorité des navigateurs web actuels (premier trimestre 2006), et sans souci de brevet (le brevet GIF est tombé en 2006 dans le domaine public)
- Et le PDF ? (interdit)
Oubliez le Pdf, Tiff, et autre PSD, ESP… Le PDF est un format « print ». Il est totalement inexploitable pour le web dans ce type de besoin. Les autres formats sont utilisés par les graphistes dans leurs projets. Oubliez également pour le web.
Quel poids pour la bannière web ?
Vous l’aurez compris, le « poids » de la bannière est important pour le site qui hébergera votre bannière. L’usage est de ne pas dépasser 50 ko (kilo octets) selon les normes IAB. Essayez de faire au mieux lorsque que vous enregistrez votre fichier pour le web, afin de conserver la plus grande qualité visuelle et alléger le fichier au maximum. Si vous n’êtes pas graphiste, les fonctions de vignettes sur Photoshop dans « enregistrer pour le web » vous seront très utiles.
Pour en savoir plus sur les formats vous pouvez télécharger sur le site de l’IAB un pdf qui regroupe les différents formats et des exemples.
Formats de publicité sur le web : source + actualisation du sujet lobo-graphik pour la partie PNG via wiki : http://www.concertlive.fr/focus/comprendre-formats-publicite-web-jpg-gif-normes-iab-8524750
formats de publicité
formats de publicité