L’apprentissage du HTML couplé à son copain le CSS passe par l’utilisation d’outils à la fois pratiques et simples afin de se compliquer le moins possible l’existence.
Les tutoriels et livres consacrés à ses sujets préconisent le plus souvent l’emploi d’un éditeur texte (genre Notepad++) pour créer des fichiers puis de les ouvrir dans un navigateur Web pour voir les résultats obtenus.
Cela fonctionne parfaitement, mais la démarche est quand même un peu lourde et répétitive.
Pour faciliter les choses, Mozilla met à disposition des apprentis programmeurs un outil en ligne appelé Mozilla Thimble, pour saisir et exécuter du code HTML et du CSS (feuilles de style). Il est même prévu de publier et de partager son code.
L’application est très bien faite et permet soit de partir de zéro (Start from scratch) pour créer une page Web, soit d’étudier les projets déjà en ligne afin de les étudier et de s’en inspirer (Pick a project).
La page blanche contient le squelette et les quelques balises nécessaires à tout projet, puis c’est à vous de jouer. L’interface est volontairement minimaliste :
- Les lignes sont numérotées
- Fonctions d’annulation
- Taille de texte
- Conseils
- Correction des erreurs
- Coloration syntaxique
- Indentation
- …
L’éditeur est vraiment agréable à utiliser et les conseils souvent judicieux. A droite de l’écran on voit instantanément son code prendre forme dans une zone de prévisualisation où la page HTML se construit au fur et à mesure de la saisie. On peut très bien copier du code existant pour l’examiner et le modifier, les changements apportés sont immédiatement répercutés dans la fenêtre de visualisation.
A ce titre, Mozilla Thimble constitue un remarquable outil d’apprentissage que vous pouvez utiliser en plus de l’excellent site Code Academy dont j’ai déjà parlé et qui depuis s’est considérablement étoffé proposant maintenant des cours complets pour les débutants en HTLM, CSS et Javascript dans un style direct sans verbiage théorique.
Note : Mozilla Thimble n’existe plus. L’application peut être remplacée par Code Pen.
Les commentaires sont fermés.