13 règles d’orthotypographie à connaître pour des contenus web de qualité

PS : ceci n’est pas un cours de français, je suis loin d’être exemplaire dans ce domaine. Mon objectif est plus de vous sensibiliser sur ce sujet que je considère comme important.

Qu’est-ce que l’orthotypographie ?

On appelle orthotypographie l’ensemble des règles de typographie, d’orthographe, de grammaire et de conjugaison à appliquer lors de la composition d’un texte. Elles constituent autant de « repères » garantissant la bonne compréhension et la fluidité de lecture.

La typographie, du livre au web

La typographie est l’art de disposer les lettres écrites en un texte visuellement attrayant et lisible. Elle fait appel à un ensemble de paramètres : la police d’écriture, l’espacement entre les caractères, entre les lignes, et la mise en page.

On a coutume de s’appuyer sur des conventions conçues pour assurer une cohérence linguistique, une facilité de lecture et éviter les ambiguïtés. En France, les recommandations du Lexique des règles typographiques en usage à l’Imprimerie nationale font référence.

Je vous recommande également cette autre référence : Orthotypographie.fr.

Longtemps, ces règles issues du monde du livre étaient parfaitement connues et maîtrisées des seuls imprimeurs, éditeurs ou professionnels de la communication graphique.

Elles n’en demeurent pas moins importantes sur le web, où chacun·e crée des contenus sans forcément toujours bien en tenir compte.

L’internaute ne remarque pas forcément ces « détails » en parcourant vos pages. Pourtant, une forme soignée et constante contribuera à rendre sa lecture agréable tout en reflétant une impression générale de cohérence, de fiabilité et de sérieux.

Les logiciels que nous utilisons le plus souvent pour rédiger nos textes pour le web (Google Docs, Word…) ne sont cependant pas vraiment pensés pour la langue française et ses spécificités typographiques. Il peut s’avérer compliqué d’y appliquer certaines règles, même simples, et d’y être convenablement guidé pour effectuer des corrections.

Les claviers que nous utilisons nous compliquent aussi la tâche. Sur un clavier Azerty, il faut parfois effectuer des combinaisons de touches complexes pour obtenir des caractères pourtant courants en français, comme les majuscules accentuées.

Depuis 2019, il existe une norme AFNOR pour un clavier français, mais celle-ci semble encore peu adoptée par les fabricants.

Le rédacteur amateur est souvent découragé et s’adaptera aux contraintes dictées par ses outils. Le rédacteur professionnel, lui, se doit d’avoir ces règles bien en tête, et de les appliquer pour produire des contenus de qualité.

Pourquoi c’est important ?

En premier lieu, les conventions orthotypographiques font partie du volet « Contenus » des standards de qualité web du modèle VPTCS. Et pour cause : aux yeux de votre lectorat, la forme de vos contenus est aussi importante que le fond.

En tant que rédacteur web professionnel, j’attache aussi de l’importance à ces règles parce qu’elles appartiennent à la langue française, que je m’efforce de respecter. Cette rigueur assure à mes clients des prestations qualitatives.

J’ai également à cœur de rendre le web accessible pour toutes et tous, et respecter ces conventions permet d’éviter des erreurs de restitution par les synthèses vocales.

Enfin, j’aime le travail bien fait, et peut-être aussi me faire des nœuds au cerveau pour des détails que personne ne remarque 🙂

Les principales règles d’orthotypographie

Les règles présentées ci-après sont celles que je considère importante pour l’expérience utilisateur. Il en existe de nombreuses autres, qui sont moins fréquentes.

Espaces et espaces insécables

Il existe deux types principaux d’espaces : celles qu’on qualifie de « variables » (ce sont les espaces les plus communes) et les espaces dites « insécables ».

Ces dernières restent solidaires du mot ou du signe qui les précède et qui les suit, permettant d’éviter des sauts de ligne disgracieux et pénibles à lire.

Voici quelques exemples :

Pas très esthétique, n’est-ce pas ?

