Normes graphiques
Ce guide de normes graphiques établit les règles d'utilisation des icônes, textes, images et contenus multimédias pour garantir une cohérence visuelle dans les publicités. Il vous permettra de créer une expérience de consultation engageante et optimale pour le lectorat.
Spécification des textes
Un maximum de 100 mots est permis dans une publicité HTML.
Si le texte que vous devez inclure se rapproche du maximum permis, il devrait apparaître entièrement à l’écran, sans que l'interaction bande défilante soit utilisée. Si toutefois vous devez hiérarchiser le message, l’interaction «Toucher» qui permet au lecteur d'accéder au texte par le biais d’une fenêtre surgissante (pop-up), est recommandée.
Si votre publicité doit inclure plus de 100 mots, nous recommandons le produit XTRA qui permet de présenter une plus grande quantité d'informations sous la forme de contenu natif. Informez-vous auprès de votre représentant publicitaire pour en savoir plus.
La taille de vos polices doit avoir un minimum de 14pt ou 19px dans une image de 72ppp. Ceci assure une lisibilité optimale sur tous les modèles de tablettes.
Si vous produisez vos visuels en format Retina, la taille de vos polices devra avoir un minimum de 38 pixels (28 points) afin d'offrir une lisibilité optimale sur le format final.
N’utilisez pas de fraction dans la taille de votre police (ex. : 16,3456 points), car ceci affecte la qualité d'affichage.
Portez une attention particulière à l'utilisation des polices en renversé et à leur contraste. Pour valider la lisibilité de votre publicité, vous pouvez utiliser cet outil→
Favorisez l’épaisseur normale des traits de la police choisie (évitez les traits de caractère trop fins ou condensés).
Favorisez la méthode de lissage « Nette » dans les préférences de Photoshop.
En cas d’utilisation d’une police non standard, il vous est possible d’enregistrer la police sous la forme d’une image dans Photoshop.
Utilisez la technologie CSS
@font-face
afin d’ajouter la police qui vous intéresse.
En savoir plus →Si vous ajoutez une police, seuls les fichiers
.ttf
sont acceptés. Les autres formats (.woff
,.eot
, etc.) doivent être retirés avant l'envoi.En cas d'utilisation d'une police non-standard, notez que le poids de celle-ci sera comptabilisé dans le poids totale permis de votre publicité.
Images
La résolution des images doit être de 72 ppp (pixels par pouce) ou de 28,346 ppc (pixels par centimètre) à 100 % de leur format final.
Consultez l'onglet Image Retina pour optimiser la qualité d'affichage de vos publicités.
Pour une meilleure qualité d'affichage, les images de votre publicité peuvent être fournies en format Retina, soit à 200% du format publicitaire HTML final. (Votre fichier publicitaire final conservera les dimensions de la taille standard; ce sont seulement les dimensions de vos images qui seront doublées.)
Exemple pour un plein écran
Fichier HTML final : 980 x 670 px
Images du dossier Assets : 1960 x 1340 px
Portez une attention particulière à ces éléments :
Taille minimale de vos textes en format retina : 38 pixels
Taille minimale des icônes en format retina : 80 pixels
Quatre types de formats d'enregistrement sont acceptés : PNG
, GIF
, JPG
et SVG
.
Utilisations à privilégier:
PNG
convient mieux à la transparenceGIF
* convient mieux aux couleurs solides, JPG
convient mieux aux images ou aux photos SVG
pour les éléments vectoriels
* Les formats GIF
animés peuvent être intégrés dans votre publicité à condition que l'animation soit déclenchée manuellement par l'utilisateur, via une interaction telle que: touché ou glissé, etc. Les déclenchements automatiques ne sont pas permis pour ces animations dans les formats réguliers de La Presse+.
Lors de l'exportation de vos images ou de vos photos, nous vous demandons de ne pas insérer le profil de couleurs. Celui-ci alourdit vos images et n'est pas compatible avec les tablettes numériques.
Privilégiez le mode de couleur RVB - 8 bits.
Espace de travail colorimétrique : sRGB IEC61966-2.1
Pour optimiser le poids de vos images, sélectionnez Exportation → Enregistrer pour le web
Vidéos
En tout temps, l'icône standard jouer la vidéo doit être utilisée pour démarrer un extrait vidéo. Lorsque l'image sur laquelle l'icône est placée n'offre pas un contraste optimal, nous recommandons l'utilisation de l'icône ayant une pastille grise afin d'offrir une visibilité accrue.
Pour consulter et télécharger notre iconographie →Lorsque l'icône jouer la vidéo ayant une pastille grise est utilisée, sa taille minimale doit alors être de 80px (ou 160px en format Rétina).
L'icône de fermeture de la vidéo doit être placée dans le coin supérieur droit de la vidéo, à l’exception des vidéos intégrées en plein écran.
Lorsque l’option de déclenchement automatique est utilisée (uniquement disponible avec le format plein-écran), la vidéo démarre en sourdine. Les icônes activer le son et couper le son doivent être placées sous le coin inférieur droit de la fenêtre vidéo afin que le lecteur puisse en contrôler l'activation.
IMPORTANT: L’option de déclenchement automatique de la vidéo n’est pas disponible lorsque la publicité est montée avec le logiciel Hype.
Privilégiez une résolution de 1920 x 1080 pixels.
Trois types de formats d'enregistrement sont acceptés :
.MP4
.M4V
.MOV
Spécifications à respecter pour un rendu optimal des vidéos
Format: .mp4
/ 1080p
Bitrate: 3500 kbps
La vidéo sera affichée dans un lecteur HTML5 (tous les lecteurs vidéo personnalisés seront ignorés).
Le lecteur vidéo doit offrir en tout temps un accès aux contrôles permettant d'arrêter ou d'agrandir la vidéo en plein écran.
Code autorisé
<video width="320" height="240" controls></video>
Code non autorisé
<video width="320" height="240" autoplay></video>
Lorsque le lecteur active une publicité comportant une vidéo, celle-ci démarre au sein de la surface publicitaire et ne s’agrandit que si le lecteur sélectionne le bouton permettant le visionnement en format plein écran.
Si le bouton servant à activer la vidéo est situé à l’intérieur d’une boîte graphiquement séparée du reste de la publicité (écran télé, tablette, etc.), la vidéo devrait pouvoir être visionnée au sein de cette boîte et comporter une option permettant au lecteur de l’agrandir.
Pour vos sous-titres, privilégiez le format .VTT
Le contenu de la vidéo doit être en français. Si la vidéo est en anglais, celle-ci doit être sous-titrée en français.
Nous recommandons que chaque publicité contienne un maximum de 3 vidéos, d’une durée maximale de 3 minutes chacune.
Le fichier vidéo qui nous est envoyé ne doit pas dépasser 500 Mo.
Les extraits vidéo sont livrés par l'entremise d'un flux vidéo en continu (streaming) et ne sont pas intégrés à même la publicité. Ils ne sont donc pas disponibles en mode hors connexion.
L'hébergement de votre matériel se fera par l'intermédiaire d'une plateforme multimédia gérée par La Presse.
La vidéo n’est pas incluse dans le poids totale de la publicité.
Audios
Les icônes audio et pause sont requis pour faire jouer et contrôler un extrait audio.
Le format audio compatible est le MP3
.
Les fichiers MIDI
ne sont pas acceptés.
Il n’est pas permis d’utiliser la fonction d'activation automatique.
Le lecteur audio doit offrir en tout temps un accès aux contrôles permettant d'arrêter le segment audio.
Il est possible de personnaliser la façon dont votre segment audio sera mis en marche ou s'arrêtera au moyen d'éléments graphiques tels que les boutons de lecture et d'arrêt. Dans un tel cas, nous vous recommandons de masquer le lecteur HTML5 original display='none'
et d'utiliser les méthodes suivantes :
Démarrer un segment audio :
document.getElementById('audio').play();
Arrêter un segment audio :
document.getElementById('audio').pause();
En raison des nombreux modèles de tablettes sur lesquels l’application La Presse+ est offerte, il est malheureusement impossible de synchroniser parfaitement le déclenchement d'un court extrait audio avec une action donnée des lecteurs.
Un maximum de 3 extraits audio par publicité est accepté.
Les segments audio doivent avoir une durée maximale de 2 minutes.
Les extraits audio de moins de 5 secondes qui accompagnent l’activation d’une autre interaction doivent être indiqués par l'indicateur visuel Audio auquel une transparence d'environ 30 % d’opacité sera appliquée.
Il est interdit d’utiliser la fonction de déclenchement automatique pour les extraits audio.
Les extraits audio de plus de 50 Ko sont livrés par l'entremise d'un flux audio en continu (streaming) et ne sont pas intégrés à même l'annonce. Ils ne sont donc pas disponibles en mode hors connexion.
Les extraits audio ne sont pas inclus dans le poids totale de la publicité.
IMPORTANT: La fonctionnalité Audio du logiciel Hype n'est pas compatible avec l'application de La Presse+
Icônes
Une couleur en aplat et sans transparence peut être appliquée à ces icônes.
Notez que ces icônes doivent avoir une taille minimale de 40px (symbole et cercle inclus).
Une couleur en aplat et sans transparence peut être appliquée à ces icônes.
Notez que ces icônes doivent avoir une taille minimale de 40px (symbole et cercle inclus).
Plateformes de téléchargement d'applications mobiles.
Notez que ces icônes doivent avoir une taille minimale de 40px (symbole et cercle inclus).
Les indicateurs visuels doivent être noirs ou blancs avec une transparence d'environ 30 % d'opacité.
Notez que ces icônes doivent avoir une taille minimale de 65px.
Notez que ces icônes doivent avoir une taille minimale de 40px (symbole et cercle inclus).
Le diamètre des points de galerie doit se situer entre 7 et 15 px pour offrir une visibilité optimale.