Accueil Enseignement Lexique Digitalisation plurimédia

GABARITS NUMÉRIQUES

Templates de supports pédagogiques
pour la publication en ligne

OUTILS POUR UTILISER LES GABARITS NUMÉRIQUES

Voici la liste des outils permettant d'utiliser les gabarits de supports mis à disposition sur ce site.

Éditeurs Markdown

Le Markdown est un langage de balisage léger permettant de structurer puis styliser facilement un texte. Tout support pédagogique rédactionnel devrait d'abord être édité en Markdown pour, ensuite, être présenté de plusieurs manières, hors ligne ou en ligne !

Quelques ressources sur le langage markdown :

Éditeurs Markdown en ligne

StackEdit (appli recommandée)

StackEdit est un éditeur Markdown en ligne entièrement gratuit. Les documents créés peuvent être sauvegardés sur Google Drive.

➜ Un cours en ligne permet de prendre en main cet outil très performant : Utiliser StakEdit.

Quelques ressources complémentaire sur Stackedit :

➜ Des vidéos concernant StackEdit sont disponibles sur YouTube.

Accéder au site de StackEdit


CodiMD (version Éducation)

CodiMD est un éditeur Markdown collaboratif, utilisable gratuitement. L'instance proposée ici en lien est rattachée au site apps.education.fr et nécessite une identification via l'instance de CodiMD pour sauvegarder ses documents.

Cet outil, comme vous allez le découvrir sur les sites listés plus bas, permet de publier des contenus en ligne en les structurant en langage Markdown. C'est aussi un éditeur markdown très simple permettant d'exploiter les gabarits proposées sur cette page.

Quelques ressources complémentaire sur CodiMD :

➜ Des vidéos concernant CodiMD sont disponibles sur YouTube.

Accéder à l'instance de CodiMD


HackMD (pour les geeks)

HackMD est un éditeur Markdown collaboratif, utilisable gratuitement (... avec quelques limitations). L'offre Prime permet de bénéficier de fonctionalités supplémentaires (parmi lesquelles le contrôle des permissions).

Quelques ressources complémentaire sur HackMD (en anglais) :

➜ Des vidéos concernant KackMD sont disponibles sur YouTube (toujours en anglais).

Accéder au site de HackMD


Éditeurs Markdown hors ligne

PanWriter (Windows, macOs, Linux)

PanWriter est un éditeur Markdown gratuit pour Windows, macOs et Linux. Il est nécessaire d'installer Pandoc sur le poste de travail pour pouvoir exporter les documents dans tous les formats proposés. PanWriter peut être testé en ligne..

➜ Un manuel (en anglais) permet de prendre en main panWriter : PanWriter manual.

Accéder au site de PanWriter


MacDown (macOs)

MacDown est un éditeur Markdown gratuit pour macOs seulement. Très simple d'utilisation, MacDown est une reprise open source d'un ancien éditeur pour macOs : Mou..

MacDown permet assez facilement de personnaliser, avec un éditeur de texte, les feuilles de styles utilisées. Il est facile d'en rajouter ou d'en enlever. Il est possible d'utiliser des feuilles de style “classless”. De très nombreux styles graphiques sont donc implémentables dans MacDown.

➜ Une page du site (en anglais) permet de prendre en main l'éditeur MacDown : Features.

Accéder au site de MacDown


Obsidian (Windows, macOs, Linux)

Obsidian est bien plus qu'un éditeur Markdown gratuit pour (Windows, macOs, Linux). Il s'agit d'un véritable gestionnaire de notes en Markdown, doté de très nombreuses fonctionnalités.