Pour éviter ce type de déconvenue, voici un petit rappel des règles d’espacement avec les principaux signes de ponctuation.

Signe de ponctuation	Avant	Après
. (point)	Pas d’espace	Une espace
, (virgule)	Pas d’espace	Une espace
… (points de suspension)	Pas d’espace	Une espace
( ou [ (parenthèse ouvrante ou crochet ouvrant)	Une espace	Pas d’espace
) ou ] (parenthèse fermante ou crochet fermant)	Pas d’espace	Une espace (sauf avant un point)
«  (guillemet français ouvrant)	Une espace	Une espace insécable
» (guillemet français fermant)	Une espace insécable	Une espace
: (deux points)	Une espace insécable	Une espace
; (point virgule)	Une espace insécable	Une espace
? (point d’interrogation)	Une espace insécable	Une espace
! (point d’exclamation)	Une espace insécable	Une espace
% (pourcentage)	Une espace insécable	Une espace

Voici les raccourcis clavier permettant d’insérer une espace insécable :

• Sur PC : Alt + 255
• Sur Mac : Alt ⌥ + Espace

Les signes de ponctuation

Nos claviers ne nous permettent pas toujours de saisir simplement certains signes de ponctuation pourtant courants en français.

Les points de suspension, par exemple, ne sont pas « trois petits points » mais bien un signe de ponctuation à part entière. Si Word les génère automatiquement, ce n’est pas (encore) le cas de Google Docs.

Pour les insérer manuellement :

• Sur PC : Alt + 0133
• Sur Mac : Alt ⌥ + ;

Les guillemets français (« … ») sont à privilégier. Word ou Google Docs utilisent cependant les guillemets anglais (“…”) par défaut.

Vous pouvez paramétrer Word pour que le programme remplace les guillemets anglais par des guillemets français.

1. Dans l’onglet Fichier, cliquez sur Options puis Vérification, puis sur Options de correction automatique.
2. Dans la boîte de dialogue Correction automatique, cliquez sur l’onglet Mise en forme automatique au cours de la frappe.
3. Sous Remplacer, activez la case à cocher Guillemets  » par des guillemets « ».
4. Enfin, cliquez sur OK.

Vous pouvez les insérer manuellement dans Google Docs grâce à ces raccourcis clavier :

• Sur PC : Alt + 0171 et Alt + 0187 pour « et »
• Sur Mac : Alt ⌥ + 7 et Alt ⌥ + Maj + 7

Les signes mathématiques courants

De manière générale, on applique les règles d’usage de la ponctuation dans les textes utilisant des symboles mathématiques.

• On espace donc les chiffres et les symboles courants, on n’espace pas à l’ouverture et à la fermeture d’une parenthèse. Par exemple : (3 + 7) ÷ 2 = 5
• Pour faire apparaître une formule mathématique, on opte de préférence pour un renvoi à la ligne et une justification centrée.
• On utilise des minuscules en italique pour exprimer des variables, des inconnues ou des fonctions : y, x, f…
• En revanche, on les utilise en romain et sans point final pour les opérateurs comme sin, cos, ln, exp… Par exemple : sin (a + b).

Au besoin, voici les raccourcis clavier pour afficher les principaux symboles mathématiques.

Nom du caractère	Aperçu	Raccourci clavier PC	Raccourci clavier Mac
Inférieur ou égal	≤	Alt + 8804	⌥ + ⇧ + <
Égal	=	Alt + 061	⌥ + =
Supérieur ou égal	≥	Alt + 8805	⌥ + <
« Vrai » signe de multiplication	×	Alt + 0215	Dans Palette de caractères : MULTIPLICATION SIGN
Soustraction	–	Alt + 0150	Impossible sur Mac*
Approximation	±	Alt + 0177	⌥ + Maj + =
Fraction un quart	¼	Alt + 0188	Impossible sur Mac*
Fraction un demi	½	Alt + 0189	Impossible sur Mac*
Fraction trois quarts	¾	Alt + 0190	Impossible sur Mac*
Division	÷	Alt + 0247	⌥ + /

* À ma connaissance

