Parcours développement web : 59 jours de zéro à votre site en ligne
Cinquante-neuf séances d'une heure, une par jour, en quatre modules, pour celles et ceux qui n'ont jamais écrit une ligne de HTML. Le but : passer de « je ne sais pas comment une page web est faite » à « mon site est en ligne, accessible, et j'en ai écrit chaque ligne ». Aucun prérequis, aucun jargon laissé sans explication, une seule nouveauté par séance au début.
Pourquoi le développement web, et pour qui
Le web est la porte d'entrée la plus directe vers la programmation : trois langages (HTML pour la structure, CSS pour l'apparence, JavaScript pour l'interaction), un seul outil indispensable (un navigateur, déjà installé), et un résultat visible à chaque séance. Ce parcours est pensé pour les vrais débutants : chaque terme est défini la première fois qu'il apparaît, chaque exercice se fait avec des outils gratuits, et le projet final est un vrai site, publié sur une vraie adresse, que vous pourrez montrer.
La méthode, la même chaque jour
| Temps | Phase | Ce que vous faites |
|---|---|---|
| 20 min | Théorie | Le cours de la séance (sur la page du module), lu tranquillement, avec prise de notes. |
| 30 min | Pratique | Vous tapez du HTML, du CSS ou du JavaScript vous-même, vous l'ouvrez dans le navigateur, et vous le VOYEZ fonctionner. Chaque exercice a un critère de réussite explicite. |
| 10 min | Synthèse | Trois lignes dans le carnet, puis refaire l'exercice du jour sans notes. |
Taper le code à la main compte autant que le comprendre : ne copiez-collez jamais un exemple, retapez-le. Les fautes de frappe que vous corrigerez — une balise mal fermée, une accolade oubliée — sont exactement les erreurs que vous saurez réparer plus tard.
Les outils, à installer une fois (jour 1)
- Un navigateur : Firefox, Chrome, Edge ou Safari — celui que vous avez déjà fait l'affaire. C'est lui qui exécute tout ce que vous écrirez pendant les trois premiers modules.
- Un éditeur de code : VSCodium (la version 100 % libre de Visual Studio Code) est conseillé ; le Bloc-notes de Windows ou TextEdit sur Mac suffisent pour démarrer. Un éditeur de code n'est pas un traitement de texte : il enregistre du texte brut, sans mise en forme cachée.
- Un compte GitHub gratuit, à créer au module 4, pour publier votre site avec GitHub Pages, l'hébergement statique gratuit de GitHub.
- Un carnet numérique : un simple dossier de fichiers texte, un fichier par jour.
Aucune carte bancaire, aucun abonnement : tout le parcours tient sur un navigateur, un éditeur gratuit et un compte GitHub gratuit.
La règle d'or
Mieux vaut une heure tous les jours que sept heures le dimanche. Si vous ratez un jour, vous ne rattrapez pas le lendemain : vous décalez tout d'un jour, et vous rognez sur le module 4. Les séances sont numérotées J1 à J59, sans dates : seules comptent l'ordre et la régularité.
Apprendre avec une IA, sans la laisser coder à votre place
Ce parcours peut se suivre avec une IA comme répétiteur, de préférence un modèle qui tourne chez vous (voir votre premier modèle local) : vos essais ne quittent pas votre machine. Elle vous fait gagner du temps si elle vous fait travailler, et vous en fait perdre si elle écrit à votre place.
- Demandez-lui d'expliquer une erreur, de vous interroger, de relire votre code. Pas d'écrire l'exercice : le jour où vous voudrez réparer votre site seul, elle ne sera pas dans votre tête.
- Ne recopiez jamais son code sans le relire ligne par ligne et l'ouvrir dans le navigateur vous-même. Un modèle écrit du HTML plausible qui parfois n'affiche rien.
- Vérifiez ce qu'elle affirme dans la documentation officielle, MDN Web Docs : un modèle peut se tromper avec aplomb, y compris sur une balise courante.
- Ne lui collez ni mot de passe, ni donnée personnelle, ni contenu de fichiers privés.
Chaque séance se termine par un encadré « Tips agent » : comment un agent (Claude Code, Kimi Code, OpenFox) ferait la même tâche, le piège à éviter, et la preuve à lui demander. On apprend à la main, et au passage on apprend à déléguer sans se faire piéger.
Les quatre modules
Module 1 : comment le web fonctionne et le HTML, du squelette de la page aux formulaires. Module 2 : le CSS, des sélecteurs à la mise en page responsive et au mode sombre. Module 3 : le JavaScript, des variables à l'appel d'une API publique, avec trois petits widgets interactifs. Module 4 : l'accessibilité, la performance, puis Git, GitHub Pages et le projet final — un site de plusieurs pages, accessible et responsive, publié en ligne. Chaque module est une page : les séances s'y suivent, chacune avec son objectif, son cours, sa pratique pas à pas et sa synthèse. Cochez un module quand toutes ses séances sont faites ; votre progression reste dans votre navigateur.
Ressources gratuites recommandées
- MDN Web Docs — Apprendre le développement web (en français) — la référence à garder sous la main pendant tout le parcours.
- OpenClassrooms — Apprenez à créer votre site web avec HTML5 et CSS3 (gratuit, en français), en complément des modules 1 et 2.
- freeCodeCamp (gratuit, en anglais) : les certifications « Responsive Web Design » et « JavaScript Algorithms and Data Structures » prolongent les modules 2 et 3.
- web.dev — Learn Accessibility (gratuit, en anglais) : le cours qui prolonge le module 4.
- Le validateur HTML du W3C : collez-y votre page, il liste les erreurs de balisage.
La check-list de fin de parcours
- J'explique ce qui se passe entre le moment où je tape une adresse et celui où la page s'affiche.
- J'écris une page HTML complète : titres, paragraphes, liens, images, listes, formulaire.
- Je mets une page en forme avec CSS : couleurs, typographie, flexbox, grid, media queries.
- J'écris du JavaScript qui réagit aux clics et modifie la page.
- J'appelle une API publique avec fetch et j'affiche le résultat.
- Je rends une page navigable au clavier et lisible par un lecteur d'écran.
- J'utilise Git : init, add, commit, push.
- Mon site est en ligne sur GitHub Pages, accessible et responsive, et je peux expliquer chaque ligne.
Une case qui ne se coche pas n'est pas un échec : c'est la liste de ce que vous reprendrez en premier.
- 1Développement web module 1 : comment marche le web, et le HTMLJours 1 à 14 : navigateur, serveur et requêtes, puis le HTML — squelette, titres, texte, liens, images, listes, formulaires — jusqu'à votre première page complète ouverte dans le navigateur.
- 2Développement web module 2 : le CSS, l'art de la mise en formeJours 15 à 28 : sélecteurs, couleurs, typographie, boîtes, flexbox, grid, media queries et mode sombre — vos pages deviennent des pages qu'on a envie de lire.
- 3Développement web module 3 : le JavaScript, la page qui réagitJours 29 à 42 : variables, conditions, fonctions, le DOM, les événements, fetch sur une API publique, et trois widgets interactifs — compteur, liste de tâches, bascule de mode sombre.
- 4Développement web module 4 : accessible, rapide et en ligneJours 43 à 59 : accessibilité, HTML sémantique, performance, Git et GitHub Pages, puis le projet final — un site de plusieurs pages, accessible et responsive, publié et documenté.