Syntaxe de base du Markdown expliquée [avec aide-mémoire gratuit]

Apprendre le markdown pourrait vous aider beaucoup à écrire pour le Web. Voici un guide complet du débutant sur la syntaxe Markdown avec une aide-mémoire téléchargeable.

Dans mon travail, je dois souvent écrire du code, rédiger la documentation qui accompagne ce code, créer des pages Web et travailler sur des projets de restauration de texte. J'ai rédigé plusieurs articles formels pendant mes études. Je peux également inclure des notes de cours ici ; J'avais besoin de les écrire pour presque tous les cours.

J'utilise Markdown pour presque tous mes écrits et cela me fait gagner beaucoup de temps.

Dans cet article, je vais partager mon expérience avec Markdown. Vous apprendrez ce qui suit :

Qu’est-ce que le Markdown ?
Comment ça marche?
Syntaxe de base de Markdown et comment les utiliser

Qu’est-ce que le Markdown ?

Si vous êtes nouveau sur Markdown, il s'agit d'un outil de conversion texte en HTML destiné aux rédacteurs Web. Les fichiers Markdown suivent une syntaxe spécifique facile à lire et tout aussi facile à écrire. Ce sont des fichiers texte brut qui peuvent donc être créés à l’aide de n’importe quel éditeur de texte sur n’importe quel ordinateur. Ces fichiers peuvent ensuite être transformés en pages Web – et les pages Web sont créées à l'aide d'un balisage appelé HTML.

Markdown n’est donc qu’un moyen de créer des pages Web sans avoir besoin (ni même savoir comment) d’écrire du code HTML. En fait, Markdown est un excellent moyen de formater du texte brut même si vous n'avez pas besoin de le convertir en HTML. Quelqu'un m'a un jour décrit Markdown de cette façon :

Markdown, cependant, est plus qu'un simple schéma de formatage, c'est également un outil logiciel qui convertit le formatage du texte brut en HTML.

C'est pourquoi la syntaxe est importante. Si vous souhaitez un titre sur votre page Web, Markdown en créera un en fonction du ou des caractères que vous utilisez devant votre titre. Un échantillon de la syntaxe de Markdown est présenté dans cette capture d'écran :

Alors, comment puis-je convertir ce texte brut en HTML ?

Markdown de John Gruber est un script Perl qui s'exécute sur la ligne de commande. Fondamentalement, il lit le texte Markdown que vous créez et crée une page Web à partir de celui-ci.

J'éviterai la ligne de commande ici car il existe de nombreux éditeurs Markdown exceptionnels qui peuvent effectuer cette conversion pour vous. De plus, bon nombre de ces éditeurs vous permettront d'écrire votre texte et de vous montrer à quoi ressemblera la page Web (appelé rendu) en même temps.

Les éditeurs Markdown sont généralement configurés pour afficher deux images. Le cadre de gauche est l'endroit où vous écrivez votre texte et le cadre de droite vous montre à quoi ressemblera le texte formaté en HTML :

Lorsque vous avez terminé votre texte et que vous en êtes satisfait, enregistrez simplement le fichier Markdown. De cette façon, vous l’aurez toujours au cas où vous auriez besoin de le modifier ou de le réécrire plus tard. Une fois le fichier enregistré, vous pouvez demander à l'éditeur d'exporter le fichier markdown au format HTML.

L'éditeur créera la page Web, en utilisant votre Markdown comme référence. Votre fichier Markdown ne sera pas modifié lors d’une exportation – vous l’aurez toujours – ainsi qu’un fichier HTML (page Web) distinct nouvellement créé que vous pouvez placer sur un serveur Web.

Remarque : De nombreux éditeurs Markdown peuvent également exporter vos fichiers Markdown vers d'autres formats, tels que .doc, .docx et .pdf. . Vous pourrez en savoir plus sur ces configurations avancées et sur les logiciels supplémentaires dont vous pourriez avoir besoin plus tard.

Syntaxe de démarque de base

Pour que le nouvel utilisateur de Markdown soit rapidement opérationnel, je me limiterai à couvrir la syntaxe que j'utilise le plus souvent. Ceux-ci, je pense, seront les plus utiles – vous pouvez être productif maintenant tout en en apprenant davantage sur ce que Markdown peut faire pour vous plus tard.

Écrire des titres

J'utilise normalement les caractères # pour désigner les titres. Il existe six niveaux :