Rapporter du discours ou un dialogue

Pour rapporter des citations ordinaires (des mots ou phrases isolés) en style direct, on utilise des guillemets et on conserve la mise en forme du reste du texte.

Par exemple : La cigale « fort dépourvue » est contrainte d’aller chercher secours « chez la fourmi sa voisine ».

La ponctuation, si elle est indissociable de la citation, doit alors être à l’intérieur des guillemets.

Lorsqu’une citation comporte une incise (comme « déclare-t-elle », « pense-t-il » …), on les encadre de virgules à l’intérieur même de la citation entre guillemets.

Par exemple :

Tout comme la mésange charbonnière, elle est bagarreuse, reconnaît Paula Dias, chercheuse et chargée de communication au Centre d’écologie fonctionnelle et évolutive (CEFE) de Montpellier. Quand on la tient dans la main, elle pique de façon très surprenante. Elle est assez teigneuse !

(Source : La mésange bleue, nouvelle alliée contre l’A69)

Pour rapporter un dialogue, on ouvre les guillemets au début de la première phrase, puis on commence chaque réponse par un saut de ligne et un tiret. On ferme les guillemets à la fin.

Par exemple :

— Vous m’avez demandé la permission de fumer dans mon bureau ?
— Puis-je fumer ?
— Non, tu puis-je pas !

Jackie Brown, Quentin Tarantino, 1997

Trait d’union, underscore, tirets et signe moins

Il n’est pas toujours facile de les distinguer et de les utiliser à bon escient ! Faisons le point sur ces différents signes typographiques.

Le trait d’union ou « tiret du 6 » est le plus courant. Accessible sur tous les claviers, on l’utilise pour les noms composés, comme « arc-en-ciel » ou « cerf-volant », ou pour établir une unité lexicale ou grammaticale, comme dans « la guerre 14-18 » ou « le train Paris-Milan ».

L’underscore, « tiret du 8 » ou tiret bas, permettait le soulignement par surimpression avec une machine à écrire. Aujourd’hui, il est utilisé pour remplacer l’espace face à certaines contraintes techniques, par exemple, pour nommer un fichier. On n’utilise pas ce caractère en rédaction.

Il existe plusieurs types de tirets de longueurs différentes. Le tiret cadratin (—) est le plus utilisé :

• Pour encadrer une incise, un élément interrompant la continuité de la phrase.
  
  Par exemple :
  « L’œuvre traduit les sources et les influences de Claudel — Donatello, Cellini, la mythologie gréco-romaine — et révèle les passions qui l’animent : la tête tranchée de la Gorgone est un autoportrait. (Source) »
  
• Dans un dialogue, pour indiquer le changement d’interlocuteur, voir Rapporter du discours ou un dialogue ci-avant.

Pour former un tiret cadratin, utilisez ces raccourcis claviers :

• Sur PC : Alt + 0151
• Sur Mac : Maj + Alt + – (Num)

Le signe moins, quant à lui, n’est réservé qu’aux soustractions et rien qu’aux soustractions ! On le forme avec le raccourci clavier Alt + 0150 sur Windows.

Les majuscules

De nombreuses règles encadrent l’usage des majuscules, et je ne pourrais pas toutes les lister ici. Voici toutefois les plus importantes.

On utilise une majuscule en début de mot pour :

• le mot qui commence une phrase, un vers, une citation ;
• les noms propres, patronymes, prénoms, surnoms et pseudonymes ;
• les noms des peuples, des habitants d’une région ou d’une commune ;
• les noms géographiques et historiques ;
• les noms de voies, lieux-dits et monuments publics ;
• les points cardinaux lorsqu’ils désignent une région et pas une direction ;
• les noms de marques et de modèles ;
• les raisons sociales, les noms de sociétés, d’établissements, d’associations, publics ou privés.

On ne met pas de majuscule :

• aux noms des jours et des mois ;
• aux titres et aux qualités : la ministre, le directeur, la présidente, le pape

Faut-il accentuer les majuscules ?

