Formation Créer des sites web dynamiques avec HTML5 et CSS3

Introduction au Web et aux rôles HTML/CSS

• —Comprendre le fonctionnement d'Internet et du Web (client/serveur)
• —Présentation d'HTML et CSS, leurs rôles complémentaires
• —Outils de développement : éditeurs de code, navigateurs, outils de développement
• —Structure de base d'un document HTML

Les fondamentaux du HTML5 : Structure et sémantique

• —Balises de base : `<html>`, `<head>`, `<body>`
• —Balises sémantiques de structure : `<header>`, `<nav>`, `<main>`, `<article>`, `<section>`, `<footer>`
• —Gérer les titres (`<h1>` à `<h6>`) et les paragraphes (`<p>`)
• —Introduction aux listes (ordonnées, non-ordonnées, de définition)

Liens et images : Navigation et médias fondamentaux

• —Création de liens hypertexte (`<a>`) : absolus, relatifs, ancres
• —Insertion d'images (`<img>`) : attributs `src`, `alt`, `width` et `height`
• —Introduction aux chemins de fichiers (relatifs/absolus)
• —Optimisation des images pour le web

Tableaux et formulaires HTML5

• —Création de tableaux avec `<table>`, `<thead>`, `<tbody>`, `<tr>`, `<th>`, `<td>`
• —Fusion de cellules (`rowspan`, `colspan`)
• —Balises de formulaire : `<form>`, `<input>`, `<textarea>`, `<select>`, `<button>`
• —Types d'input HTML5 (email, url, number, date, etc.)

Introduction au CSS3 : Styles et sélecteurs

• —Trois méthodes d'intégration CSS (inline, interne, externe)
• —Anatomie d'une règle CSS : sélecteur, propriété, valeur
• —Sélecteurs simples : balise, classe, ID
• —La cascade, l'héritage et la spécificité en CSS

Propriétés de texte et modèle de boîte CSS

• —Gestion des polices (`font-family`, `font-size`, `font-weight`, `font-style`)
• —Alignement du texte et décoration (`text-align`, `text-decoration`)
• —Le modèle de boîte : `margin`, `border`, `padding`, `content`
• —Calcul de boîte (`box-sizing`)

Positionnement CSS : Flux normal et avancées

• —Flux normal des documents HTML
• —Propriétés `display` (block, inline, inline-block)
• —Positionnement avancé : `relative`, `absolute`, `fixed`, `sticky`
• —`z-index` et empilement des éléments

Flexbox : Création de mises en page modernes

• —Fondamentaux de Flexbox : conteneur et éléments
• —Alignement des éléments : `justify-content`, `align-items`, `align-self`
• —Direction et enroulement : `flex-direction`, `flex-wrap`
• —Ordre des éléments et flex-grow/shrink/basis

Grilles CSS (CSS Grid Layout) : Maîtriser le layout

• —Concepts de base des grilles : lignes et colonnes explicites/implicites
• —Placement des éléments dans la grille : `grid-column`, `grid-row`
• —Définition de gabarits de grille : `grid-template-areas`
• —Alignement dans la grille : `justify-items`, `align-items` et `place-items`

Design Responsive avec les Media Queries

• —Comprendre le concept de Responsive Web Design
• —Syntaxe et utilisation des Media Queries
• —Points de rupture (breakpoints) courants pour différents appareils
• —Approche Mobile-First vs Desktop-First

Transitions, transformations CSS et Web Fonts

• —Création d'effets visuels avec les transitions CSS
• —Transformations 2D (`translate`, `rotate`, `scale`, `skew`)
• —Intégration de polices personnalisées (Google Fonts)
• —Icones vectorielles (Font Awesome)

Optimisation et bonnes pratiques HTML/CSS

• —Validation du code HTML et CSS
• —Conventions de nommage (classes, IDs) et structuration du code
• —Optimisation pour la performance web (minification, chargement)
• —Accessibilité web (ARIA, sémantique correcte)

OPCO

Formations financées via votre opérateur de compétences

FAF

Aide à la formation pour les indépendants

France Travail

Des aides pour les demandeurs d'emploi

Employeur

Votre entreprise peut financer votre formation

FNE-Formation

Un soutien pour les entreprises en transformation

Aucun prérequis technique n’est nécessaire. Maîtrise de l’outil informatique (environnement Windows/Mac) et des fonctions de base d'un navigateur web. Intérêt pour la création de sites web.

Un ordinateur (PC ou Mac) avec une connexion internet stable. Un navigateur web moderne (Chrome, Firefox, Edge, Safari). Un éditeur de texte léger (VS Code, Sublime Text, Brackets) sera recommandé et présenté durant la formation.

5 tests d'évaluation sont proposés à l'apprenant en fin de formation pour connaître son niveau sur chaque compétences visées.

Plateforme et contenus e-learning à disposition. Test de positionnement Quizz & Evaluations

Nous vous recevons lors d’un rendez-vous d’information préalable gratuit et confidentiel en visioconférence pour analyser vos besoins et co-construire votre parcours personnalisé. Chaque demande s’accompagne de la remise d’une convention ou d’un contrat précisant l’ensemble des informations relatives à la formation (Tarifs, calendrier, durée, lieu…). Ce contrat/convention sera transmis électroniquement par email.

A partir de l’accord de prise en charge par le financeur sollicité, le bénéficiaire peut démarrer sous un délai de 11 jours ouvrés. Si vous financez votre parcours de formation par vos propres moyens, alors le délai d'accès est immédiat. Vous pouvez entrer en formation tout au long de l’année.

♿️ Nous accueillons les personnes en situation de handicap. Les conditions d’accessibilité aux personnes handicapées sont inscrites sur le site imi-education.fr, rubrique Accessibilité.

Saskia Cazettes Pour tout renseignement : 07 80 91 06 14 / saskia.c@imi-executive-solutions.com

23 mars 2026

La formation alterne apports théoriques, mises en situation pratiques et échanges entre participants. Chaque concept est directement appliqué via des exercices concrets et des cas réels.

Oui, chaque participant reçoit un support de cours complet (format numérique et/ou papier) qu'il peut conserver à l'issue de la formation.

Certaines de nos formations sont éligibles au Compte Personnel de Formation (CPF). Consultez la fiche formation ou contactez-nous pour vérifier l'éligibilité.

Plusieurs dispositifs de financement existent : CPF, OPCO, plan de développement des compétences, financement individuel. Notre équipe peut vous accompagner dans vos démarches.

Oui, notre équipe reste disponible pour toute question post-formation. Vous bénéficiez également d'un accès à nos ressources en ligne pendant 6 mois après votre parcours.

Vous apprendrez à utiliser HTML5, CSS3 et des outils de développement Web tels que Visual Studio Code ou Sublime Text.

Cette formation est conçue pour les débutants, mais les participants doivent avoir une base de connaissances en développement Web.

Vous acquerrrez les compétences techniques pour créer des sites Web dynamiques, responsives et interactifs, ainsi que la capacité à les optimiser en termes de performance et d'accessibilité.

Notre organisme de formation s'engage à accueillir et accompagner les personnes en situation de handicap. Notre référente handicap, Mme Lorène Travaux est disponible pour étudier avec vous les adaptations pédagogiques, techniques ou logistiques nécessaires avant toute inscription. Contactez-nous à hello@imi-executive-solutions.com ou au 06 72 09 69 52.