La Fibre
Télécom => Télécom => 
Veille technologique => Discussion démarrée par: vivien le 22 octobre 2024 à 22:58:21
-
Choix des polices de caractères : avec ou sans empattement ?
Le choix de la police d’écriture est très important, il va définir l’apparence de tous vos textes.
7 grandes familles de polices de caractères (ou polices d’écriture) existent :
- Polices avec empattements (serif) 📖
- Polices sans empattement (sans différences entre I et l 💔)
- Polices sans empattement (avec différences entre I et l ❤️)
- Polices à espacement fixe (chasse fixe) 📏
- Polices manuscrites, en licence ouverte 📜
- Polices décoratives 🆎
- Polices avec des émojis en couleurs 🌈
Qu'est-ce qu'un empattement ?
(https://lafibre.info/images/tuto/conseils_polices_de_caracteres_serif_et_sans-serif.svg) Les empattements (ici en rouge) proviendraient de la trace laissée par la plume ou le pinceau lors de l’écriture. Il y a un siècle, les empattements étaient systématiquement utilisés, et les rares polices sans empattement étaient considérées comme des « polices grotesques ».
Polices avec empattements
On conseille historiquement d’utiliser une police avec empattements dans le corps d’un texte long, car les « extensions » en fin de caractères permettent en effet un meilleur confort de lecture. L’utilisation de polices avec empattements est de plus en plus remise en question, et plusieurs acteurs basculent d’une police avec empattements à une police sans empattement.
Les polices avec empattements expriment l’autorité, le professionnalisme, la tradition et le raffinement. Les polices avec empattements sont donc utilisées pour des logos, des documents officiels et pour le corps du texte de nombreux livres.
- Apple utilisait jusqu’en 2001 une police avec empattements, Apple Garamond sur la majorité de ses produits. Exemple :
(https://lafibre.info/images/logo/logo_apple_think_different.svg) - Word 2003 (et les versions plus anciennes) utilisent par défaut une police avec empattements : Times New Roman ;
- LibreOffice Writer utilise toujours aujourd’hui par défaut une police avec empattements : Liberation Serif ;
- Les navigateurs web utilisent encore aujourd’hui une police avec empattements, pour les sites web qui ne spécifient pas la police à utiliser : Google Chrome et Microsoft Edge utilisent Times New Roman quelle que soit la plateforme. Firefox utilise Times New Roman (sous Windows) et Noto Serif (sous Linux) ;
Polices sans empattement
Les polices sans empattement sont idéales lorsque l’espace disponible est réduit : ces polices sont plus lisibles et plus accrocheuses pour l’œil. Les polices sans empattement, plus épurées, traduisent la modernité. Pour les personnes dyslexiques et malvoyantes, il est généralement plus simple de lire une police sans empattement.
- Depuis 2002, Apple utilise désormais une police sans empattement sur ses produits et services : Myriad (depuis Mac OS X 10.2 en 2002), puis San Francisco à partir de 2015 ;
- Depuis 2007, Microsoft Office utilise désormais par défaut une police sans empattement : Calibri (Office 2007 à Office 2021) puis Aptos (Office 2024 et Office 365 à jour) ;
- LibreOffice Calc, Impress et LibreOffice Draw utilisent par défaut une police sans empattement : Liberation Sans ;
- La suite bureautique de Google (Docs, Sheets, Slides et Forms) utilise par défaut une police sans empattement : Arial ;
- Les navigateurs web utilisent une police sans empattement pour leur interface et pour afficher le code source ;
- Le système d’exploitation Windows utilise par défaut une police sans empattement : Segoe UI ;
- Le système d’exploitation Android utilise par défaut une police sans empattement : Roboto ;
- Le système d’exploitation Ubuntu utilises par défaut une police sans empattement : Ubuntu ;
- Les textes (hors logos) diffusés sur les chaînes de télévision sont toujours sans empattement ;
- Les publicités, quel que soit le mode de diffusion, utilisent presque systématiquement des polices sans empattement ;
- La signalisation routière utilise une police de caractère visible à longue distance, sans empattement ;
- La charte graphique de l’Arcep demande l’utilisation d’une police sans empattement : Open Sans sur internet et Now Alt pour les documents imprimés (« Now Alt » est la police « Now » avec une unique différence : le « a » minuscule).
Police à espace fixe
Une police à espacement fixe — également appelée police à chasse fixe, police à largeur fixe ou police non proportionnelle — est une police d’écriture au sein de laquelle chaque lettre et chaque caractère (y compris l'espace) occupe le même espace horizontal que les autres.
_______________
/ C’est utile \
| pour dessiner |
\ en ASCII /
---------------
\
\
.--.
|o_o |
|:_/ |
// \ \
(| | )
/'\_ _/`\
\___)=(___/
-
J'ai été contraint de mettre une image, mais cliquer sur l'image pour ouvrir le fichier PDF. Les liens de téléchargements sont actifs dans le PDF.
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_1.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=3)
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_2.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=4)
-
J'ai été contraint de mettre une image, mais cliquer sur l'image pour ouvrir le fichier PDF. Les liens de téléchargements sont actifs dans le PDF.
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_3a.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=5)
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_3b.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=6)
-
J'ai été contraint de mettre une image, mais cliquer sur l'image pour ouvrir le fichier PDF. Les liens de téléchargements sont actifs dans le PDF.
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_4.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=7)
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_5.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=8)
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_6.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=9)
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_7.avif) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=10)
⇒ Une partie des polices utilisées dans ce document (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.zip) (fichier .zip 4 Mo)
-
Les polices avec empattements expriment l’autorité, le professionnalisme, la tradition et le raffinement.
La charte graphique de l’Arcep demande l’utilisation d’une police sans empattement
Que faut-il en penser? ;D
-
Que l'Arcep évoque plus la modernité ?
Coté site web, c'est très rare de trouver aujourd'hui un site avec une police avec empattement. L'exception à la règle : https://www.lemonde.fr (il y a des empattements sur le site web et la version papier du journal pour le corps du texte).
Là, on en trouve encore de l'empattement, c'est dans ce qui est imprimé (livres, journaux,...) mais ce n'est pas généralisé.
Exemples : Pas d'empattement pour "La République de Seine-et-Marne" dans sa version papier :
(https://lafibre.info/images/dsp/202407_rep77_vert-saint-denis_coupure_fibre.jpg)
Même chose pour "QUE Choisir" en version papier :
(https://lafibre.info/images/bistro/202003_test_que_choisir_anti-virus.png)
On retrouve des empâtements sur tous les vieux documents, comme ci-dessous cette brochure de 1954 de la Compagnie Générale de Constructions Téléphoniques.
Je note toutefois que le logo de la Compagnie Générale de Constructions Téléphoniques (https://lafibre.info/histoire/compagnie-generale-de-constructions-telephoniques/) est sans empattement.
(https://lafibre.info/images/histoire/195400_compagnie_generale_de_constructions_telephoniques_03.webp)
-
Suis-je le seul à trouver que les polices "sans-serif" provoquent parfois des ambiguités dans la lecture, par exemple entre le chiffre 1, le l minuscule et le I majuscule notamment ?
(je sais, je suis vieux et j'ai une mauvaise vue) ...
Pour la lecture d'un texte, on interprète comme il faut sans difficultés, mais en informatique, c'est pénible.
-
Oui.
Certaines polices sans-serif, comme Luciole (police Française) ont corrigé ce problème : https://www.luciole-vision.com/
-
- Apple utilisait jusqu’en 2014 une police avec empattements, Apple Garamond sur la majorité de ses produits ;
Alors non, ils ont arrêté Garamond a la sortie de Mac OS 10.2 pour passer sur Myriad. Donc plutôt 2002
-
Myriad était utilisé sur le système Mac OS 10.2 ?
Wikipedia (page Typographies d'Apple (https://fr.wikipedia.org/wiki/Typographies_d%27Apple)) mentionnait uniquement sa promotion :
En 2002, Apple a commencé à glisser progressivement vers la famille de polices Apple Myriad, pour son marketing et le conditionnement du matériel.
Campagne "Think Different" d'Apple en 1997, avec la police Apple Garamond :
Regarder la vidéo (1 min / 3 Mo - s'ouvre dans un nouvel onglet)
(https://lafibre.info/videos/logiciels/199700_apple_think_different_vf.avif) (https://lafibre.info/videos/logiciels/199700_apple_think_different_vf.webm)
-
Oui :
(https://pix.milkywan.fr/8bKwoZUr.png)
https://arstechnica.com/gadgets/2002/09/macosx-10-2/#page-2
-
Merci. J'ai corrigé mon premier message (le PDF sera corrigé ce soir).
-
Outre la simplification visuelle, une des raisons pourquoi les empattements ont perdu en popularité est que les écrans ont une définition limitée. Or, les empattements bénéficient beaucoup d'un DPI élevé pour être représentés de manière précise. (Après tout, les polices de caractères utilisées sur Amiga/DOS/Windows 3.x dans les années 80/90 n'avaient presque jamais d'empattements.)
Les écrans à DPI élevé tardent encore à se devélopper en dehors des smartphones et Macs, donc je ne les vois pas faire un retour de si tôt. Pour les titres qui sont écrits plus gros, c'est moins problématique car ils ont davantage de pixels pour être représentés.
-
Suis-je le seul à trouver que les polices "sans-serif" provoquent parfois des ambiguités dans la lecture, par exemple entre le chiffre 1, le l minuscule et le I majuscule notamment ?
(je sais, je suis vieux et j'ai une mauvaise vue) ...
Pour la lecture d'un texte, on interprète comme il faut sans difficultés, mais en informatique, c'est pénible.
Tu as bien raison, c'est assez systématique et vraiment lamentable. >:(
Je ne comprends pas comment des gens dont c'est le métier en arrivent à faire (presque) toujours la même erreur évidente. Une bonne raison de ne pas apprécier les polices sans serif habituelles.
Je note que Verdana, Trebuchet et Tahoma ne souffrent pas de ce problème.
-
J'ai revu mon classement des polices sans empattement : Il y a maintenant celles qui ne font pas de différences entre I et l et celles qui font ces différences, avec un empâtement rajouté au I ou au l.
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_2.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=4)
-
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_3a.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=5)
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_3b.webp) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=6)
-
(https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement_7.avif) (https://lafibre.info/images/tuto/polices_de_caracteres_avec_ou_sans_empattement.pdf#page=10)
-
Comment insérer un émoji facilement sous Windows ?
Ces émojis sont des simples caractères Unicode, il est possible de les utiliser dans n’importe quelle application qui utilise du texte et qui est suffisamment moderne pour accepter des caractères Unicode.
La table de caractère Unicode peut contenir plus d’un million de caractères, là où l’ASCII était limité à 128 ou 256 caractères. Cela a permis de stocker les caractères des langues étrangères à l’anglais, mais également des émojis.
Sous Windows, il suffit d’appuyer sur la combinaison de touche « Windows » + « ; » simultanément :
(https://lafibre.info/testdebit/windows11/202410_windows11_emoki_raccourci_clavier.webp)
Une fenêtre s'ouvre pour rajouter un émoji, quelle que soit votre application.
Cela fonctionne même avec le bloc-note, car c'est un caractère UTF-8 :
(https://lafibre.info/testdebit/windows11/202410_windows11_emoki_bloc-notes.webp)
Comment insérer un émoji facilement sous Mac ?
Appuyer sur la combinaison de touche « Fn » + « E » ou « 🌐 » + « E », ou choisir le menu « Édition » puis « Émoji et symboles ».
Pour voir les différentes couleurs de peau d’un émoji, cliquer sur l’émoji dans le visualiseur et maintenir le bouton de la souris enfoncé.
Pour gagner du temps, si vous connaissez l’émoji, vous pouvez saisir un mot ou une expression décrivant l’émoji directement dans votre logiciel, comme « cœur » ou « pouce en l’air », puis utiliser la combinaison de touche « Fn » + « E » ou « 🌐 » + « E ».
-
Comment insérer un émoji facilement sous Linux ? (Gnome)
Une application est pré-installée sur les distributions basées sur Gnome, comme Ubuntu : Caractères
(https://lafibre.info/testdebit/ubuntu/202410_ubuntu_gnome_caracteres_1.webp)
En lançant Caractères, on arrive sur une fenêtre qui permet de choir très naturellement son émoji UTF-8.
Quand on clique sur un émoji, on peut copier le caractère pour le remettre dans n'importe quelle application qui accepte du texte en entrée.
(https://lafibre.info/testdebit/ubuntu/202410_ubuntu_gnome_caracteres_2.webp)
-
Cela fonctionne bien sûr sur le forum.
Voici ci-dessous un message texte, sans aucune image.
Émoticônes et émotions
🤓 😇 🥰 🤪 🥵 🥳 😸 😻 🙀 🙈 💞 💋 💚 💦
Personnages et corps
👋 👋🏻 👋🏽 👋🏿 🫶 🫱🏻🫲🏾 💅🏻 🦶🏿 🧠 🫀 👅 👶 🧒🏼 👱🏾
Animaux et nature
🐒 🦍 🦮 🦄 🐦 🐧 🐞 🦠 🌻 🌷 🌳 🌵 🍂 🪺
Nourriture et boisson
🍉 🍌 🥖 🫕 🍿 🧂 🎂 🍼 🍾 🍻 🫗 🧊 🍽️ 🏺
Voyages et lieux
🌍 🏝️ 🏡 🏗️ 🗼 🌃 🎢 🚈 🚔 🪂 🕠 🌜 ⚡ 🌈
Activités
🎄 🧨 🎉 🎁 🥇 🏀 🤿 🎯 🔫 🎮 🃏 🖼️ 🎨 🪡
Objets
🩳 🥾 👑 💍 📻 📲 🪫 💻 📷 📚 💶 ✒️ 🧲 🛋️
Symboles
🚮 🚸 📵 ☢️ 🔀 🔆 ♀️ ❓ ⚕️ ✅ 📛 🔟 🆓 🟣
Drapeaux
🏁 🚩 🎌 🏳️ 🏳️🌈 🏴☠️ 🇦🇶 🇲🇫 🇾🇹 🇪🇺 🇺🇳 🇵🇼 🇳🇵 🏴
La représentation des émojis varie selon la police de caractère utilisée (c'est même en noir et blanc sur de vieux PC) mais le dessin représente toujours la même chose.
Utilisée dans un PDF, la police de caractère est intégrée, la représentation sera donc toujours la même.
Attention, les vieux traitements de textes sont incapables de gérer correctement les émojis Unicode (il arrive aussi qu'ils gèrent les émojis Unicode dans leur interface, mais que lors de l'export PDF, ils soient absents).
-
Au final quelle police de caractère choisir ?
Voici quelques éléments pour faire un choix.
1/ Cas d'un document qui doit passer par plusieurs ordinateurs sans voir la mise en page qui change
Dans un traitement de texte, un logiciel de présentation ou un tableur ou un mail, la police n'est pas intégrée : Il faut que la police sélectionnée soit disponible sur chaque ordinateur qui lit le document. Dans le cas contraire, une autre police sera utilisée, ce qui peut changer la mise en page.
Il faut donc choisir une police installée sur tous les ordinateurs :
- Sans empattements : Arial (Windows) ou sa version 100% compatible Liberation Sans (Linux, cette dernière à la même largeur des lettres, même espacement qu'Arial). Coté mac, on a Helvetica, identique à Arial. Utiliser ces polices garantit que votre mise en page ne bougera pas d'un millimètre chez votre correspondant. Si vous n'avez pas la contrainte de lisibilité multi-ordinateur, il faut préférer une police plus élégante comme Open Sans.
- Avec empattements : Times New Roman (Windows) ou sa version 100% compatible Liberation Serif (Linux) ou Times (macOS).
- Espacement fixe : Courier New (Windows) ou sa version 100% compatible Liberation Mono (Linux) ou Courier (macOS).
Sous Linux, le système utilise souvent un mécanisme appelé Fontconfig. Si un document réclame une police et que vous ne l'avez pas, Linux est souvent configuré pour substituer automatiquement une police jumelle.
2/ Cas d'une application disponible dans de nombreuses langues
Les polices Noto sont une famille de polices de caractères libres publiée par Google depuis 2012 sous la licence Apache 2.0. Objectif : couvrir la totalité des caractères Unicode.
- Sans empattements : Noto Sans.
- Avec empattements : Noto Serif.
- Espacement fixe : Noto Sans Mono.
Le nom Noto vient de "No Tofu". Le "tofu", ce sont ces petits rectangles blancs (□) qui s'affichent lorsqu'un ordinateur ne reconnaît pas un caractère (souvent dans des langues étrangères). La couverture linguistique des polices Noto est tout simplement imbattable (visuellement harmonieux à travers des centaines de langues et de scripts : Latin, Grec, Cyrillique, Arabe, Chinois, etc.).
-
3/ Et si on crée un PDF depuis son ordinateur, en restant sur un alphabet latin ?
L'avantage du format PDF est qu'il permet d'intégrer les polices de caractères. Le fichier PDF (surtout si c'est un PDF/A) doit contenir absolument tout ce qui est nécessaire pour l'afficher, sans dépendre d'aucune ressource externe. Il est interdit de compter sur les polices installées sur l'ordinateur.
Il est donc possible d'utiliser des polices qui ne sont pas sur tous les PC.
Un choix intéressant : Open Sans.
Open Sans a été pensée dès le départ pour offrir une lisibilité exceptionnelle sur les écrans comme sur le papier. C'est une police sous licence ouverte, créée en 2010 par Steve Matteson sur une commande de Google. Open Sans possède une apparence ouverte, ronde et très neutre, tout en restant plus chaleureuse que des polices très rigides comme Arial ou Liberation Sans. Open Sans a des ascendantes et descendantes hautes, ce qui rend la lecture très confortable même en petite taille sur un smartphone et est adapté pour des documents marketing ou des présentations professionnelles.
Open Sans a plusieurs "graisses" (épaisseur du trait), toujours en restant sans empattements :
- Open Sans Light (Graisse 300) : Très fine, élégante et aérée. Elle laisse beaucoup de "blanc" autour des lettres. Elle est magnifique en très grande taille (par exemple sur une page d'accueil de site web). Design minimaliste : Elle donne un aspect "haut de gamme" et moderne. Évitez de l'utiliser pour du texte de petite taille, car elle devient difficile à lire, surtout sur les écrans de faible résolution.
- Open Sans Semi-Bold (Graisse 600) : Plus épaisse que la version standard, mais moins imposante que la version grasse.Idéale pour hiérarchiser une page sans "étouffer" le lecteur. Elle attire l'œil tout en restant élégante. Souvent utilisée pour les menus de sites web.
- Open Sans Bold (Graisse 700) :Affirmée, solide et très lisible. C'est le "gras" classique.Pour faire ressortir un mot important au milieu d'un paragraphe.
- Open Sans Extra-Bold (Graisse 800) : Massive et percutante. Elle "crie" presque sur le lecteur. Utilisée pour les prix barrés, les "PROMO" ou les chiffres clés dans une présentation. Peut être utilisé pour un titre principal qui doit captiver l'attention en une fraction de seconde.
- Open Sans Condensed (Étroite) : Les lettres sont compressées en largeur (plus hautes que larges). Parfaite pour les étiquettes de tableaux, les graphiques complexes ou les barres latérales (sidebars).
(https://lafibre.info/testdebit/ubuntu/202605_police_caractere_open_sans.webp)
Installation de la police Open Sans : (elle n'est pas pré-installée)
- Sous Windows : Rendez-vous sur Google Fonts - Open Sans (https://fonts.google.com/specimen/Open+Sans). Cliquez sur le bouton "Get font" puis "Download all" pour obtenir un fichier ZIP. Sélectionnez tous les fichiers .ttf, faites un clic droit et choisissez "Installer" (ou "Installer pour tous les utilisateurs").
- Sous macOS : Rendez-vous sur Google Fonts - Open Sans (https://fonts.google.com/specimen/Open+Sans). Cliquez sur le bouton "Get font" puis "Download all" pour obtenir un fichier ZIP. Double-cliquez sur les fichiers de police, ce qui ouvrira l'application Livre des polices, puis cliquez sur "Installer la police".
- Ubuntu / Debian / Mint : sudo apt install fonts-open-sans
- Fedora / Red Hat / AlmaLinux / Rocky Linux : sudo dnf install open-sans-fonts
- Arch Linux / Manjaro : sudo pacman -S ttf-opensans
- OpenSUSE : sudo zypper install google-opensans-fonts
- Gentoo : sudo emerge media-fonts/open-sans
Quelques points à savoir sur l'intégration de police dans un PDF :
- Subsetting : Microsoft Office et LibreOffice intègrent les polices dans les PDF créés, mais au lieu d'inclure tout le fichier de la police (qui peut être lourd), le logiciel n'intègre que les caractères que vous avez réellement utilisés (Subsetting). Exemple : Si vous n'avez pas utilisé le caractère "Z", il ne sera pas dans le fichier. Si une personne cherche à modifier le PDF et qu'elle n'a pas la police sur son ordinateur, elle ne pourra pas ajouter de nouveaux caractères. Le Subsetting est également autorisé en PDF/A. Une police comme Noto Sans peut contenir des dizaines de milliers de caractères pour couvrir des dizaines de langues. Intégrer la police complète dans chaque PDF rendrait les fichiers énormes. Le subsetting permet de ne garder que les quelques dizaines de caractères nécessaires.
- DRM : Certaines polices ont des licences restrictives qui interdisent leur intégration. Dans ce cas, le PDF utilisera une police de substitution (souvent moche) chez le destinataire.