Alignement des textes et lisibilité

Le site de La brasserie du bon coin nous expose d’un seul coup trois erreurs à éviter en matière d’alignement des informations dans une page web.

1. L’alignement centré, s’il convient à la carte des desserts, ne favorise pas la lisibilité d’un texte coulé.

2. L’alignement justifié, lorsqu’il est appliqué à une colonne de texte étroite, crée de gros trous entre les mots. J’appelle ce phénomène l’effet gruyère. Lecteur fidèle, nous nous étions déjà posé cette question : Les textes justifiés sont-ils justifiés ?

3. Les champs d’un formulaire, eux aussi, doivent être correctement alignés pour faciliter le balayage et l’encodage de l’information. Dans cet exemple, voyez comme le « nombre de couverts » et l’option « fumeurs » sont décalés dans la mise en page.

Tous ces détails liés à la maîtrise typographique contribuent à détériorer ou, au contraire, améliorer la lisibilité de vos contenus.

Cette entrée a été publiée dans Ecrire pour le web. Vous pouvez la mettre en favoris avec ce permalien.

7 réponses à Alignement des textes et lisibilité

  1. katsoura dit :

    Petite remarque, ce n’est pas le gruyère mais l’emmental :-)

  2. Pirlouit dit :

    Détail typographique indispensable :
    dans un texte justifié, l’option "coupure de mots autorisée"… s’impose(!) pour une composition lisible !

  3. Pirlouit dit :

    Bonjour,
    ce que vous appelez "alignement centré" se traduit par "composition en sommaire brisé"… terme typographique correct !

  4. Pirlouit dit :

    Pour rappel, il manque une espace après le point dans :
    …vous-même. Resto…

  5. Pirlouit dit :

    Il manque aussi une espace avant le point d’exclamation (avance !)

  6. jmh dit :

    @ Pirlouit : C’est ce qu’on appelle "retourner le couteau dans la plaie" ;-)

  7. Pirlouit dit :

    Peut-être, mais il ne faut pas évoquer la Typographie ou s’en revendiquer !
    Il y a un monde entre la mise en pages web et la vraie mise en pages typo (XPress ou InDesign, par exemple)

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

*

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>