# Level 1 Heading
## Level 2 Heading
### Level 3 Heading
#### Level 4 Heading
##### Level 5 Heading
###### Level 6 Heading

Il existe un autre style de titre qui utilise des lignes sous le texte. J'utilise rarement ce type de rubrique puisque je suis limité à seulement deux. Une double ligne, constituée du caractère =, constitue un en-tête H1. Une seule ligne, constituée du caractère -, constitue un en-tête H2 :

Level 1 Heading
===============

Level 2 Heading
---------------

Paragraphes

Les paragraphes sont séparés par une ligne vide (assurez-vous qu'il y a une ligne vide entre les paragraphes). N'indentez pas du tout la première ligne. L'indentation avec un ou un <spaces> a un objectif différent dans Markdown.

Un paragraphe est un bloc de texte et ne doit pas être mis en retrait avec des espaces ou des tabulations. Il peut comporter une ou plusieurs lignes. Pour terminer un paragraphe et en commencer un nouveau, la touche est appuyée deux fois ; les paragraphes sont séparés par une ligne vide.

Sauts de ligne

N'oubliez pas qu'avec les paragraphes, une ligne blanche doit les séparer et cela se fait en appuyant deux fois sur la touche . Markdown est strict à ce sujet.

Markdown ne prend pas en charge les paragraphes « emballés en dur » ou « de longueur de ligne fixe ». Autrement dit, appuyer une fois sur la touche ne forcera pas le texte sur une nouvelle ligne. Cela peut apparaître ainsi dans la fenêtre d’édition, mais le HTML ne l’affichera pas.

Pourtant, il y aura des moments où vous devrez peut-être diviser des paragraphes avec un moyen de diviser une ligne. Markdown a un moyen de le faire, mais cela peut sembler un peu étrange au début : un saut de ligne est effectué en terminant une ligne par deux espaces ou plus, puis en appuyant sur la touche . une fois.

Voici un exemple concret d’un court verset. Chaque ligne comporte deux espaces à la fin. La dernière ligne, puisqu’elle marque la fin du verset, ne comporte pas d’espaces supplémentaires. Comme c'est la fin du verset (paragraphe), j'appuie deux fois sur la touche :

Baa, baa mouton noir,
Avez-vous de la laine ?.
Oui, monsieur. Oui, monsieur.
Trois sacs pleins.

Ajouter deux espaces à la fin d’une ligne, pour créer un saut de ligne, peut prendre un certain temps pour s’y habituer.

Règles horizontales

Les règles horizontales sont idéales pour diviser le texte en sections.

Utilisez au moins trois tirets -, des traits de soulignement _ ou des astérisques * pour les règles horizontales, comme ceci :

`---`

`***`

`___`

Vous pouvez même mettre des espaces entre les caractères :

`- - -`

Je n'utilise pas très souvent les règles horizontales dans les articles ou les articles, mais elles me sont utiles dans les entrées de journal, les journaux système et les notes de cours.

Accentuation du texte en gras et italique

Lorsque vous souhaitez qu'un mot ou une phrase se démarque et soit remarqué, vous pouvez le mettre en gras ou en italique. Les textes en italique et en gras peuvent être rédigés de deux manières. La première consiste à entourer le texte d'astérisques *, tandis que la seconde consiste à utiliser des traits de soulignement _.

Pour mettre en italique un mot ou une phrase, entourez le texte d’un trait de soulignement ou d’un astérisque. Pour mettre un mot ou une phrase en gras, entourez-le de deux traits de soulignement ou astérisques :

This is *italics* made with asterisks.

This is _italics_ made with underscores.

This is **bold** made with asterisks.

This is __bold__ made with underscores.

N'oubliez pas d'utiliser le même caractère. Un astérisque sur un côté d’un mot ou d’une phrase et un trait de soulignement sur le côté ne fonctionneront pas. Le même caractère doit figurer des deux côtés du mot ou de la phrase.

Bloquer les citations

Les guillemets en bloc sont utilisés pour les cotations directes. Si vous écrivez un article de blog et que vous souhaitez répéter quelque chose que Benjamin Franklin a dit, vous pouvez utiliser une citation en bloc.

Un crochet à angle droit est utilisé pour spécifier une citation en bloc :

> This is a block quote.

>> Use two right angle brackets if you want a block quote that is further indented.

Ajouter des liens dans Markdown

Les liens sont tout simplement sympas. Il existe trois façons de créer des liens sur Markdown de base, mais je n'en couvrirai que deux ici : les liens réguliers et les liens automatiques.

Le troisième type de lien, appelé liens de référence, est pris en charge dans Markdown de base et dans les versions plus avancées. Je veux commencer rapidement. Vous pouvez rechercher des liens de référence lorsque vous êtes prêt pour cela.

Des liens réguliers vous permettent de créer des liens vers divers sites Web. Le nom du site, ou une expression que vous souhaitez utiliser, est placé entre crochets []. Le lien réel est entre parenthèses ().

Visit [It's FOSS](https://linux-console.net) today!

Les liens automatiques sont réalisés avec des crochets <> entourant le lien. Le lien est une adresse réelle (soit une adresse Web, soit une adresse e-mail). Le lien est épelé et, lorsqu'il est converti en HTML, le lien épelé devient un lien fonctionnel.

<http://automatic-link-to-url.com/>

<[email >

Ceci est utile lorsque vous souhaitez épeler l'adresse dans votre texte :

Ajouter des images dans Markdown

Les liens vers des images sont presque identiques aux liens vers des sites Web. La petite différence entre les liens de sites et les images, c'est que les liens d'images commencent par un bang (point d'exclamation) !

Le nom de l'image, ou une phrase descriptive de l'image, est placé entre crochets []. Le lien réel est entre parenthèses ().

Vous pouvez intégrer des images comme ceci :

![alternate text](./images/image.jpg)

Voici un exemple de lien d’image. Il s'agit d'un exemple de lien, sans image, mais c'est un exemple décent de ce à quoi pourrait ressembler un lien réel :

![a picture of bill](./images/my_photo_of_me.jpg)

Listes

Les listes sont établies pour de nombreuses raisons. Ils peuvent être utilisés comme éléments de « choses à faire », éléments de sujet dans un plan, listes de pièces dans un projet d'assemblage, etc. Il existe deux principaux types de listes : non ordonnées et ordonnées.

Les listes non ordonnées ne sont pas numérotées ; ce sont les « éléments clés » que nous voyons dans de nombreux documents. Les listes ordonnées sont numérotées.

Pour créer une liste ordonnée (numérotée), commencez simplement chaque ligne par un numéro, comme ceci :

1. Item one.
2. Item two.
3. Item three.

Les listes non ordonnées ne sont pas numérotées, mais utilisez soit un astérisque *, un signe plus + ou un signe moins - au début de chaque élément. sur la liste. Je préfère utiliser un astérisque ou un signe moins, mais vous avez le choix :

* Item one.
+ Item two.
- Item three.

Les sous-éléments peuvent être ajoutés aux listes ordonnées et non ordonnées par indentation, comme ceci :

1. Item 1
    1. Sub-item 1
    2. Sub-item 2
2. Item 2
3. Item 3

Aide-mémoire sur la syntaxe Markdown

Pour votre référence, voici une courte liste de la syntaxe Markdown qui a été abordée dans cette petite introduction.

Si vous décidez de l’adopter comme outil d’écriture, vous constaterez que Markdown a les moyens de simplifier encore plus l’écriture.

Conclusion

Markdown peut faire plus que ce que j'ai décrit ici. Un pourcentage énorme de mon écriture peut être réalisé avec la syntaxe Markdown que j'ai abordée ici – et ce sont les éléments que j'utilise le plus souvent, même dans des projets plus complexes.

Si tout cela semble trop simple, c’est vraiment aussi simple que cela. Markdown a été conçu simplement pour la tâche d'écriture, mais vous n'êtes pas obligé de me croire sur parole. Essaye le! Il n'est pas nécessaire d'installer un éditeur Markdown ; vous pouvez le faire en ligne. Il existe plusieurs bons éditeurs Markdown en ligne. En voici trois que je préfère :

Dingus, Editor.md et Dillinger de John Gruber. Editor.md et Dillinger vous permettront de voir votre Markdown rendu au format HTML en temps réel. Dingus ne prévisualise pas en temps réel, mais il y a une aide-mémoire sur la syntaxe Markdown sur la page pour référence.

Essayez quelques-uns des exemples de cet article sur l’un de ces éditeurs en ligne. Essayez également certaines de vos propres idées. Cela vous permettra de vous habituer à Markdown avant d’éventuellement vous engager à en savoir plus.

Et si vous souhaitez prendre en charge It's FOSS, vous pouvez acheter notre guide Markdown au format PDF et EPUB. Il couvre ce que vous venez d'apprendre avec un peu plus d'explications et d'exemples.