Ne pas accentuer les majuscules ou les lettres en capitale est une erreur courante, à cause de contraintes techniques : la faute à l’origine anglaise des machines à écrire ! De fait, cette faute est donc plutôt tolérée par l’usage.

Pourtant, le respect de cette règle peut s’avérer nécessaire pour lever toute ambiguïté, comme dans les exemples suivants :

• LE CAMBRIOLEUR TUE DANS SA FUITE ou LE CAMBRIOLEUR TUÉ DANS SA FUITE
• LES RETRAITES ou LES RETRAITÉS
• LE PETIT SALE ou LE PETIT SALÉ
• MAIS OU MAÏS

Voici les raccourcis clavier à connaître pour accentuer les majuscules.

Signe	Windows	Mac
É	[ALT] + 0201	[MAJ] + 2
È	[ALT] + 200	[MAJ] + e
À	[ALT] + 0192	[MAJ] + 0
Ç	[ALT] + 0199	[ALT ⌥] + [MAJ] + ç
Œ	[ALT] + 0140	[ALT ⌥] + [MAJ] + o

Dans Word, vous pouvez automatiser les majuscules accentuées grâce à la manipulation suivante :

Fichiers > Options > Vérification > Cocher Majuscules accentuées en français.

Les abréviations et les sigles

Quelques règles simples sont à retenir :

• Les abréviations formées par le retranchement de la fin du mot prennent un point. Par exemple, cat. pour catégorie.
• Les abréviations se terminant par la dernière lettre du mot ne prennent pas de point. Par exemple, bd pour boulevard.
• Pour les sigles, la règle veut que tout le sigle soit écrit intégralement en majuscules, sans points. Par exemple : APF, CCFD, AFNOR.
  
  Certains sigles connus peuvent se prononcer comme un mot et comportent plus de trois lettres. Dans ce cas, l’usage tolère une majuscule au début du sigle, le reste en minuscules. Par exemple : Unesco, Arcom.
  
  Les sigles devenus des noms communs restent en minuscule. Par exemple : laser, radar.
• Après « etc. », on n’utilise pas de points de suspension, qui induisent une redondance.

Les nombres

Concernant les nombres, les règles sont assez simples :

• Séparateur de décimal : en français, on utilise la virgule et non le point (exemple : 1,5 kg).
• Séparateur de millier : en français, on utilise l’espace insécable et non la virgule (ex : 10 000 personnes).
• Nombres ordinaux : on abrège 1^e, 2^e, 3^e et non 1^er, 2^me, 3^ème.
• Siècles : on utilise des chiffres romains en petites capitales.
• Numéros de téléphone : on regroupe les chiffres par deux, séparés par une espace, sans point ni tiret. Par exemple : 03 20 00 00 00.

En lettres ou en chiffres ?

Selon le type de texte, on optera pour l’une ou l’autre façon d’exprimer les nombres. S’ils sont peu courants, ou dans certains cas spécifiques, comme les actes juridiques ou notariés, on utilise les lettres.

Sur le web, on tend à leur préférer les chiffres, plus lisibles et plus faciles à comparer. Le plus important étant la consistance tout au long du texte.

Les pluriels peu fréquents

Nombres

Les nombres en lettres sont invariables, à l’exception de vingt et cent qui prennent un « s » lorsqu’ils sont multipliés et se trouvent à la fin. Par exemple :

• Cent vingt
• Trois cents
• Quatre-vingts (pour désigner le nombre 80 seul)
• Trois cent vingt deux

On écrit toujours les nombres en toutes lettres lorsqu’ils se situent en début de phrase.

Jours de la semaine

On écrit les jours de la semaine en minuscule, contrairement à l’anglais qui exige une majuscule au début.

Les jours de la semaine s’accordent au pluriel. Par exemple : tous les lundis.

On écrit pourtant « les lundi de chaque semaine », car il n’y a qu’un lundi par semaine, et « les dimanches du mois d’août » puisqu’il y a plusieurs dimanches au mois d’août. En suivant cette logique, on écrit « tous les mercredis matin » !