Les notes gérées avec Obsidian sont interconnectables (comme les pages d'un site Web). Un affichage sous forme de graphe permet de visualiser les connections entre toutes les notes et de naviguer dans les dossiers dans lesquelles elles sont enregistrées.

Il est possible de présenter les contenus des pages sous forme de cartes reliées entre elles. Chaque note ou page Markdown est affichable sous forme de Markmap en installant un plugin (faites un recherche “mindmap” sur la page des plugins d'Obsidian).

Moyennant un abonnement (8$ par mois), il est possible de publier ses notes en ligne. Il est donc envisageable de publier un ensemble de ressources pédagogiques (cours, quizz, wikis, blogs, ...) en utilisant uniquement Obsidian.

➜ Vous trouverez de nombreuses ressources en ligne sur l'utilisation d'Obsidian. Celle-ci est un exemple pour un module expert (payant) : school.eliottmeunier.com.

➜ Cheikh, coach et formateur, propose des formations pour mieux utiliser Obsidian (la première est gratuite et déjà très utile) : cerveau-numerique.fr.

Accéder au site d'Obsidian

Éditeurs HTML

Le HTML est le langage de balisage permettant de structurer une page Web. Des connaissances de base en HTML permettent de lire un code source de page Web (dans un éditeur HTML) pour en modifier les contenus : textes, images et liens hypertextes.

Les éditeurs HTML sont des éditeurs de code nommés aussi éditeurs de texte (à ne pas confondre avec des outils de traitement de texte). Ils sont qualifiés de WYSIWYG quand il est possible d'effectuer l'édition en modifiant directement la prévisualisation du contenu. WYSIWYG est l'acronyme de “What You See Is What You Get

Quelques ressources sur le langage HTML :

Éditeur HTML en ligne (WYSIWYG)

Éditeurs HTML en ligne (non WYSIWYG)

Phoenix

Éditeurs HTML hors ligne (non WYSIWYG)

Brackets

VS Codium

GABARITS ou TEMPLATES

Les gabarits ou templates mis à disposition sur ce site sont librement personnalisables. Plusieurs ressources sont à l'entête du GRETA Auvergne, d'autres sont à l'entête du Pôle Plurimédia. Modifiez les entêtes ou les pieds de page en fonction de vos utilisations.

Gabarits Markdown

Gabarit de progression pédagogique

Le gabarit de progression pédagogique proposé permet au coordonateur du pôle plurimédia de mettre à jour le site sur lequel sont publiées toutes les progressions pédagogiques des formations dispensées sur le pôle.

Ce gabarit de progression pédagogique permet aussi de transmettre aux apprenants le programme des formations, ainsi que des renseignements précis sur les pré-requis et les compétences à acquérir.

Télécharger le gabarit de progression pédagogique


Gabarit d'attestation de capacités

Le gabarit d'attestation de capacités permet à chaque formateur de transmettre au secrétariat pédagogique un bilan d’acquisition des compétences, complété en fin de formation.

Les compétences à valider sont précisément celles listées dans la progression pédagogique. Chaque compétence rapporte à une action observable et évaluable objectivement (à l’aide d’un quiz, d’un exercice pratique, d’un projet pro, etc.).

Télécharger le gabarit d’attestation de capacités

➜ Dans Obsidian (voir plus haut), gestionnaire de notes en Markdown, les X entre crochets — [X] — s'affichent sous forme de cases à cocher (cochées par défaut dans le gabarit proposé).



Gabarits HTML

L'utilisation de ces gabarits nécessite des connaissances de base en édition HTML. La gestion des images et des textes dans un site statique est une compétence minimum requise pour tirer profit des modèles proposés.

Gabarits de cours basiques (sans menu)

Les gabarits de cours basiques sont des sites “one page”, sans menu, permettant l'intégration de textes et d'images, pour présenter en ligne un processus chronologique ou opérationnel en quelques étapes clés.

Gabarit basique gris

Ce gabarit est en niveaux de gris. Les images de maquette appelées en ligne sont à remplacer par d'éventuelles captures d'écran à placer au préalable dans le dossier “img”.

Télécharger le gabarit HTML basique gris


Gabarit basique brique

Ce gabarit utilise un camïeu de rouges briques. Les niveaux de luminosité des couleurs utilisées sont étagés pour optimiser la visibilité des contenus. Comme pour le précédent gabarit, les images de maquette appelées en ligne sont à remplacer par d'éventuelles captures d'écran à placer au préalable dans le dossier “img”.

Télécharger le gabarit HTML basique brique


Gabarit basique vert

Ce gabarit utilise un camïeu de verts “plurimédia”. Les niveaux de luminosité des verts utilisés sont étagés pour optimiser la visibilité des contenus. La feuille de style CSS de ce gabarit utilise des variables pour faciliter la personnalisation des couleurs utilisées. Comme pour le précédent gabarit, les images de maquette appelées en ligne sont à remplacer par d'éventuelles captures d'écran à placer au préalable dans le dossier “img”.

Télécharger le gabarit HTML basique vert


Gabarits de cours adaptatifs (avec menu)

Les gabarits de cours avec menu sont des sites “one page” adaptatifs avec menu fixe, permettant l'intégration de textes et d'images, pour présenter en ligne une activité ou un processus à mener en plusieurs étapes.

Gabarit avec menu v1

Ce gabarit avec menu est en niveaux de gris. Il reprend la présentation des gabarits basiques. Les images de maquette appelées en ligne sont à remplacer par d'éventuelles captures d'écran à placer au préalable dans le dossier “img”.

Télécharger le gabarit HTML avec menu v1


Gabarit avec menu v1-bis

Ce gabarit est identique au précédent mais il intègre des accordéons (sections dépliables ou repliables à la demande).Vous pouvez voir un exemple d'utilisation de ce gabarit sur graphizm.fr

Télécharger le gabarit HTML avec menu v1-bis


Gabarit avec menu v2

Ce gabarit est destiné à présenter les consignes de déroulement d'une activité. Des critères de réussite de l'activité sont présentés en liste en fin de page. Ce gabarit avec menu utilise un camïeu de bleus. Les niveaux de luminosité des couleurs utilisées sont étagés pour optimiser la visibilité des contenus. Comme pour les précédents gabarits, les images sont à remplacer par vos propres illustrations, à placer au préalable dans le dossier “img”.

Télécharger le gabarit HTML avec menu v2

Un minimum de connaissances informatiques permet de conserver la main sur un aspect essentiel de la documentation pédagogique : le stockage des données publiées.

Comité de pilotage | Organisation pédagogique du Pôle Plurimédia

CMS SANS BASE DE DONNÉES

Les CMS sans base de données (CMS flat-file) sont des systèmes de gestion de contenus écrivant les contenus dans des fichiers en texte brut, rapidement accessibles. Ils permettent de créer des sites Web faciles à transférer d'un poste local sur un serveur ou tout simlement d'un endroit à un autre sur un poste de travail.

Vous trouverez une présentation détaillée des CMS flat-file (ou CMS de fichiers plats) sur deux articles du guide digital de Ionos.

➜ Vous l'avez compris, les CMS sans base de données conviennent parfaitement à l'édition de cours sous forme de sites multipages, en local (sur votre poste) ou en ligne.

Ionos présente trois CMS flat-file dans l'un des articles mentionnés plus haut. Le premier (GetSimpleCMS) ne semble plus documenté, bien que des mises à jour aient été faites récemment. les autres (Grav et Kirby), sont des solutions professionnelles relativement complexes pour les débutants. Le CMS Yellow, présenté ci-dessous, est une solution idéale pour commencer à utiliser un CMS.



Le CMS flat-file Yellow

Yellow, édité par Datenstrom, sous la direction de Mark Seuffert, développeur suédois, est petit CMS flat-file simple à prendre en main. Cet outil permet de créer des sites multipages, des blogs et des wikis. Les trois différentes structures de contenus peuvent se connecter les unes aux autres. Un enseignant-formateur dispose alors d'une trousse à outil de base lui permettant d'éditer ses cours en ligne sans grande difficulté.

Pour utiliser Un CMS sans base de données, il est nécessaire de savoir installer et utiliser un serveur virtuel sur son poste (WAMP ou XAMP sur PC et MAMP sur Mac). Pour mettre ses productions en ligne, l'enseignant-formateur doit disposer d'un hébergement et savoir utiliser un logiciel client FTP pour transférer ses sites de son poste sur les serveurs de son hébergeur.

Quelques sites réalisés dans le cadre des formations dispensées sur le Pôle Plurimédia vous permettent de découvrir la manière d'utiliser le CMS Yellow sous ses trois formes (site, blog, wiki).

Les trois sites ci-dessous intègrent des liens permettant d'aller de l'un à l'autre. D'autres liens permettent de découvrir des publications réalisées ici et là avec Yellow.

Accéder au site de Yellow



Les autres CMS flat-file

D'autres CMS flat-file sont disponibles sur le Web. Certains sont très rudimentaires, d'autres beaucoup plus sophistiqués. Ils sont présentés ici car chacun propose un ou plusieurs thèmes graphique de présentation des contenus (textes et images). Ces thèmes structurent et stylisent les informations des cours mis en ligne, de telle sorte que je les assimile à des gabarits.

Vous trouverez une présentation des principaux CMS flat-file sur l'excellent site allemand cmsstash.de. Les avis donnés sur chaque CMS sont pertinents. De plus, en naviguant sur l'ensemble du site, vous trouverez un maximum d'informations pertinentes sur les CMS en général.

Accéder au site cmsstash.de

Aller à “Outils TICE”