Parlez-vous Markdown ?

with Pas de commentaire

Parlez-vous Markdown ?Markdown kezaco ?

Vous avez peut-être déjà croisé la syntaxe Markdown sans le savoir, dans des forums, des Wiki, sur le site MOOC de France Université Numérique, ou en utilisant Trello.
Markdown

Markdown est une manière très simple d’appliquer des formattages à du texte en gardant un document très léger et extrêmement portable, puisqu’on reste toujours dans un format de fichier texte. Pas de soucis de conversion de fichiers, de transferts entre PC, Mac, Linux. Et, pour l’écriture, une concentration totale sur le contenu, en mode « machine à écrire ».

C’est sans doute ce qui fait le succès actuel de ce langage, ce recentrage sur le travail premier de l’écrivain/rédacteur: écrire. Mais, conscient de son époque, Markdown permet d’insérer facilement gras, italiques, niveaux de hiérarchies, liens internet et image, le tout pour produire un fichier HTML pouvant ensuite être mis en ligne.

D’où vient Markdown ?

Markdown a été théorisé par John Gruber en 2004. Son but initial était de concevoir un outil de conversion texte-vers-HTML pour ceux qui écrivent pour le web, avec un langage qui soit facile à lire, facile à écrire, basé sur un format texte, et facile à convertir en HTML.

Comme tout langage, il faut en comprendre les bases, mais celles-ci sont relativement simples. Nous allons lister les principaux éléments de formatage.

Les bases du langage Markdown

Formatage: gras et italique

Pour l’italique, on encadre le texte par une étoile *, et pour le gras on l’encadre par deux étoiles **.

Ainsi **gras** sera traduit en gras et *italique* en italique. Pour faire du gras italique, il suffit de combiner !

*italique*
**gras**
***gras italique***

Listes à puces et à numéros

Une liste non numérotée commence par un tiret ou une étoile:

* bonjour
- hello

Une liste numérotée commence par un chiffre

1. numéro 1
2. numéro 2

Les niveaux de titres

En HTML on utilise les balises H1, H2, H3, … pour distinguer les niveaux de titre. En Markdown on utilise simplement le dièse #. Et autant de dièses pour représenter le niveau de titre

# Titre de niveau 1
## Titre de niveau 2
### Titre de niveau 3

Hyperliens et images

Pour les liens et les images c’est un peu plus subtil, mais ça reste simple.

Pour les hyperliens, on encadre le lien de parenthèses, et le nom de lien de crochets