Couleurs

La règle concernant l’accord des couleurs est la suivante : on les accorde. À moins qu’il ne s’agisse d’un nom commun utilisé comme un adjectif de couleur : il est alors invariable. Il y a bien sûr des exceptions (sinon, ce n’est pas drôle !) : écarlate, fauve, mauve, pourpre et rose s’accordent !

Par exemple : des chaussettes orange, des souliers roses et une robe bleue (quel look !).

Plus subtil : quand deux mots sont employés pour qualifier une seule couleur, ils sont alors invariables tous les deux. Par exemple : les bottines marron foncé, les yeux bleu-vert.

Des conventions propres au web

Si la majorité des conventions sont issues de l’édition, certains cas propres au web méritent qu’on s’y attarde. On ne peut pas vraiment parler de « règles » ici, mais plutôt de « bonnes pratiques ».

Mise en forme générale

Avec l’usage, des conventions spécifiques ont émergé. Par exemple, on réserve le soulignement aux liens, tandis que les capitales servent pour les titres (et parfois, à « crier », comme les grands-parents dans leurs SMS 😉 ).

Globalement, on privilégie l’italique pour effectuer une distinction ou indiquer un mot étranger, par exemple. Le gras, quant à lui, est plutôt réservé aux titres et sous-titres.

Les listes à puces ou numérotées

On considère que les listes à puces constituent une seule et même phrase : elles ne comportent donc pas de majuscules au début de chaque entrée (contrairement à ce que suggèrent souvent différents programmes de traitement de texte).

On peut utiliser un point-virgule, une virgule, ou rien du tout à la fin de chaque entrée, un point final pour la dernière. L’essentiel est de conserver la même façon de procéder tout au long d’un texte, voire sur l’ensemble d’un site ou d’un blog.

(Note à moi-même : penser à vérifier que j’applique bien ce conseil 😅)

Les listes numérotées doivent comporter une majuscule au début de chaque ligne.

Afficher du code

On a pris l’habitude d’afficher du code informatique avec une police à chasse fixe, comme Courrier new. Elles offrent l’avantage d’être très lisibles et permettent au lecteur d’identifier rapidement qu’il s’agit de code.

<p>Ceci est un exemple de code</p>

Écriture inclusive et point médian

Bien que l’écriture inclusive soit plus vaste que l’usage du point médian, elle en est souvent réduite à ce simple signe.

Pour rappel, l’écriture inclusive est un ensemble de techniques graphiques et syntaxiques qui visent à ne plus invisibiliser les femmes dans et par la langue. Le point médian n’est qu’une technique parmi d’autres, généralement utilisée en dernier recours, notamment à cause des problèmes de lisibilité qu’il pose.

Généralement, les techniques utilisées sont les suivantes :

1. Choix de formules épicènes ou englobantes (ex : l’équipe de direction, les internautes, les élèves…).
2. Écriture détaillée (les développeurs et les développeuses, les clients et les clientes), éventuellement couplée à une règle de classement du masculin et du féminin par ordre alphabétique.
3. Accord de proximité, qui peut remplacer des formulations trop lourdes (ex : « les différentes développeuses et développeurs » plutôt que « les différents développeurs et différentes développeuses »). L’accord de majorité peut également être utilisé.
4. L’abréviation inclusive, avec le point médian (ex : les internautes né·es après 1985). Certaines personnes utilisent deux points médians en cas de pluriel (ex : les participant·e·s). Personnellement, je ne suis pas fan de cette pratique qui alourdit inutilement la phrase, je n’en utilise qu’un seul (ex : les participant·es). Je n’utilise également cette technique que pour les mots dont la terminaison ne varie que de quelques lettres entre le masculin ou le féminin (par exemple, je n’utiliserais jamais administrateur·trice car trop lourd à lire. Je privilégierais alors l’écriture détaillée).

Sur Windows, le raccourci clavier pour créer un point médiant est [ALT] + 0183, sur Mac, c’est [MAJ] + [ALT ⌥] + f et sous Linux c’est AltGr + maj + ..

