8. Rédaction, typographie, visuel, graphisme, ergonomie navigation
Section outline
-
Les cours Concevoir avec Moodle, Outlook sur le Web, Utilisation du Chromebook en classe, Créer des organisateurs graphiques avec Miro utilisent tous le gabarit de base produit par l'équipe de Campus RÉCIT. Bien que ce gabarit ne soit pas obligatoire, il permet de structurer les contenus de façon aisément repérable et segmentée.
Exemples :
Gabarit de cours
Concevoir avec Moodle
Outlook sur le Web
Utilisation du Chromebook en classe
Créer des organisateurs graphiques avec MiroIl devrait toujours être évident pour l'apprenant où il se trouve dans les contenus, ce qu'il doit faire et où aller ensuite. On doit régulièrement ajouter des consignes pour guider l'apprenant dans les contenus et vers les prochaines étapes.
Exemples :
Dans cette page de la formation Chromebook, l'apprenant sait qu'il doit visionner la vidéo, puis compléter l'interactivité, compléter le journal de bord s'il le souhaite puis passer à la prochaine page en utilisant le menu de gauche."Bien que cet aspect puisse être subjectif, quelques bonnes pratiques sont à prendre en compte. Respectez une cohérence visuelle, iconographique et typographique. Tendez vers la simplicité afin de rendre vos contenus accessibles.Les services de la personne graphiste du RÉCIT peuvent être sollicités pour vous aider à améliorer l'aspect visuel de vos pages et les services du technicien du RÉCIT peuvent être demandés pour vous aider à améliorer le code HTML de vos contenus, via le formulaire de demande de service de Campus RÉCITUne révision linguistique doit avoir été faite et, idéalement, par plus d'une personne.L'équipe de Campus RÉCIT ne fera pas une révision linguistique lors de la validation des cours, mais relèvera quelques coquilles, le cas échant. Portez une attention particulière aux espaces insécables lorsque vous utilisez les guillemets français « ».Assurez-vous de respecter la hiérarchie des titres : H1, H2, H3, Paragraphe...
Il ne faut pas utiliser les niveaux de titre (H) pour grossir la police, mais bien pour structurer les contenus.
Exemples :
Dans cette page, le nom de la page est par défaut H1, puis le premier titre est un H2 et le titre suivant en H3 créant une hiérarchie cohérente des contenus.Il faut utiliser au maximum les fonctionnalités natives de Moodle et éviter d'enchâsser les contenus externes comme Genial.ly, page Web, etc.
Cela nuit au référencement des ressources, à la navigation sur de multiples plateformes et nuit à l'expérience utilisateur. Pour une interactivité, privilégiez l'intégration d'activité H5P plutôt que Genial.ly.
Exemples :
Dans cette page de la formation Enseigner avec Teams, l'image interactive a été créée à l'aide H5P, directement dans MoodleL'affichage dans un nouvel onglet devrait être utilisé au minimum et pour des raisons spécifiques. Il s'agit d'un principe d'accessibilité pour aider les personnes non voyantes, les personnes qui naviguent à l'aide du clavier et les personnes qui utilisent un appareil mobile.
Exemples :
Dans cette page de ressources, les liens externes s'ouvrent dans le même onglet
Ce principe est expliqué dans cet article (en anglais).Lorsque des liens pointent vers des documents externes, ceux-ci devraient idéalement être inclus dans les ressources du cours et non dans un service infonuagique tierce. Cela assure la pérennité des documents.
Exemples :
Dans la formation Les questionnaires interactifs en soutien à l’apprentissage, un tableau est aussi mis à disposition en format PDF. Ce PDF a été déposé dans Campus RÉCIT. Pour ce faire, il suffit d'écrire dans l'éditeur ATTO et en ajoutant un lien, on pourra ajouter un fichier.Les images du cours sont de poids et de dimensions raisonnables (Ne pas redimensionner une image dans le code HTML mais dans votre outil d'édition)
Exemples :
Un tutoriel sera bientôt disponible