PopulaireParcours
Apprendre HTML
Un cours HTML en ligne, gratuit et interactif. Tu écris du HTML à chaque leçon, avec un aperçu en direct au fil de la frappe, et un certificat gratuit à la fin.
269,396+ codders inscrits
- Adapté aux débutants
Aide au codage assistée par IA
Leçons interactives et pratiques
Narration audio dans chaque leçon
Quiz pour tester vos connaissances
Certificat gratuit de réussite
Programme
Section 1
Fundamentals
Commencer la sectionDémarrerDévelopperRéduireLearn the core structure and syntax to create web pages from scratchLes bases du HTML
5 leçons531- 01Qu'est-ce que le HTML ?Défi
- 02Structure de base du HTMLDéfiQuiz
- 03Balises et élémentsDéfiQuiz
- 04Imbrication et fermeture des balisesDéfiQuiz
- 05Commentaires en HTMLDéfiQuiz
Texte et mise en forme
6 leçons1135- 01TitresDéfiMaîtriseQuiz
- 02ParagraphesDéfiMaîtriseQuiz
- 03Sauts de ligneDéfiMaîtriseQuiz
- 04Texte en gras et italiqueDéfiMaîtriseQuiz
- 05Gras et italique (suite)DéfiMaîtriseQuiz
- 06Récapitulatif - Mise en formeDéfi
Travailler avec les listes
4 leçons721- 01Liste non ordonnéeDéfiMaîtriseQuiz
- 02Liste ordonnéeDéfiMaîtriseQuiz
- 03Listes imbriquéesDéfiMaîtriseQuiz
- 04Récapitulatif - Les listesDéfi
Fiche de recette
Projet4 leçons1- 01Aperçu du projetDéfi
- 02Titre et description de la recetteProjet
- 03IngrédientsProjet
- 04ÉtapesProjet
Ajouter du contenu
5 leçons837- 01Attributs HTMLQuiz
- 02LiensDéfiMaîtriseQuiz
- 03Liens vers une nouvelle pageDéfiMaîtriseQuiz
- 04ImagesDéfiMaîtriseQuiz
- 05Attributs d'imageDéfiMaîtriseQuiz
Mise en page
5 leçons930- 01DivisionsDéfiMaîtriseQuiz
- 02Spans en ligneDéfiMaîtriseQuiz
- 03Balises sémantiquesDéfiMaîtriseQuiz
- 04Sections et articlesDéfiMaîtriseQuiz
- 05Récapitulatif - Mise en pageDéfi
Page de profil personnel
Projet5 leçons1- 01Présentation du projetDéfi
- 02Section d'en-têteProjet
- 03Photo de profilProjet
- 04Section À propos de moiProjet
- 05Liens sociauxProjet
Formulaires et champs de saisie, partie 1
6 leçons936- 01Bases des formulairesQuiz
- 02Champs de texteDéfiMaîtriseQuiz
- 03Attributs des champsDéfiMaîtriseQuiz
- 04Champ de mot de passeDéfiMaîtriseQuiz
- 05Libellés pour les champsDéfiMaîtriseQuiz
- 06Récapitulatif - Formulaire de baseDéfi
Formulaires et entrées, partie 2
7 leçons1239- 01Boutons radioDéfiMaîtriseQuiz
- 02Cases à cocherDéfiMaîtriseQuiz
- 03Listes déroulantesDéfiMaîtriseQuiz
- 04BoutonsDéfiMaîtriseQuiz
- 05Boutons dans les formulairesDéfiMaîtriseQuiz
- 06Récapitulatif - Formulaires n°1Défi
- 07Récapitulatif - Formulaires n°2Défi
Tableaux
4 leçons723- 01Bases des tableauxDéfiMaîtriseQuiz
- 02Ajouter des légendesDéfiMaîtriseQuiz
- 03Fusionner des lignes et des colonnesDéfiMaîtriseQuiz
- 04Récapitulatif - TableauxDéfi
Page d'inscription à un événement
Projet5 leçons1- 01Aperçu du projetDéfi
- 02Section d'en-têteProjet
- 03Section des détails de l'événementProjet
- 04Formulaire d'inscriptionProjet
- 05Section de pied de pageProjet
Défis finaux
4 leçons4- 01Carte de profil simpleDéfi
- 02Carte d'invitation à un événementDéfi
- 03Page d'article simpleDéfi
- 04Liste de livres favorisDéfi
Section 2
Styling with CSSPage dédiée
Commencer la sectionDémarrerDévelopperRéduireBring your web pages to life with colors, layouts, and stylesIntroduction
5 leçons540- 01Qu'est-ce que le CSS ?DéfiQuiz
- 02Syntaxe CSSDéfiQuiz
- 03Commentaires CSSQuiz
- 04La balise HeadDéfiQuiz
- 05La balise TitleDéfiMaîtriseQuiz
Ajouter du CSS
4 leçons725- 01CSS en ligneDéfiMaîtriseQuiz
- 02CSS interneDéfiMaîtriseQuiz
- 03CSS externeDéfiMaîtriseQuiz
- 04Défi de stylisation de baseDéfi
Sélecteurs de base
7 leçons1247- 01Introduction aux sélecteursDéfiQuiz
- 02Sélecteur de typeDéfiMaîtriseQuiz
- 03Sélecteur de classeDéfiMaîtriseQuiz
- 04Sélecteur d'IDDéfiMaîtriseQuiz
- 05Sélecteurs de groupeDéfiMaîtriseQuiz
- 06Sélecteur universelDéfiMaîtriseQuiz
- 07Défi de sélectionDéfi
Les bases du texte
8 leçons1450- 01Couleur du texteDéfiMaîtriseQuiz
- 02Famille de policesDéfiMaîtriseQuiz
- 03Taille de policeDéfiMaîtriseQuiz
- 04Graisse de policeDéfiMaîtriseQuiz
- 05Alignement du texteDéfiMaîtriseQuiz
- 06Décoration du texteDéfiMaîtriseQuiz
- 07Défi récapitulatif n°1Défi
- 08Défi récapitulatif n°2Défi
Couleurs et arrière-plans
5 leçons834- 01Couleur d'arrière-planDéfiMaîtriseQuiz
- 02Couleurs HEXDéfiMaîtriseQuiz
- 03Couleurs RGBDéfiMaîtriseQuiz
- 04Transparence avec RGBADéfiQuiz
- 05Défi récapitulatif n°1Défi
Menu de café
Projet3 leçons1- 01Bases de la typographieDéfi
- 02Style du texteProjet
- 03Couleurs et arrière-plansProjet
Modèle de boîte - Partie 1
6 leçons943- 01Qu'est-ce que le Modèle de boîte ?Quiz
- 02PaddingDéfiMaîtriseQuiz
- 03MargesDéfiMaîtriseQuiz
- 04BorduresDéfiMaîtriseQuiz
- 05Largeur et HauteurDéfiMaîtriseQuiz
- 06Défi récapitulatifDéfi
Modèle de boîte, partie 2
5 leçons834- 01Box SizingDéfiQuiz
- 02Border RadiusDéfiMaîtriseQuiz
- 03OverflowDéfiMaîtriseQuiz
- 04Box ShadowDéfiMaîtriseQuiz
- 05Défi récapitulatifDéfi
Flex Box
6 leçons943- 01Qu'est-ce que le Flex Box ?DéfiQuiz
- 02Flex DirectionDéfiMaîtriseQuiz
- 03Justify ContentDéfiMaîtriseQuiz
- 04Align ItemsDéfiMaîtriseQuiz
- 05Le centrage parfaitDéfiQuiz
- 06Défi Flex BoxDéfi
Formulaire de connexion
Projet4 leçons1- 01CorpsDéfi
- 02Conteneur du formulaireProjet
- 03Champ de saisieProjet
- 04BoutonProjet
Techniques de mise en page
7 leçons1152- 01Éléments Block vs InlineDéfiQuiz
- 02Les bases du positionnementDéfiMaîtriseQuiz
- 03Positionnement relatifDéfiMaîtriseQuiz
- 04Positionnement absoluDéfiMaîtriseQuiz
- 05Positionnement fixeDéfiMaîtriseQuiz
- 06Les bases du Z-IndexDéfiQuiz
- 07Défi récapitulatifDéfi
Bases du Responsive Design
6 leçons1052- 01Qu'est-ce que le Responsive Design ?DéfiQuiz
- 02Balise meta ViewportDéfiQuiz
- 03Mises en page fluidesDéfiMaîtriseQuiz
- 04Unités de ViewportDéfiMaîtriseQuiz
- 05Bases des Media QueriesDéfiMaîtriseQuiz
- 06Images flexiblesDéfiMaîtriseQuiz
Page Web Tonga
Projet6 leçons1- 01Menu de navigationDéfi
- 02En-tête de bienvenueProjet
- 03Section À proposProjet
- 04Section ContactProjet
- 05Balise ViewportProjet
- 06Media QueryProjet
Défis finaux
4 leçons4- 01Disposer les élémentsDéfi
- 02Liste de filmsDéfi
- 03Carte d'invitation de mariageDéfi
- 04Notification flottanteDéfi
Section 3
CSS MasteryPage dédiée
Commencer la sectionDémarrerDévelopperRéduireTake you css skills to the next level!Maîtrise des sélecteurs – Combinaisons
6 leçons539- 01IntroductionQuiz
- 02Sélecteur de descendantDéfiQuiz
- 03Sélecteur d'enfantDéfiQuiz
- 04Sélecteur de frère adjacentDéfiQuiz
- 05Sélecteur de frère généralDéfiQuiz
- 06Défi récapitulatifDéfi
Pseudo-classes interactives
5 leçons431- 01Pseudo-classesQuiz
- 02Effets de survolDéfiQuiz
- 03Effets de focusDéfiQuiz
- 04Styles actifsDéfiQuiz
- 05Défi récapitulatifDéfi
Pseudo-classes structurelles
5 leçons432- 01Pseudo-classes structurellesQuiz
- 02Cibler le premier enfantDéfiQuiz
- 03Cibler le dernier enfantDéfiQuiz
- 04La puissance des motifs : utiliser nth-childDéfiQuiz
- 05Défi récapitulatifDéfi
Projet de menu déroulant
4 leçons4- 01Ajouter le sous-menuDéfi
- 02Afficher le sous-menuDéfi
- 03Plus de stylesDéfi
- 04Input et boutonDéfi
Effets visuels
5 leçons536- 01DégradésDéfiQuiz
- 02Filtres CSSDéfiQuiz
- 03TransformationsDéfiQuiz
- 04Transitions et effets de survolDéfiQuiz
- 05Défi récapitulatifDéfi
Landing Page
5 leçons5- 01Styler la section d'en-têteDéfi
- 02Styler le boutonDéfi
- 03Mise en page de la sectionDéfi
- 04Mise en page des cartesDéfi
- 05Ajouter les touches finalesDéfi
Construire avec CSS Grid
4 leçons426- 01Les bases de GridDéfiQuiz
- 02Placement d'éléments Grid-rowDéfiQuiz
- 03Zones nomméesDéfiQuiz
- 04Défi récapitulatifDéfi
Site web Flavor Fiesta
4 leçons4- 01Configuration de la grilleDéfi
- 02En-têteDéfi
- 03La partie principaleDéfi
- 04Pied de pageDéfi
Défis finaux
5 leçons5- 01Mise en évidence du menu actifDéfi
- 02Lignes de tableau en zèbreDéfi
- 03Effet de survol de boutonDéfi
- 04Mise en page de cartes en GridDéfi
- 05Image Hero floutéeDéfi
Section 4
Practical Frontend
Commencer la sectionDémarrerDévelopperRéduireCombine structure and style to design complete, responsive web pagesVariables
5 leçons432- 01VariablesQuiz
- 02Utiliser les variables CSSDéfiQuiz
- 03Variables pour les Design TokensDéfiQuiz
- 04Variables localesDéfiQuiz
- 05Défi récapitulatifDéfi
Stratégie Mobile-First
6 leçons643- 01Ce que signifie « mobile-first »DéfiQuiz
- 02Typographie Mobile-FirstDéfiQuiz
- 03Navigation Mobile-FirstDéfiQuiz
- 04Images Mobile-FirstDéfiQuiz
- 05Formulaires Mobile-FirstDéfiQuiz
- 06Défi récapitulatifDéfi
Thèmes et styles visuels
5 leçons535- 01Les thèmes en CSSDéfiQuiz
- 02Les bases du mode sombre/clairDéfiQuiz
- 03Couleurs d'accentuation et mise en évidenceDéfiQuiz
- 04Thématisation de la typographieDéfiQuiz
- 05Défi récapitulatifDéfi
Sports extrêmes
3 leçons3- 01VariablesDéfi
- 02Mobile-FirstDéfi
- 03ThématisationDéfi
Composants UI
6 leçons642- 01Menu déroulantDéfiQuiz
- 02OngletsDéfiQuiz
- 03BadgesDéfiQuiz
- 04Info-bullesDéfiQuiz
- 05Bannières de notificationDéfiQuiz
- 06Défi récapitulatifDéfi
Modèles Responsive
6 leçons645- 01Mise en page Holy GrailDéfiQuiz
- 02Grille de cartesDéfiQuiz
- 03Mise en page Barre latérale + ContenuDéfiQuiz
- 04Mise en page Écran scindéDéfiQuiz
- 05En-tête / Pied de page StickyDéfiQuiz
- 06Défi récapitulatifDéfi
Défis finaux
4 leçons4- 01Carte de profilDéfi
- 02Grille de galerie de chocolatsDéfi
- 03Sept merveillesDéfi
- 04Sept nouvelles merveillesDéfi
Section 5
JavaScript in Action
Commencer la sectionDémarrerDévelopperRéduireExplore how javascript is used with html and cssInteractivité / Composants UI
4 leçons433- 01OngletsDéfiQuiz
- 02Accordéon (développer/réduire)DéfiQuiz
- 03Modale (ouvrir/fermer)DéfiQuiz
- 04Menu déroulantDéfiQuiz
Formulaires et validation
3 leçons324- 01Validation des saisiesDéfiQuiz
- 02Messages d'erreur personnalisésDéfiQuiz
- 03Boutons de soumissionDéfiQuiz
Notifications et Retours
3 leçons327- 01Message toastDéfiQuiz
- 02Bannières refermablesDéfiQuiz
- 03Indicateurs de chargementDéfiQuiz
Formulaire avec notification Toast
2 leçons2- 01Afficher le message ToastDéfi
- 02Masquer le message ToastDéfi
Navigation
3 leçons329- 01Bascule du menu burger mobileDéfiQuiz
- 02Navigation latérale repliableDéfiQuiz
- 03Menus déroulantsDéfiQuiz
Thèmes et personnalisation
2 leçons217- 01Thèmes sombre/clairDéfiQuiz
- 02Enregistrer le choix du thèmeDéfiQuiz
Animations et effets
3 leçons327- 01Transitions CSSDéfiQuiz
- 02Animer des éléments au défilementDéfiQuiz
- 03Animations au clic sur un boutonDéfiQuiz
Navigation animée
3 leçons36- 01VariablesDéfiQuiz
- 02Écouteurs d'événementsDéfi
- 03Transition CSSDéfi
Défis finaux
4 leçons4- 01Accordéon FAQ interactifDéfi
- 02Formulaire de connexionDéfi
- 03Barre de navigation responsiveDéfi
- 04Page de blog avec thèmeDéfi
Cours de HTML
Cours pratiques de HTML, gratuits à démarrer dans votre navigateur.
Animation d'éclipse solaire | Projet HTML/CSS
PopulaireDans ce cours, vous allez créer une superbe animation d'éclipse solaire, illustrant comment concevoir des interfaces utilisateur attrayantes et fonctionnelles grâce aux animations.
- 10
- 2
Défis HTML/CSS - Pack I
PopulaireCe cours mettra vos connaissances en HTML et CSS à l'épreuve de manière ludique et efficace !
- 11
Lecteur vidéo YouTube - Projet HTML
Dans ce projet, vous créerez un lecteur vidéo YouTube avec HTML tout en explorant divers attributs.
- 7
- 1
Projet DOM - Calculatrice
Dans ce cours, vous allez créer une calculatrice simple et interactive en utilisant HTML, CSS et JS.
- 14
- 3
Clone de page Instagram | Projet Front-End
Dans ce cours, vous mettrez en pratique des approches HTML & CSS simples et standards pour créer un projet de clone de page Instagram.
- 16
- 5
Carte 3D | Projet Front-end
Dans ce projet, vous allez créer vous-même un design de carte 3D !
- 31
- 4
Pourquoi apprendre HTML avec Coddy
- Tu écris du HTML dans ton navigateur et tu vois la page rendue juste à côté. Aucun éditeur à installer, aucune config. Chaque modification du code HTML s'affiche en direct, la boucle de feedback est courte.
- HTML moderne et sémantique : titres, listes, liens, images, tableaux, formulaires, et balises sémantiques comme
<header>,<nav>,<main>,<section>,<footer>. Le HTML que tu utiliserais vraiment pour construire un site web. - Les indices IA t'aident à corriger tes erreurs HTML - balises non fermées, syntaxe d'attribut cassée, oublis d'accessibilité - sans dévoiler la réponse, pour que les bons réflexes rentrent.
- Certificat HTML gratuit à la fin du cours. Une première étape crédible vers le développement web, qui se marie naturellement avec les cours de CSS et JavaScript.
Questions fréquentes sur l’apprentissage de HTML
HTML est-il facile à apprendre ?
HTML, c'est l'une des choses les plus faciles à apprendre dans la tech. C'est un langage de balisage, pas un langage de programmation - tu étiquettes des morceaux de contenu (titres, paragraphes, liens, images) plutôt que d'écrire de la logique. La plupart des débutants construisent leur première vraie page web dès la première heure.
Combien de temps faut-il pour apprendre HTML ?
Les bases de HTML s’apprennent souvent en une à deux semaines de pratique quotidienne. Pour être à l’aise sur des projets réels, compte plutôt un à trois mois selon ton rythme.
Faut-il apprendre HTML avant CSS et JavaScript ?
Oui. HTML définit la structure d'une page, CSS contrôle son apparence et JavaScript la rend interactive. En apprenant HTML en premier, tu as quelque chose de concret à styliser et animer ensuite. Le cours HTML est court exprès pour que tu puisses passer rapidement à CSS et JS.
HTML est-il un langage de programmation ?
Au sens strict, non. HTML est un langage de balisage qui sert à décrire la structure du contenu web. Il n'a ni variables, ni conditions, ni boucles en lui-même. La vraie programmation sur une page web vient de JavaScript, traité dans un cours à part.
Est-ce que je peux apprendre le HTML en ligne gratuitement ?
Oui. Le cours interactif de HTML est gratuit - leçons, exercices de code, aperçu HTML en direct et un certificat. Tout tourne dans le navigateur, donc tu n'as aucun éditeur ni outil à installer pour te lancer.
Est-ce que je reçois un certificat après le cours HTML ?
Oui. En terminant le cours HTML, tu obtiens un certificat de fin de formation gratuit. Une preuve vérifiable à ajouter à ton CV ou à partager sur LinkedIn - souvent comme étape vers un portfolio plus complet en HTML, CSS et JavaScript.