[lien](adresse du lien)
[Les Outils Numériques](http://www.outilsnum.fr)

Pour les images c’est pareil, avec un point d’exclamation en introduction

![nom de l'image](adresse de l'image)
![Markdown logo](http://outilsnum.fr/wp-content/uploads/2015/01/logo_markdown.png)

Très bien, mais pourquoi s’embêter avec un nouveau langage?

Rédiger en Markdown présente au moins trois avantages:

  1. se concentrer sur l’écriture (pas de distraction liée à la mise en forme);
  2. garder les mains sur le clavier pour la frappe, mais aussi pour la mise en forme. Certes il existe des raccourcis clavier pour les éléments présentés au-dessus, l’intérêt du langage réside également dans la facilité qu’il offre à changer ces attributs. Par exemple pour changer le niveau d’un titre, il suffit d’ajouter ou enlever un dièse;
  3. une portabilité évidente: on est sur des fichiers texte à 100%, donc éditable sur toutes les plateformes, et tous types de logiciels, depuis le plus simple Bloc Note Windows ou TextEdit sur Mac.

Pour apprendre Markdown

Markdown
GitHub Markdown

J’avais entrepris la rédaction de article pensant qu’il existait peu d’information en français sur Markdown. Mais en préparant plus précisément pour l’article, j’ai réalisé que le web francophone avait déjà bien traité le sujet. Et je suis notamment tombé sur cet excellent tutoriel sur le site urbanbike, qui explique en 8 sections toutes les subtilités de l’écriture Markdown, et puis un autre sur OpenClassrooms également très détaillé.

Côté documents de référence, Michel Fortin a également traduit en français la syntaxe Markdown de John Gruber. Je vous conseille la lecture des pages Référence et Syntaxe de son site dédié au Markdown.

Pour les anglophones, l’excellent Michael Hyatt, déjà cité dans un article des Outils Numériques sur Evernote, a publié un billet sur son site où il explique pourquoi et comment il utilise Markdown.

Il existe également, toujours en anglais, un tutoriel par étapes sur http://markdowntutorial.com/

Des solutions pour écrire en Markdown

Markdown travaillant avec des fichiers textes, le Bloc Note de Windows ou TextEdit sur Mac pourront faire l’affaire pour l’édition. Mais comme le but du langage est de produire un fichier HTML, il peut être utile d’avoir un convertisseur facilement accessible. De plus, la pluplart des applications Markdown actuelles permettent un rendu temps-réel de votre saisie, ce qui facilite également l’apprentissage du langage.

Applications Mac & PC

  • nvAltMarkdown nvAlt (Mac) – nvAlt est une émanation de Notational Velocity, un ancien gestionnaire de notes. nvAlt présente la particularité de pouvoir conserver toutes les notes dans la même interface, et de faire des recherches rapides. D’une interface légère, nvAlt intègre également un moteur de rendu Markdown en temps réel, et la possibilité d’export en HTML – gratuit
  • LightPaperLightPaper (Mac) – beaucoup plus récent que nvAlt, LightPaper présente la particularité de fournir des « thèmes » avec une vue texte « améliorée » (gras et italiques mis en valeur dans l’éditeur, liens sur fond bleu, …), ce qui peut faciliter la lecture , ou distraire, c’est selon. Il propose également un rendu en direct et qui défile en même temps que l’éditeur, pratique pour des textes relativement longs – beta, gratuit pour le moment
  • WriteMonkey (Windows) – WriteMonkey présente le double avantage d’offrir un mode d’écriture « sans distraction », et d’autoriser l’utilisation de feuilles de style CSS pour les rendus HTML. Revers de cette médaille, la visualisation n’est pas intégrée et passe par un fichier HTML ouvert dans le navigateur – gratuit, possibilité de dons qui ouvrent les fonctionnalités de plugins

Dans le navigateur internet

Outre les applications dédiées, il existe quantité de webapps tournant directement à partir du navigateur, et donc compatibles multi-plateformes. Nous en citons ici deux, très différentes:

  • Marxico – Marxico offre la particularité de pouvoir se synchroniser avec Evernote, dans ce cas on trouve dans Evernote la version « rendue » de la saisie, et Marxico stocke également dans cette note le texte en Markdown pour édition; à noter que même si le rendu est visible dans Evernote, l’édition passe obligatoirement par Marxico – gratuit
  • Draft – Draft est une autre webapp très intéressante, notamment discutée dans l’article Hemingway 2.0 de ce site, qui va bien au-delà de la saisie de textes en Markdown – gratuit

Où utiliser le Markdown

MarkdownPour formatter des entrées de texte

Un exemple parmi d’autres: Trello autorise la saisie en Markdown dans la description d’une carte, les commentaires et les checklists, ce qui permet d’ajouter gras et italiques, et même d’intégrer des hyperliens directement dans ces champs.

Un certain nombre de forums utilisent également Markdown pour permettre d’ajouter du formatage aux messages postés. Citons notamment Github, Reddit, ou Stack Exchange.

Pour gérer son site internet

Outre la génération de pages html, qui est le but initial de Markdown, j’aimerais mentionner ici l’existence des solutions pour créer et gérer des sites internet à partir du service Dropbox, et qui passent pour certains par Markdown comme intermédiaire: vous éditez les pages de votre site en Markdown, les sauvegardez sur votre dropbox, et le service fait la conversion automatique en HTML ! DropPages est un de ces services.

Des plateformes de blogging comme WordPress ou Typepad permettent également de saisir des articles entièrement en Markdown, et s’occupent automatiquement de la conversion.

Passer du HTML au Markdown, c’est aussi possible !

Terminons cette introduction à Markdown par le mouvement inverse: grâce à l’initiative des développeurs de Marked 2, il est possible de transformer une page HTML en document Markdown. En entrant l’url de la page dans leur « Markdownifier« , il en ressort un fichier Markdown. Et ça fonctionne plutôt bien!

Je peux vous suggérer de l’utiliser pour analyser comment un article est construit, par exemple, notamment au niveau des niveaux de titres, des liens et des images.

Répondre