Navigation principale

Pratiques exemplaires relatives à la mise en ondes d'éléments graphiques

But

 

Le présent document a pour but de fournir des directives concernant les pratiques exemplaires relatives à la mise en ondes de texte et d’éléments graphiques sur AMI-télé. Ces directives visent à permettre aux personnes aveugles ou malvoyantes au sens de la loi de bien saisir le sens et la portée du texte et des éléments graphiques pertinents présentés à l’écran. Ces pratiques exemplaires n’ont pas pour objectif de restreindre la créativité ni la variété esthétique des éléments graphiques présentés en ondes, mais de proposer des choix de conception inclusifs. Le présent guide doit être considéré comme un document « vivant » qui continuera d’évoluer.

 

Portée

 

Les directives et considérations énoncées dans le présent document s’appliquent à l’ensemble du texte et des éléments graphiques diffusés sur AMI-télé. Elles doivent être utilisées en conjugaison avec les exigences de marque décrites dans le Guide de style d’AMI.

 

Méthode

 

Le présent document repose sur les recherches effectuées et les normes édictées par les Règles pour l’accessibilité des contenus Web (WCAG 2.0). Les sections pertinentes ont été adaptées pour tenir compte des différences de nature entre le contenu Web et le contenu télévisé.

 

Exemptions

 

Le texte et les éléments graphiques purement décoratifs, qui ne sont pas visibles ou qui ne contiennent aucune information pertinente sont exemptés des présentes directives.

 

Le texte et les éléments graphiques faisant partie d’un logo ou d’un nom commercial sont exemptés des présentes directives.

 

Les exigences légales concernant par exemple les crédits ou autres éléments qui ne contiennent aucune information pertinente pour le téléspectateur sont exemptées des présentes directives.

 

Les crédits sur les programmes sont exemptés des directives détaillées dans la partie Durée.

 

Taille

 

Le texte présenté à l’écran doit avoir une taille d’au moins 48 pixels (voir la remarque 1 pour les détails).

 

Contraste

 

Le texte et les éléments graphiques contenant de l’information pertinente doivent présenter un rapport de contraste d’au moins 4,5:1, selon la luminance relative (voir la remarque 2 pour les détails).

 

Durée

 

La durée minimale pendant laquelle le texte et les éléments graphiques doivent demeurer à l’écran sans obstruction est égale à la durée nécessaire à une personne moyenne pour lire le texte ou décrire le contenu d’un tableau ou autre représentation graphique d’information.

 

Police

 

Le texte permettant de transmettre le contenu ou l’information doit recourir à des polices utilisant des caractères reconnaissables. Les polices décoratives ou fantaisie présentant des lignes excessivement fines, des caractéristiques inhabituelles ou des proportions qui réduisent l’aspect familier des caractères peuvent nuire à la lisibilité et sont à éviter. Il est également important de veiller aux valeurs de crénage, d’alignement et d’interlignage du texte. Si ces valeurs sont trop faibles, les lettres risquent de se mêler les unes aux autres et d’être difficiles à distinguer. À l’inverse, si elles sont trop importantes, les lettres des mots semblent flotter, ce qui nuit également à la lisibilité.

 

Obscurcissement et transitions

 

Les effets graphiques ou transitions qui obscurcissent la lisibilité du texte ou des éléments graphiques doivent s’effectuer en dehors de ceux-ci. La durée d’apparition du texte doit être mesurée pendant que celui-ci n'est pas obscurci.

 

Techniques recommandées

 

Texte et éléments graphiques sur un arrière-plan à motif ou animé

 

Le texte et les éléments graphiques sur un arrière-plan à motif ou animé peuvent s'avérer moins lisibles. Dans un tel cas, des précautions particulières doivent être apportées pour préserver l’accessibilité. L’augmentation de la taille, du contraste et de la durée peut ainsi améliorer la lisibilité.

 

Changements de perspective

 

Le texte et les éléments graphiques dont la perspective a été modifiée peuvent s’avérer moins lisibles. Cela inclut la rotation, l’inclinaison, ainsi que les effets 3D. Dans un tel cas, des précautions particulières doivent être apportées pour préserver l’accessibilité. L’augmentation de la taille, du contraste et de la durée peut ainsi améliorer la lisibilité.

 

Contour/bordure

 

Un contour ou une bordure autour d’une lettre peut augmenter le contraste entre le texte et son arrière-plan. Un contour étroit autour d’une lettre sera considéré comme faisant partie du texte, alors qu’un contour large qui remplit les détails entre les lettres et forme un halo sera considéré comme faisant partie de l’arrière-plan. Le rapport de contraste minimal s’applique également.

Ombres portées

 

Dans certains cas, les ombres portées peuvent augmenter le contraste et la lisibilité (en particulier sur un fond à motif ou animé), mais également les réduire dans d'autres situations. Dans un tel cas, des précautions particulières doivent être apportées pour préserver l’accessibilité. L’augmentation de la taille, du contraste et de la durée peut ainsi améliorer la lisibilité.

 

Texte mobile

 