Mes conseils

Au-delà des règles et des usages, j’ai envie de partager avec vous quelques conseils et réflexions tirés de mon expérience.

N’utilisez pas Google Docs pour saisir vos contenus

Google Docs est un outil de travail collaboratif vraiment pratique, c’est une des raisons pour lesquelles il est autant utilisé. Pourtant, comme je l’ai déjà évoqué plus haut, il n’est à ce jour pas vraiment adapté à la rédaction de textes en langue française, et vous oblige bien souvent à insérer manuellement des caractères pourtant courants, comme les espaces insécables ou les majuscules accentuées.

Word, et dans une certaine mesure Open Office (que je reconnais maîtriser moins), facilitent le respect des règles d’orthotypographie en français. On peut notamment y automatiser certaines tâches comme l’insertion d’espaces insécables ou encore le remplacement des guillemets anglais par des guillemets français.

Utilisez un clavier alternatif

Comme je l’ai déjà évoqué plus haut dans cet article, les claviers courants (Azerty ou Qwerty) ne sont pas pensés pour la langue française.

Il est possible d’y remédier sans pour autant changer de clavier. Il suffit pour cela de changer le pilote de votre clavier. Le pilote, c’est le logiciel qui détermine quel caractère s’affiche à l’écran quand vous appuyez sur une touche.

Pour Windows, vous pouvez par exemple opter pour le clavier d’Erick Schreiner ou de Denis Liégeois. Ils vous donneront accès à de nouveaux raccourcis très pratiques.

Personnellement, c’est la solution proposée par Denis Liégeois, parfaitement fonctionnelle, que j’utilise au quotidien. La marche à suivre pour installer le pilote de votre choix est indiquée sur chaque site web.

Pour les plus motivés, le clavier bépo intègre l’ensemble des caractères courants de la langue française. Cependant, sa prise en main est plus complexe : l’ordre des lettres change complètement !

Vérifiez, plutôt deux fois qu’une

À ce stade, vous l’aurez compris : les outils de vérification intégrés ne sont pas infaillibles. Et parce que vous ne l’êtes pas non plus, je vous recommande ces outils que j’utilise au quotidien dans mon travail.

LanguageTool est une solution payante plutôt orientée orthographe que typographie à laquelle je préfère Antidote, plus exhaustif en orthotypographie.

Pour les amateurs et amatrices de logiciel libre, Grammalecte est un logiciel libre qui relèvera la plupart de vos coquilles ! Il est disponible pour Firefox, Thunderbird, LibreOffice et même pour Vim et Emacs.

Allez-y progressivement

Ne cherchez pas à maîtriser et appliquer toutes les règles typographiques d’un coup. Commencez, par exemple, par accentuer les majuscules. Une fois que cela sera devenu une habitude, soignez votre ponctuation, puis vérifiez votre bon usage des nombres, des abréviations et sigles… Vous avez saisi l’idée 😉

Conclusion

La connaissance et le respect des règles orthotypographiques vous permettront de franchir un cap dans la qualité de vos contenus web. Vous gagnerez en lisibilité et en cohérence linguistique.

Apprendre et maîtriser les règles orthotypographiques est une démarche de longue haleine, que j’envisage plutôt comme un processus d’amélioration continue. On progresse et on s’interroge continuellement, c’est d’ailleurs ce qui me passionne !

À mes yeux, l’objectif est de rendre vos contenus agréables à lire plutôt que « parfaits ». Les règles se comptent par dizaines, et les exceptions et autres cas particuliers sont nombreux. De plus, les contraintes techniques compliquent également la tâche des rédacteurs.

Enfin, chercher à respecter ces règles exige le plus souvent un effort mental important, nécessitant d’apprendre autant que de « désapprendre ».

Toutefois, si l’on doit retenir une seule règle, c’est celle de la cohérence. Pour le reste, il ne s’agit « que » de conventions, d’usages. Soyez consistant, ne changez pas de style ou de façon de faire en cours de route, et vos lecteurs s’y retrouveront !