Conseils de mise en page

Quelques conseils de mise en page ou de typographie pour que le site soit plus joli, et surtout plus lisible.

Article mis en ligne le 25 janvier 2017
dernière modification le 26 avril 2017

Descriptif versus Chapeau

Le descriptif est affiché dans les pages de rubrique faisant référence à un article. Il est également affiché dans les "annonces défilantes". Il doit contenir un texte très court résumant l’article.
Le chapeau est affiché en haut de l’article, en italiques. Il offre lui aussi un résumé, accessible uniquement à partir de la page article.

Le descriptif est indispensable pour les articles de la page Actualités, moins important pour les autres articles. Le chapeau est relativement inutile.

Code versus cadre

Ne pas confondre ces deux balises :

  • cadre permet de mettre du texte non formatté dans un cadre. Idéal pour mettre des bouts de code que l’utilisateur pour copier-coller dans son éditeur :
  • code permet juste de mettre un passage en caractères "télétype", utile pour distinguer des mots du langage ordinaire des termes issus de commandes informatiques, comme par exemple la commande ls

Bien mettre en forme le cadre

Parfois, on met un peut de texte ordinaire, puis un cadre, dans une liste à puces.
Attention à la manière dont on s’y prend :

  1. texte + retour à la ligne + cadre :
  2. texte + cadre sans retour à la ligne :
  3. texte + SHIFT-Retour à la ligne + cadre :
  4. texte + retour à la ligne + caractère souligné (_) + cadre :

Seules les deux dernières lignes sont correctement affichées, les deux premières aboutissent à un truc absolument repoussant.

Notes de bas de page

Pour entrer des notes de bas de page, il suffit de mettre un morceau du texte entre doubles [. Ou de le sélectionner et de presser sur le 6ème bouton de la barre typographique. La numérotation des notes se fera automatiquement.

Documents graphiques vs illustrations

Une illustration est une image dont le seul intérêt est de faire joli, tant pis si on ne voit pas bien tous les détails. Un document graphique est une image qui doit être vue avec le maximum de précision, car elle apporte des éléments de compréhension importants.

Pour qu’une image apparaisse en tant que document graphique, il suffit de la déposer dans le portfolio : dès lors on pourra cliquer dessus pour l’agrandir et ainsi voir les détails correctement.

Exemple d’illustration :

Exemple de document graphique :

Atlas, espace de stockage B