Catégorie : Technologie

Je viens de terminer un cours sur l’accord du participe passé. Vous n’avez pas idée du temps que j’ai passé à construire ce cours ! 😃 Mais je crois que ça en vaut la peine.

Ce cours illustre la façon dont je vois les choses, et l’orientation que devrait prendre Ralentir travaux.

Je conçois depuis fort longtemps déjà qu’un site web doit être accessible et présenter une approche dynamique de la notion à appréhender. C’est ici en quelque sorte une pédagogie active qui est à l’honneur. L’apprenant (qui n’est pas forcément un élève) ne doit pas être un simple lecteur (ou alors il peut se contenter de prendre un simple manuel de grammaire sur papier), mais doit être mis à partie. Il faut le faire travailler.

C’est pourquoi cette page web présente un cours progressif faisant, par des exercices interactifs, découvrir la notion à comprendre. On trouvera alors

• Du texte
• Des fichiers audio
• Une correction (qu’un peu de JavaScript dévoile en temps voulu)
• Des vidéos
• Des images (illustration, gif animé, carte mentale)
• Des exercices interactifs

L’ensemble a été réalisé avec Coda (HTML 5, CSS, JavaScript) envoyé sur mon serveur avec Transmit (à ce propos Workflow fait le tout automatiquement : redimensionner et téléverser l’image). Mais auparavant, tout a été écrit en Markdown puis exporté en HTML avec Ulysses.

Les fichiers audio ont été créés avec GarageBand, les vidéos avec Adobe Spark Video (beaucoup d’images ont été faites avec Keynote et animées avec iMovie), la carte mentale avec MindNode, le gif animé avec GIFToaster. Les exercices ont été faits avec HotPotatoes.

Quelques apps sur iOS

Tout d’abord, quelques apps (iOS). J’aime beaucoup Daedalus Touch. Avec cette app, on peut même exporter en ePub. Il est aussi possible d’écrire en recourant au Markdown et donc en ayant un texte prêt à être publié, par exemple, dans WordPress. Pour cela, on peut aussi utiliser 1Writer ou Editorial.

Et c’est vraiment très pratique ! Donc trois apps intéressantes :

• Daedalus

• 1Writer

• Editorial

Le Markdown, pour quoi faire ?

Expliquons déjà de quoi il retourne. Comme le dit David Bosman :

je trouve ça toujours trop compliqué d’expliquer en théorie un truc qui est vraiment tout con en pratique […]

Mais essayons. On l’a vu, l’intérêt du Markdown est de sauter une étape. Au lieu d’écrire un texte puis de le formater (mettre certains mots en gras, en italique, créer des liens, etc.) en ajoutant telle ou telle balise HTML, ce qui est souvent fastidieux, on écrit son texte tout en le formatant grâce à un langage qui a le bon goût de rester discret, de ne pas encombrer le texte et donc de permettre de sauter une étape puisqu’on publie immédiatement après l’écriture du texte. De plus, c’est facile à apprendre.

Voyons un exemple.

Souvent, on écrit son texte (je prends le 2e paragraphe du présent article comme exemple) :

On peut aussi utiliser 1Writer ou Editorial. 

Et c’est vraiment très pratique ! Après on ajoute (ou on fait ajouter) les balises HTML, et mon 2e paragraphe donnerait ceci :

<p>Pour cela, on peut aussi utiliser <a href="https://appsto.re/fr/GjYO.i">1Writer</a> ou <a href="https://appsto.re/fr/UqWkO.i">Editorial</a>.<br />  
Et c'est vraiment <em>très pratique</em> !</p>

Mais en Markdown, cela donnerait ça :

On peut aussi utiliser [1Writer](https://appsto.re/fr/GjYO.i) ou [Editorial](https://appsto.re/fr/UqWkO.i).
Et c'est vraiment *très pratique* !

C’est plus épuré et on fait tout en une seule étape. L’écriture et la mise en forme. Votre WordPress saura afficher tout ça comme si c’était du HTML.

Pas convaincu ? C’est normal, mon exemple n’est pas terrible. Essayons autre chose. Vous avez déjà créé une liste en HTML ? Rien de compliqué mais ça peut être long… Encore une fois comparons HTML vs Markdown :

<ul>
<li>Daedalus</li>
<li>1Writer</li>
<li>Editorial</li>
</ul>


*   Daedalus
*   1Writer
*   Editorial

Il y a donc un gain de temps indéniable et dans l’écriture, la mise en forme et la publication puisque votre texte est prêt à être exporté en HTML ou en ePub. Cependant, le Markdown ne s’oppose pas au HTML. Comme le dit un de ses auteurs,

HTML is a publishing format ; Markdown is a writing format.

D’ailleurs on peut aussi utiliser des blocs comme<div>ou<table> pour certaines mises en forme non prise en charge par le Markdown.

Évidemment, je ne pense pas que mon article apporte grand-chose. Tout a déjà été dit. Mais il me semble qu’à l’heure où on parle beaucoup de code à l’école, ce langage n’a pas été tellement popularisé dans le monde de l’Éducation (pas tellement plus que le HTML d’ailleurs).

Les enseignants qui écrivent beaucoup ont tout intérêt à adopter ces langages (si tant est qu’on puisse vraiment parler de langage d’ailleurs). Vous publiez beaucoup ? Vous écrivez pour votre blog ? Vous écrivez des livres ? Ou vous avez un Tumblr ? Le Markdown vous ferait gagner un temps précieux.

Et que dire des élèves pour lesquels on voudrait créer une culture numérique ? À ce propos, il faudrai aussi leur apprendre la syntaxe wiki ! Tiens ! Ce sera mon prochain sujet de formation : HTML, Markdown et Wiki !

Comment apprendre le Markdown?

Le site Macgé a écrit quelques articles vous permettant de choisir votre éditeur ou encore expliquant comment écrire en Markdown dans WordPress.

WordPress vous donne d’ailleurs un peu d’aide sur le sujet. Attention ! Si vous hébergez votre WordPress, il vous faudra installer un plugin.

OpenClassroom explique également très bien les choses. Vous pouvez aussi lire l’article plutôt court de Wikipédia.

Mais le plus intéressant est probablement le site de John Gruber qui est, avec le regretté Aaron Swartz, le créateur du Markdown.

Et vous, qu’en pensez… Nan ! J’déconne ! Hein @Nicoguitare ? 😂

P.-S. Au fait, cet article a été entièrement écrit en Markdown ! 😃