3. Textes

3.1 Textes courts :

La rédaction de textes pour Internet se différencie énormément de celle pour les médias traditionnels. Il faut présenter des contenus courts, simples et précis, susceptibles d’éveiller l’intérêt du lecteur.

La raison : sur l’écran, on lit environ entre 25 et 30% plus lentement et seulement 16% (!) des internautes lisent le texte proposé en entier. De plus, la lecture se fait de manière moins concentrée et moins précise que sur le papier.

Un autre argument contre les textes trop longs est le fait que les internautes n’aiment pas faire défiler le texte. Un texte devrait avoir une hauteur maximale de 2 pages d’écran. Il faut absolument éviter la possibilité de défilement horizontal du texte! Gardez donc la largeur du tableau à 98 % ou 620 pixels maxi (largeur imprimable sur un format A4).

Celui qui laisse balayer son regard sur des textes Internet, ne lit pas vraiment. Il "passe au scanner". Seulement environ 50% du texte sont réellement absorbés et seules les informations mises en avant, ainsi que les listes, les graphiques, les tableaux les débuts de paragraphes et au maximum un argument par paragraphe sont saisis.

Des phrases courtes sont primordiales sur Internet. Lors de formulations longues et compliquées avec éventuellement plusieurs compléments de phrase, les internautes interrompent rapidement leur lecture. "Plutôt court que beau" doit être la devise du rédacteur Internet.

3.2 Largeur du texte/aération à l’aide d‘images :

Pour une longueur maximale de 2 pages d’écran, les textes ne devraient pas dépasser une largeur de 10 à 15 cm. Vous pouvez respecter ces mesures en insérant une image à gauche ou à droite du texte Ce texte-là par exemple est plus facile à lire que le texte ci-dessus (§ 3.1). Une image est plus explicite que 1.000 mots...

3.3 Paragraphes:

Veillez toujours à obtenir des paragraphes courts et clairs. 5 à 7 lignes par paragraphe sont un maximum!

3.4 Mise en page:

Ne changez pas inutilement la "mise en page" au sein d’une page:

Tout d'abord, un titre aligné à gauche

Ensuite vient une image centrée. Le texte qui suit est également centré.

Et on poursuit sur la gauche. Ceci semble assez irrégulier et incohérent. Il aurait été plus adéquat de centrer tout le paragraphe (avec ce contenu très court).

3.5 Teaser :

Utilisation de "Teaser" : Une sorte de résumé après le titre, la "Headline", qui résume le thème principal du texte en quelques courtes phrases. Faire appel à la curiosité du lecteur pour qu’il lise ensuite tout le texte ou pour qu’il clique sur le lien correspondant.

3.6 Ecriture bien lisible :

La police de caractère et sa taille sont définies par la feuille de style (CSS) associée à l'interface graphique. Si vous n’utilisez pas le CSS ou si vous souhaitez y changer quelque chose, trouvez ci-joint une liste de conseils:

Ecritures sous la taille 10 (taille Internet 1, ou taille css 9) ne sont pas destinées à la lecture de textes longs.

Des écritures à espacement proportionnés sont plus facilement lisibles que celles
à espacements fixes pour tous les caractères.

L’écriture à sérifs est plus lisible sur le papier,
L’écriture sans sérifs est plus lisible à l‘écran.

LES MAJUSCULES SONT LISIBLES A UNE VITESSE REDUITE DE 30 POURCENTS ...
comparées aux écritures comportant minuscules et majuscules.

Les écritures fantaisies sont non seulement plus difficiles à lire, elles sont aussi une question de goût. (D'autre part une police de caractère ne sera visible par l'internaute que si elle est installée sur sont ordinateur, sinon le navigateur utilisera une police par défaut)

Résumé: Utilisez TOUJOURS une des polices de base  VERDANA ou ARIAL (à moins que votre client n’ait formulé expressément un autre souhait). La feuille de style  (CSS) associée à votre interface graphique a déjà sélectionnée une de ces polices.

3.7 Taille des caractères:

Utilisez principalement

Taille 5 (gras) pour les grands titres (css - h2 - 24px)

Taille 4 (gras) pour titres intermédaires (css - h3 - 18px)

et taille 2 (css - "aucune" – commandée par body - 12px) pour le texte normal. Cette taille est agréable à lire et permet aussi une bonne présentation graphique.

La taille 3 est bonne pour les énumérations,
Par exemple pour une énumération placée au centre.
La taille 3 est en général agréable à lire,lorsqu’elle est normale et pas en gras….

3.8 Mise en valeur :

Suivez SVP les règles suivantes:

Caractères gras : ils soutiennent efficacement les mouvements des yeux lors de la lecture car ils sont bien lisibles.

Caractères en italique: Ceux-ci par contre ressortent à peine de l’écriture normale
A cause de la basse résolution de 72 dpi, les caractères italiques sont à éviter sur l’Internet. L’écriture pourrait paraître très "déchiquetée".

Sur Internet, ne soulignez rien. Cela pourrait prêter à confusion avec les liens hypertextes. On pourrait avoir l’impression que vous avez posé de faux liens. (ou des liens ne fonctionnant pas)

3.9 Mots-clés:

Utilisez plutôt des mots-clés. Des mots comme "gratuit", "nouveau" ou "maintenant" marchent en général très bien. Naturellement en partant du principe qu’ils disent la vérité et qu’ils n’introduisent pas des « nouveautés » vieilles de plusieurs mois.

3.10 Tonalité:

Adaptez le ton du site au public auquel vous désirez vous adresser. Voyez cela à l’avance avec votre client. Est-ce que je veux m’adresser à un public spécialisé ou à Monsieur Tout-le- Monde ? En tous cas, personne n’apprécie beaucoup le jargon du Web. Les novices ne le comprennent pas et ces avances verbales ne font que glisser sur les professionnels, Ils préfèrent un langage objectif et neutre.

3.11 CONSEILS IMPORTANTS :

Ne faites pas de fautes d’amateur ! On reconnaît les amateurs aux changements permanents de couleurs, de polices, de taille des caractères et d’organisation – et cela même à l’intérieur d’une seule page ! Conservez le même style (CI-Cooperate Identity)– non seulement à l’intérieur d’une page HTLM – mais POUR LE SITE COMPLET. Par exemple utilisez seulement 3 tailles différentes de caractères avec seulement 2 ou 3 couleurs Prenez soin d’organiser TOUTES LES PAGES HTLM de la même manière.

Exemple:
- TOUS les titres d’un site sont soit alignés à gauche, soit à droite ou centrés !
- TOUS les tableaux ont la même largeur!
- TOUS les titres ont la même couleur, le même fond et la même taille !
- TOUS les titres intermédiaires ont la même couleur, le même fond et la même taille !
- TOUS les textes normaux ont la même couleur, le même fond et la même taille !
- TOUTES les remarques importantes sont mises en évidence dans une même couleur !
- etc.

Pensez aussi à harmoniser la couleur du texte à la couleur de l'interface graphique, pour obtenir une bonne image d’ensemble!