Bénéfice 1 :
Les polices de caractères de la famille sans-sérif (aussi appelées "sans empâtement") offrent une lecture généralement plus confortable sur des écrans d'ordinateur ou de périphériques portables.
Bénéfice 2 :
La police de caractère par défaut n'est pas la même sur tous les systèmes d'exploitation. C'est pourquoi il est souhaitable d'indiquer au navigateur la police à utiliser préférentiellement afin d'être compatible sur l'ensemble des plateformes. Ainsi, un internaute qui navigue sur le même site avec des moyens de consultation différents, gardera le même confort de lecture.
Valeur ajoutée pour le site
Bénéfice 1 :
L'utilisation des polices sans sérif permet de fournir un confort de lecture à peu près égal sur l'ensemble des plateformes et systèmes d'exploitation.
Si l'information de mise en page est présente dans le code source, vérifier le contenu des balises FONT.
Si l'information de mise en page est uniquement présente dans les feuilles de style, relever l'adresse de la feuille de style utilisée telle qu'elle est définie dans un élément LINK dans la balise HEAD, et l'ouvrir dans un éditeur texte.
Contrôler l'ensemble des familles de police déclarées pour chaque élément, et définies par "font-family : ".
Par l'utilisation d'outils
Pour une liste complète des outils utilisés pour évaluer l'accessibilité des pages web, et un résumé de leurs principales fonctionnalités, reportez-vous à la page Outils d'aide à l'évaluation.
Evaluer avec la barre AccessiWeb (version 1.0) :
Sous Internet Explorer, ouvrir la page à analyser.
Dans le menu "10. Présentation de l'information" de la Barre AccessiWeb, activer le critère 10.6.
La(es) feuille(s) de style de la page sont listée(s) dans une nouvelle fenêtre. Pour éditer la(es) feuille(s) de style, cliquer sur le lien correspondant précédé par la balise LINK.
Pour chaque élément (balises, classes identifiant), repérer ceux qui comportent l'attribut font-family.
Vérifier que la liste des polices déclarées correspond à celles de la famille sans sérif et surtout que la valeur "sans-serif" est bien la dernière valeur de la liste.
Evaluer avec la barre d'accessibilité AIS pour Internet Explorer (version 1.2 en français) :
Cliquer sur le menu "CSS", puis sur l'option "Montrer la feuille de style [Nouvelle fenêtre]".
Une nouvelle fenêtre s'affiche. Elle représente le contenu de la première feuille de style (s'il y en a plusieurs utilisées). Pour visualiser les autres feuilles de style éventuellement déclarées, se rendre sur les adresses indiquées en bas de cette première fenêtre.
Pour chaque élément (balises, classes identifiant), repérer ceux qui comportent la propriété "FONT-FAMILY :".
Vérifier que la liste des polices déclarées correspond à celles de la famille sans sérif et surtout que la valeur "sans-serif" est bien la dernière valeur de la liste.
Evaluer avec la Barre d'Outils Web Developper pour Firefox (version
1.0.2 en français) :
Activer l'option "Voir les CSS" du menu "CSS".
Une nouvelle fenêtre s'affiche. Elle représente le contenu de l'ensemble des feuilles de style (s'il y en a plusieurs utilisées).
Pour chaque élément (balises, classes identifiant), repérer ceux qui comportent l'attribut "FONT-FAMILY :".
Vérifier que la liste des polices déclarées correspond à celles de la famille sans sérif et surtout que la valeur "sans-serif" est bien la dernière valeur de la liste.
Evaluer avec le lecteur d'écran Jaws (version 5 et 6.2 en français) :
Ce critère n'est pas évaluable par le lecteur d'écran Jaws.
Le graphiste ainsi que le développeur doivent veiller au respect de ce critère.
Implémentation
Dans la feuille de style par exemple, placer la police préférentielle en premier puis une police plus généralement répandue, éventuellement d'autres choix de polices et enfin, la famille de polices sans sérif.
exemple :
body {font-family : verdana, arial, sans serif }
Exemple de mauvaise pratique
Lorsque le navigateur tente d'appliquer des polices de caractères, il procède par élimination. Si la première police déclarée n'est pas trouvé sur le poste de l'utilisateur, il recherche la suivante. Si la seconde n'est pas trouvée, non plus, il recherche la suivante, et ainsi de suite. La dernière police de caractères mensionnée doit donc être celle à utiliser par défaut si aucune des polices précédente n'est trouvée. Dans les exemples qui suivent, la police "sans-serif" ne pourra jamais être appliquée :
body { font-family: "times new roman", times, serif }
ou
body { font-family : verdana; }
Exemple de bonne pratique
Il est important de déclarer la famille de police "sans-serif" comme dernière entrée, mais de fournir également un jeu de polices appartenant à cette famille de manière explicite :
body { font-family : verdana, arial, helvetica, sans-serif; }