Syntaxe de base Markdown : guide complet avec exemples
Maîtrisez chaque élément de la syntaxe de base Markdown avec des exemples clairs et les erreurs courantes à éviter. Votre référence ultime pour les titres, listes, liens et bien plus.
La syntaxe de base Markdown est le fondement que tout développeur, rédacteur et créateur de contenu doit maîtriser. Que vous rédigiez de la documentation, un article de blog ou une issue GitHub, ces éléments essentiels sont les briques que vous utiliserez chaque jour.
Ce guide passe en revue chaque élément de la syntaxe de base avec des exemples clairs, des comparaisons avec le HTML généré, et les erreurs courantes à éviter. Ajoutez-le à vos favoris — vous y reviendrez plus souvent que vous ne le pensez.
Titres
Les titres structurent votre contenu en une hiérarchie logique. Markdown prend en charge six niveaux de titres, créés en plaçant des symboles # avant votre texte.
# Heading Level 1
## Heading Level 2
### Heading Level 3
#### Heading Level 4
##### Heading Level 5
###### Heading Level 6
Cela produit le HTML suivant :
<h1>Heading Level 1</h1>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>
Bonnes pratiques pour les titres
Ajoutez toujours un espace entre le # et le texte du titre. Sans cet espace, certains analyseurs ne le reconnaîtront pas comme un titre.
✅ ## This Works
❌ ##This Doesn't
Utilisez les titres dans l'ordre. Ne passez pas de H2 à H4 — cela casse la structure logique du document et nuit à la fois à l'accessibilité et au SEO. Considérez les titres comme une table des matières : chaque niveau doit s'imbriquer logiquement sous le précédent.
N'utilisez qu'un seul H1 par page. Le H1 est le titre de votre page. Tout le reste devrait être H2 ou inférieur.
Paragraphes et sauts de ligne
Les paragraphes sont l'élément Markdown le plus simple — il suffit d'écrire du texte. Séparez les paragraphes par une ligne vide.
This is the first paragraph.
This is the second paragraph.
Sauts de ligne
C'est ici que beaucoup de débutants se trompent. Appuyer une seule fois sur Entrée ne crée pas une nouvelle ligne dans la plupart des rendus Markdown. Vous devez soit :
- Terminer une ligne par deux espaces ou plus (puis appuyer sur Entrée)
- Utiliser la balise HTML
<br>
This is the first line.
This is the second line.
Or use HTML:<br>
This starts a new line.
Erreur courante
Appuyer simplement sur Entrée entre deux lignes les fusionnera en un seul paragraphe dans le rendu :
Line one
Line two
Cela s'affiche : « Line one Line two » — sur une seule ligne. Utilisez toujours une ligne vide pour un nouveau paragraphe ou des espaces en fin de ligne pour un saut de ligne au sein du même paragraphe.
Mise en forme du texte
Markdown facilite la mise en valeur du texte. Voici les principales options de formatage :
Gras
Entourez le texte de doubles astérisques ou de doubles tirets bas :
**This is bold text**
__This is also bold__
Sortie HTML : <strong>This is bold text</strong>
Italique
Entourez le texte d'un seul astérisque ou d'un seul tiret bas :
*This is italic text*
_This is also italic_
Sortie HTML : <em>This is italic text</em>
Gras et italique
Combinez trois astérisques pour les deux :
***Bold and italic***
___Also bold and italic___
**_Or mix like this_**
Sortie HTML : <strong><em>Bold and italic</em></strong>
Texte barré
Utilisez des doubles tildes (c'est une extension GFM, mais prise en charge presque partout) :
~~This text is crossed out~~
Sortie HTML : <del>This text is crossed out</del>
Erreur courante
Utiliser des tirets bas au milieu d'un mot ne fonctionne pas de manière fiable. Préférez les astérisques pour l'emphase en milieu de mot :
✅ This is**very**important
❌ This is__very__important
Citations
Les citations sont créées avec le caractère >. Elles sont couramment utilisées pour citer des sources, mettre en avant des notes importantes ou signaler des informations clés.
> Markdown is intended to be as easy-to-read and easy-to-write as is feasible.
> — John Gruber
Sortie HTML :
<blockquote>
<p>Markdown is intended to be as easy-to-read and easy-to-write as is feasible.
— John Gruber</p>
</blockquote>
Citations multi-paragraphes
Ajoutez > sur la ligne vide entre les paragraphes :
> First paragraph of the quote.
>
> Second paragraph of the quote.
Citations imbriquées
Utilisez >> pour l'imbrication :
> This is the outer quote.
>
>> This is a nested quote inside it.
Citations avec d'autres éléments
Vous pouvez combiner les citations avec d'autres éléments de formatage Markdown :
> ### A Heading Inside a Quote
>
> - List item one
> - List item two
>
> Text with **bold** and *italic* formatting.
Listes
Les listes sont l'un des éléments Markdown les plus fréquemment utilisés. Vous en rencontrerez trois types : non ordonnées, ordonnées et listes de tâches.
Listes non ordonnées
Utilisez -, * ou + comme marqueurs. Choisissez-en un et restez cohérent :
- First item
- Second item
- Third item
Sortie HTML :
<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ul>
Listes ordonnées
Utilisez des chiffres suivis d'un point. Les chiffres réels n'ont pas d'importance — Markdown les numérote automatiquement :
1. First step
2. Second step
3. Third step
Fait intéressant, ceci produit le même résultat :
1. First step
1. Second step
1. First step
Les deux s'affichent comme une liste numérotée 1-2-3 correcte. Cependant, la bonne pratique est d'utiliser des numéros séquentiels pour la lisibilité du fichier source.
Listes imbriquées
Indentez avec deux ou quatre espaces pour créer des sous-listes :
1. Main item
- Sub-item A
- Sub-item B
- Sub-sub-item
2. Another main item
Listes de tâches
Les listes de tâches (une fonctionnalité GFM) utilisent - [ ] pour les éléments non cochés et - [x] pour les éléments cochés :
- [x] Write the draft
- [x] Add code examples
- [ ] Proofread the article
- [ ] Publish
Erreur courante
Oublier la ligne vide avant une liste lorsqu'elle suit un paragraphe. Certains analyseurs l'exigent :
✅ Here is my list:
- Item one
- Item two
❌ Here is my list:
- Item one
- Item two
Code
L'affichage du code est l'un des points forts de Markdown, et bien le maîtriser est essentiel pour la lisibilité.
Code en ligne
Entourez le code de simples accents graves pour un affichage en ligne :
Use the `print()` function to output text.
Sortie HTML : Use the <code>print()</code> function to output text.
Si votre code contient lui-même un accent grave, utilisez des doubles accents graves :
``There is a literal `backtick` here.``
Blocs de code
Pour du code multi-lignes, utilisez des triples accents graves (blocs de code délimités) avec un identifiant de langage optionnel pour la coloration syntaxique :
```javascript
function greet(name) {
return `Hello, ${name}!`;
}
```
L'identifiant de langage (javascript, python, html, css, bash, etc.) active la coloration syntaxique dans la plupart des rendus. Incluez-le toujours — cela améliore considérablement la lisibilité.
Blocs de code indentés
Vous pouvez également créer des blocs de code en indentant chaque ligne de quatre espaces ou une tabulation :
function add(a, b) {
return a + b;
}
Cependant, les blocs de code délimités sont fortement recommandés car ils prennent en charge la coloration syntaxique et ne nécessitent pas l'indentation de chaque ligne.
Liens
Les liens sont essentiels pour connecter les contenus. Markdown prend en charge plusieurs formats de liens.
Liens en ligne
Le format le plus courant — texte entre crochets, URL entre parenthèses :
[Visit Example](https://example.com)
Sortie HTML : <a href="https://example.com">Visit Example</a>
Liens avec titre
Ajoutez un titre entre guillemets après l'URL (apparaît comme info-bulle au survol) :
[Visit Example](https://example.com "Example Website")
Liens de style référence
Pour un texte source plus lisible lorsque vous avez de nombreux liens, utilisez le style référence :
I use [Google][1] and [GitHub][2] daily.
[1]: https://google.com "Google"
[2]: https://github.com "GitHub"
Cela garde vos paragraphes propres et regroupe toutes les URL en bas — particulièrement utile dans les documents longs.
Liens automatiques
Entourez une URL ou un e-mail de chevrons pour un lien automatique :
<https://example.com>
<contact@example.com>
La plupart des rendus modernes (comme GitHub) créent aussi automatiquement des liens à partir d'URL brutes sans chevrons, mais les utiliser garantit la compatibilité.
Erreur courante
Oublier que les espaces dans les URL doivent être encodés. Utilisez %20 pour les espaces :
✅ [My Doc](files/my%20document.pdf)
❌ [My Doc](files/my document.pdf)
Images
Les images utilisent la même syntaxe que les liens, mais avec un point d'exclamation ! devant :
Sortie HTML : <img src="/path/to/image.webp" alt="Alt text describing the image">
Images avec titre
Images cliquables
Combinez la syntaxe des liens et des images pour rendre une image cliquable :
[](https://example.com)
Bonnes pratiques pour le texte alternatif
Rédigez toujours un texte alternatif descriptif. Il remplit deux fonctions essentielles :
- Accessibilité — les lecteurs d'écran l'utilisent pour décrire les images aux utilisateurs malvoyants
- SEO — les moteurs de recherche l'utilisent pour comprendre le contenu des images
✅ 
❌ 
❌ 
Filets horizontaux
Créez une ligne horizontale (séparation thématique) pour séparer visuellement les sections. Utilisez trois tirets, astérisques ou tirets bas ou plus :
---
***
___
Les trois produisent le même HTML : <hr>
Bonne pratique : Utilisez --- de manière cohérente et ajoutez toujours des lignes vides avant et après :
Content above the rule.
---
Content below the rule.
Caractères d'échappement
Que faire si vous souhaitez afficher un astérisque ou un symbole dièse littéral sans déclencher le formatage Markdown ? Utilisez une barre oblique inverse \ avant le caractère :
\* This is not italic \*
\# This is not a heading
\- This is not a list item
Voici la liste complète des caractères que vous pouvez échapper :
\ Backslash
` Backtick
* Asterisk
_ Underscore
{} Curly braces
[] Square brackets
() Parentheses
# Hash
+ Plus sign
- Hyphen
. Dot
! Exclamation mark
| Pipe
Aide-mémoire rapide
Voici chaque élément de la syntaxe de base dans un tableau pour une consultation rapide :
Element Syntax HTML
-------------- ------------------ -----------
Heading 1 # Text <h1>
Heading 2 ## Text <h2>
Heading 3 ### Text <h3>
Bold **text** <strong>
Italic *text* <em>
Bold + Italic ***text*** <strong><em>
Strikethrough ~~text~~ <del>
Blockquote > text <blockquote>
Ordered list 1. item <ol><li>
Unordered list - item <ul><li>
Inline code `code` <code>
Link [text](url) <a href>
Image  <img>
Horizontal rule --- <hr>
Line break spaces + Enter <br>
Passez à la pratique
Maintenant que vous avez appris chaque élément de la syntaxe de base Markdown, il est temps de les utiliser. Voici les prochaines étapes :
-
Entraînez-vous à écrire : Créez un fichier
notes.mdet essayez chaque élément de syntaxe. Plus vous écrirez, plus cela deviendra naturel. -
Utilisez un outil de prévisualisation : L'aperçu Markdown intégré de VS Code (
Ctrl+Shift+V/Cmd+Shift+V) vous permet de voir le rendu en temps réel pendant que vous tapez. -
Convertissez et partagez : Lorsque votre document Markdown est prêt à être diffusé, transformez-le en un résultat soigné — convertissez Markdown en HTML pour la publication web, générez un PDF pour des documents imprimables, ou exportez vers Word pour l'édition collaborative.
-
Allez plus loin : Une fois à l'aise avec la syntaxe de base, plongez dans notre guide de la syntaxe étendue Markdown pour les tableaux, notes de bas de page, listes de définitions et bien plus encore. Nouveau sur Markdown ? Commencez par Qu'est-ce que Markdown pour avoir une vue d'ensemble.
La beauté de Markdown réside dans le fait que ces éléments de base couvrent la grande majorité de tout ce que vous aurez jamais besoin d'écrire. Maîtrisez-les une fois, et vous les utiliserez partout — de GitHub à Notion, de la documentation aux articles de blog comme celui-ci.