Le texte qui se déplace pendant sa durée d'affichage peut s’avérer moins lisible, car le téléspectateur éprouve davantage de difficultés à effectuer la mise au point. Tout mouvement de texte, par exemple défilement ou redimensionnement, pendant la durée d’affichage doit être lent et modéré. Dans un tel cas, des précautions particulières doivent être apportées pour préserver l’accessibilité. L’augmentation de la taille, du contraste et de la durée peut ainsi améliorer la lisibilité.

 

Alignement

 

Lorsqu’un texte se poursuit sur plusieurs lignes, l’alignement à gauche facilite la lecture, car l’axe vertical à gauche constitue un point de départ commun pour chacune des lignes. Lors de l’affichage de phrases ou de paragraphes de plusieurs lignes, l’alignement à gauche doit être privilégié.

 

Polices pour les textes longs

 

Lors de l’affichage de phrases ou de paragraphes de plusieurs lignes, le texte entièrement en majuscules doit être évité. Bien que cette technique puisse aider à mettre en évidence certains points dans des segments plus courts ou dans des titres, cela nuit à la lisibilité dans des segments plus longs.

 

 

 

Luminance élevée ou flashs rouges saturés

 

Bien que cette technique ne soit pas directement reliée à l’accessibilité pour les personnes ayant une déficience visuelle, elle est importante pour les personnes qui pourraient être sujettes à des crises d’épilepsie dues à la photosensibilité. Les flashs ou les éclairs stroboscopiques qui occupent plus de 25 % de l’écran et qui présentent une différence de luminance élevée ou un clignotement rouge saturé ne doivent pas dépasser un rythme de 3 éclairs par seconde ni une durée de 5 secondes (voir la remarque 3 pour les détails).

 

Remarques

 

Remarque 1 : Les WCAG 2.0 qualifient le texte d’une taille d’au moins 18 points (pt) de « texte agrandi ». En animation graphique, l’unité utilisée pour mesurer la taille du texte est le pixel (px). Or 1 point équivaut approximativement à 1,333 px. Ainsi, 18 pt correspondent environ à 24 px. Aux États-Unis, le service de la santé et de la sécurité au travail (Occupational Safety and Health Administration) du ministère du Travail a établi à 20 pouces (environ 50 cm) la distance minimale à laquelle une personne devrait s’asseoir devant un écran d’ordinateur, et une étude du NPD DisplaySearch a constaté que la taille moyenne d’un écran d’ordinateur était de 20 à 21 pouces. Le rapport entre taille et distance est donc d'environ 1:1. Best Buy recommande par ailleurs un rapport minimal entre taille et distance d’environ 1,5:1 pour les téléviseurs HD et de 2,4:1 pour les téléviseurs SD. Pour prendre en compte le plus grand nombre possible de téléspectateurs, nous avons fixé le rapport minimal moyen entre taille et distance à environ 2:1. Lorsqu’on applique ce rapport à la taille en pixels du « texte agrandi », cela donne un minimum de 48 pixels.

 

Remarque 2 : Les WCAG 2.0 fixent le rapport de contraste en fonction de la luminance relative à au moins 4,5:1 pour le « texte agrandi », afin d'assurer la conformité avec le plus haut niveau possible, soit AAA. Les personnes ayant des problèmes de perception des couleurs distinguent difficilement les nuances; un contraste de luminance élevée peut y remédier, car il est indépendant de la perception des couleurs.

 

Remarque 3 : Le niveau AAA des WCAG 2.0 exige que les flashs ne dépassent pas un rythme de 3 flashs par seconde. Ces règles sont basées sur les recherches et les directives de l’Office of Communications de Grande-Bretagne (anciennement ICT : Independent Television Commission). Le document original de l’ITC, ITC GUIDANCE NOTE FOR LICENSEES ON FLASHING IMAGES AND REGULAR PATTERNS IN TELEVISION, est disponible à l’adresse www.ofcom.org.uk.

 

 

Exemples

 

Taille du texte : exemples de tailles de texte relativement à un cadrage en 16:9, du minimum absolu requis jusqu’à 4 fois cette taille.

Source : Accessible Media Inc.

 

Rapport de contraste : exemples de combinaisons de couleurs avec un rapport de contraste qui ne répond pas aux exigences minimales.

 

Rapport de contraste : exemples de combinaisons de couleurs avec un rapport de contraste qui dépassent les exigences minimales.

 

 

Police : exemples de polices aux caractéristiques inhabituelles, difficilement lisibles et qui doivent être évitées.

 

 

 

Police : exemples de polices dont les caractères sont facilement reconnaissables.

 

 

Texte obscurci : exemple de transition d’un texte complètement obscurci en haut à un texte non obscurci en bas.

 

 Source : Accessible Media Inc.

 

Texte sur une séquence filmée : exemple de texte sur une séquence filmée, où un manque de contraste dans certaines zones nuit à la lisibilité globale. Notez le mot « ARCHIE » sur la chemise blanche.

 

 Source : Accessible Media Inc.

 

Changements de perspective : exemples de changements de perspective qui nuisent à la lisibilité du texte.

 

 Source : Accessible Media Inc.

Changements de perspective : exemples de changements de perspective qui ont un effet minime sur la lisibilité du texte.

 

 Source : Accessible Media Inc.

 

Contour : Les exemples 1 et 3 ne répondent pas aux exigences minimales de contraste, contrairement aux exemples 2 et 4.