L'objet de ce texte est de présenter comment produire un document structuré de façon plus ergonomique qu'avec un traitement de texte. Le document sera beaucoup plus simple à insérer dans une plateforme d'enseignement, sur un blog, etc., et il sera aussi possible de produire des PDF et même des documents pour traitement de texte.
Le plus important lorsque l'on produit un texte c'est de le structurer c'est à dire de marquer informatiquement les titres, les parties, les paragraphes, les listes… D'abord, cela permet de d'ordonner ce que l'on veut signifier. Ensuite cela permet de ne pas se soucier de la mise en forme qui sera faite automatiquement. C'est très important car lorsque un document est structuré il est lisible sans difficulté sur tous les logiciels et matériels : un ordinateur, une tablette ou un téléphone. Autre exemple, il sera aussi très lisible sur les machines pour mal voyants. Structurer un document c'est s'assurer que toutes et tous les lecteurs puissent y accéder et adapter sa mise en forme à leurs conditions particulières.
La notion clé lorsque l'on produit un document avec des outils informatique c'est de distinguer le fond et la forme. C'est à dire distinguer la rédaction de sa mise en forme. Le défaut majeur des traitements de texte (comme Word, Writer de Libreoffice ou Page de macOS) c'est qu'il est facile de donner l'illusion d'avoir structuré un texte. Par exemple, il est possible de mettre en gras quelques mots et de les centrer pour donner l'illusion qu'il s'agit d'un titre. Mais le logiciel ne reconnaît pas ces mots comme un titre, ce qui va générer un certains nombres de complications et rendre difficile la lecture du document sur différents matériels.
Il est donc important de coder explicitement la structure du texte (les titres, sous titres, paragraphe…) et de laisser l'ordinateur se soucier de la mise en forme. Cela permet de passer moins de temps sur la forme et de se concentrer sur ce que l'on écrit. La solution que nous proposons dans ce tutoriel, moins habituelle que ce que l'on fait d'habitude, est plus simple à mettre en œuvre.
Markdown est un langage de programmation simplissime crée en 2004, il permet de produire des textes, des présentations, des pages web, des billets de blog, des livres… Il est très facile à apprendre, beaucoup plus simple qu'un traitement de texte, en particulier lorsque l'on produit des textes et des vidéos pour le web (wordpress, spip, moodle, wiki…). La structuration de texte est très rigoureuse et facile à modifier. La lisibilité et la mise en page des documents produits est indépendante des matériels et des systèmes d'exploitations.
On y trouve peu d'options il est donc beaucoup plus simple à apprendre que Word ou Power Point. Il permet de structurer du texte avec plus de rigueur et beaucoup moins de bugs. On peut produire principalement des fichiers html (plutôt pour le web) et des PDF.
Il existe une multitude de logiciels :
En ligne :
Hors ligne :
On voit sur la copie d'écran ci-dessous (en anglais) la présentation que l'on retrouve sur la plupart des logiciels de Markdown. D'un coté une zone de saisie où l'on écrit son texte et de l'autre le rendu c'est à dire le document tel qu'il apparaîtra.
Pour créer des titres on utilise le signe # dans la zone de saisie. Un seul # pour un titre de niveau 1, deux # pour un tire de niveau 2, etc.
# Titre de niveau 1
## Titre de niveau 2
### Titre de niveau 3
#### Titre de niveau 4Pour mettre en évidence des textes court (gras, italique, souligné…) on encadre le ou les mots par des * . Selon le logiciel que vous utiliserait il est aussi possible de souligner ou de surligner en couleur avec les signes ~ ou = .
| Ce que l'on écrit | Ce qui s'affiche |
|---|---|
*un texte en italique* |
un texte en italique |
**un texte en gras** |
un texte en gras |
_un texte souligné_ |
un texte souligné |
~~un texte rayé~~ |
|
==un texte en fluo== |
un texte en fluo |
On rédige donc un texte comme ci-dessous dans le panneau de gauche :
# Qu'est-ce que le Lorem Ipsum?
Le *Lorem Ipsum* est simplement du **faux texte** employé dans la composition et la mise en page avant impression.
Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un peintre anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte.
Ce texte s'affichera de cette façon dans le panneau de droite :
Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression.
Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un peintre anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte.
Pour un document destiné au web il est utile de produire des liens hypertexte vers d'autres documents. on indique entre crochet le fragment de texte que l'on veut rendre “actif” et entre parenthèse le lien. La syntaxe est la suivant :
[Wikipédia](http://wikipedia.fr)
Attention il n'y a pas d'espace entre la fermeture du crochet et l'ouverture de la parenthèse. Le lien s'affichera ensuite comme ceci :
Faire une liste est très simple il faut sauter une ligne après les deux points et mettre des tirets :
Ingrédients de la tarte aux pommes :
- des pommes
- de la pate
- un peu de sucreIngrédients de la tarte aux pommes :
Pour faire une liste numérotée on remplace les tirets par des nombres suivit d'un point :
Recette de la tarte aux pommes :
1. Faire de la compote
2. Éplucher et découper des pommes
3. Mettre la compote et les pommes dans la pâte
4. Mettre au fourRecette de la tarte aux pommes :
Pour présenter une tableau on va utiliser le signe - et le signe | (barre verticale)
Table de 1 | Table de 2 | Table de 3
-----------|------------|-----------
1 x 1 = 1 | 2 x 1 = 2 | 3 x 1 = 3
1 x 2 = 1 | 2 x 2 = 4 | 3 x 2 = 6
| Table de 1 | Table de 2 | Table de 3 |
|---|---|---|
| 1 x 1 = 1 | 2 x 1 = 2 | 3 x 1 = 3 |
| 1 x 2 = 1 | 2 x 2 = 4 | 3 x 2 = 6 |
On va ajouter le signe : de part et d'autres des tirets si l'on veut centrer, justifier à droite ou à gauche dans les colonnes du tableau.
Table de 1 | Table de 2 | Table de 3
:---------|:----------:|----------:
1 | 2 | 3
1 | 4 | 6
| Table de 1 | Table de 2 | Table de 3 |
|---|---|---|
| 1 | 2 | 3 |
| 1 | 4 | 6 |
Si l'on veut mettre un texte en exergue, on va utiliser en début de ligne le signe > (chevron)
> Trop de morceaux de musique finissent trop longtemps après la fin.Trop de morceaux de musique finissent trop longtemps après la fin.
Des notes de base pages sur lesquelles on peut cliquer sont un confort de lecture appréciable. La syntaxe en est simple : on utilise les crochets [ ] et l'accent circonflexe ^ avec un chiffre. Ensuite on refait en dessous le même signe suivi de deux points comme par exemple ici [^1] pour la note dans les texte et [^1]: pour la note en bas de page :
Trop de morceaux de musique finissent trop longtemps après la fin.
[^1]
[^1]:Igor Stravinsky`
Trop de morceaux de musique finissent trop longtemps après la fin1.
Imaginons que vous vouliez écrire des éléments comme du brouillon ou des aides mémoires mais sans que se soit visible dans le document final. Il suffit de placer les caractères <!--et -->avant et après un texte.
<!-- Ce texte ne s'affichera pas dans le document final -->
Il peut être utile d'avoir recours à des formules mathématiques :
| Ce que l'on écrit | Ce qui s'affiche |
|---|---|
$0 + 0 =0$ |
\(0 + 0 = 0\) |
$1 \times 1 =1$ |
\(1 \times 1 =1\) |
$y = ax + b$ |
\(y = ax + b\) |
$ax^2+bx+c=0$ |
\(ax^2+bx+c=0\) |
$\sqrt 4 \ne 3$ |
\(\sqrt 4 \ne 3\) |
$\bar x$ |
\(\bar x\) |
Avec Markdown il y a deux fichier à sauvegarder : le document source, celui que l'on a rédigé et le document final, le rendu. Les fichier produit par le document source finissent par .md c'est l'extension de fichier . Le document final, le rendu aura lui l'extension .html ou .pdf.
L'avantage ergonomique du Markdown par rapport aux logiciels les plus courant c'est que l'on ne manipule que du texte. Comme les éléments réalisant la mise en page sont peu nombreux et clairement identifiables on se soucie beaucoup moins de la forme qu'avec un traitement de texte.
Dans une deuxième partie nous verrons comment insérer des images, des sons, des vidéos…
Igor Stravinsky ↩