> Formations > Technologies numériques > Technologies Web > Développement Front-End > Formation HTML5 & CSS3, maîtriser la création de ses pages Web > Formations > Technologies numériques > Formation HTML5 & CSS3, maîtriser la création de ses pages Web
Vous avez déjà un compte client ORSYS
Se connecter
Vous êtes nouveau chez ORSYS
Créer un compte
Vous ne souhaitez pas créer de compte
Poursuivre sans me connecter

Formation : HTML5 & CSS3, maîtriser la création de ses pages Web

HTML5 & CSS3, maîtriser la création de ses pages Web


Moyenne des avis clients Moyenne des avis clients Moyenne des avis clients Moyenne des avis clients
4,4 / 5

Formation incontournable Formation éligible au CPF Formation Blended

À l’issue de cette formation, vous serez capable de créer des pages web modernes en utilisant HTML5 et CSS3. Vous apprendrez à structurer vos contenus à l’aide des éléments et balises HTML5, tout en mettant en œuvre les techniques de mise en page avec CSS3 pour rendre vos pages visuellement attractives et responsives, adaptées à tous types de supports.


INTER
INTRA
SUR MESURE

Cours pratique en présentiel ou à distance
Disponible en anglais, à la demande

Réf. HTM
  3j - 21h00
Prix : 2080 € H.T.
Pauses-café et
déjeuners offerts
En option :
Dynamique.Model.Bean_FormationOption
Blended : 190 € HT

Télécharger le programme

Partager cette formation




À l’issue de cette formation, vous serez capable de créer des pages web modernes en utilisant HTML5 et CSS3. Vous apprendrez à structurer vos contenus à l’aide des éléments et balises HTML5, tout en mettant en œuvre les techniques de mise en page avec CSS3 pour rendre vos pages visuellement attractives et responsives, adaptées à tous types de supports.


Objectifs pédagogiques
À l’issue de la formation, le participant sera en mesure de :
Concevoir et développer des sites web en HTML5 et CSS3
Définir le contenu de votre site grâce au HTML5
Améliorer l'aspect de votre site grâce au CSS3
Veiller au rendu de votre site sur les diverses tailles d'écrans grâce au responsive design

Public concerné
Développeurs, chefs de projet web et toute personne réalisant et maintenant des sites web à l’aide d’un CMS (Content Management System).

Prérequis
Connaissances de base en HTML et CSS.
Vérifiez que vous avez les prérequis nécessaires pour profiter pleinement de cette formation en faisant  ce test.

Certification
La certification ENI « Créer et mettre en forme des pages web (HTML5 et CSS3) » est en option lors de l’inscription à cette formation. Accessible en ligne 24h/24, l’évaluation est chronométrée (1h30) et comprend des cas pratiques et un QCM/QCU. Les cas pratiques, reproduisant un environnement de travail réaliste, valent cinq fois plus qu’une question QCM/QCU. Le score sur 1000 détermine le niveau atteint : opérationnel (500 à 700 points) ou avancé (701 à 1000 points). La certification est obtenue dès 500 points et valide les compétences dans la création et la mise en page des pages web. Les résultats sont disponibles immédiatement après l’épreuve, et le certificat est envoyé par e-mail. Cette certification est enregistrée sous le numéro RS6245 au Répertoire Spécifique de France Compétences. Lien vers la fiche France compétence : https://www.francecompetences.fr/recherche/rs/6245/

Méthodes et moyens pédagogiques
Travaux pratiques
Echanges, partages d'expériences, démonstrations, travaux dirigés et cas pratiques.
Méthodes pédagogiques
Pédagogie active basée sur des exemples, des démonstrations, des partages d'expérience, des cas pratiques et une évaluation des acquis tout au long de la formation.

Modalités d'évaluation
Le formateur évalue la progression pédagogique du participant tout au long de la formation au moyen de QCM, mises en situation, travaux pratiques…
Le participant complète également un test de positionnement en amont et en aval pour valider les compétences acquises.

Programme de la formation

1
Introduction

  • Les différences entre HTML et CSS.
  • Les apports du HTML5 et du CSS3.
  • Outils de développement.
Travaux pratiques
Mise en place de notre des outils de développement.

2
Principales balises HTML

  • Structure d’un document HTML : <doctype>, <html>, <head>, <body>.
  • Notions de balises et attributs.
  • Les balises d’en-tête : <title> et <meta>.
  • Les liaisons CSS et Javascript : <link> et <script>.
  • Les balises textuelles : titres, paragraphes, citations, et accentuations avec <strong>, <em>, <mark>.
  • Les liens : <a>.
  • Les images : <img>, <figure>, <figcaption>.
  • Les listes : <ul> et <ol>.
  • Les tableaux : <table>, <tr>, <th>, <td>.
  • Les balises génériques <div> et <span>
  • Les balises sémantiques <nav>, <section>, <article>, <aside>, <header> et <footer>.
  • Principales recommandations pour l’accessibilité selon les références WCAG/RGAA : attributs alt, scope…
Travaux pratiques
Tests des balises dans le cadre d’une création de page simple (CV en ligne, page de vente, ou autre).

3
Ajouter des médias

  • Les iframes.
  • Les vidéos.
  • L’audio.
  • Veiller à l’accessibilité des médias (compatibilité, sous-titres, navigation clavier…).
Travaux pratiques
Tests de ces balises dans le contexte du travail pratique précédent.

4
Principaux sélecteurs et propriétés CSSP

  • Les règle CSS.
  • Les sélecteurs.
  • Les pseudo-classes.
  • Définir des couleurs.
  • Les propriétés liées aux fonds.
  • Les propriétés communes : dimensions, bordures, marges internes et externes.
  • Les propriétés liées aux textes : couleur, alignement, police, soulignement, gras, taille.
  • Les unités px, em, rem, vw, vh.
  • Améliorations diverses : ombres, dégradés, texte multi-colonnes, coins arrondis…
Travaux pratiques
Tests des sélecteurs et propriétés dans le contexte du travail pratique précédent.

5
Positionnements CSS

  • Le positionnement statique.
  • La propriété display.
  • Le positionnement relatif.
  • Le positionnement absolu.
  • Le positionnement fixe.
  • Les propriétés float et clear.
  • Le positionnement flexbox.
  • Le positionnement grid layout.
Travaux pratiques
Test des différents positionnements. Intégration d’une mini-maquette ou d’un schéma afin de les transformer en site comprenant 2 colonnes, un logo, un menu, et du contenu simple. Utilisation des différents positionnements vus y parvenir. Amélioration de l’aspect avec les autres propriétés CSS vues précédemment.

6
Introduction au Responsive Design

  • Les dimensionnements par unités flexibles.
  • La notion de viewport.
  • Les mediaqueries.
  • Alternative : la notion de grille CSS.
Travaux pratiques
Amélioration de l’exercice pratique précédent pour que le site s’adapte aux diverses tailles d’écrans. Démonstration de l’utilisation de la grille CSS de bootstrap.

7
Formulaires

  • Les formulaires et leurs champs : <form>, <input>, <textarea>, <select>, <option>.
  • Les labels, et leurs liaisons aux champs.
  • Les apports du HTML5 pour les formulaires : nouveaux champs, types d’inputs, et attributs.
  • La vérification de formulaire avec HTML, via types et attributs.
  • Le paramétrage d’envoi du formulaire : méthodes GET et POST, attribut action.
  • Principales recommandations HTML liées à la sécurité (OWASP, ANSSI) : méthode adéquate, type password, attribut pattern…
  • Principales recommandations HTML pour l’accessibilité selon les références WCAG/RGAA : lecteurs d’écrans, labels, attributs aria, regroupement des boutons radio et checkbox dans des <fieldset> avec <legend>…
Travaux pratiques
Amélioration de l’exercice pratique précédent en intégrant un formulaire de contact.

8
Animations CSS 3

  • Transformations (rotations, translation, changement d’échelle, déformation).
  • Transitions.
  • Animations.
  • Limiter les animations (prefers-reduced-motion).
Travaux pratiques
Tests des transformations, transitions, et animations.

9
La certification ENI

  • Modalités et déroulement de l’examen.
  • Conseils personnalisés.


Parcours certifiants associés
Pour aller plus loin et renforcer votre employabilité, découvrez les parcours certifiants qui contiennent cette formation :

Options
L’option de certification se présente sous la forme d’un voucher ou d’une convocation qui vous permettra de passer l’examen à l’issue de la formation.
Blended : 190 € HT
Approfondissez les connaissances acquises en formation grâce aux modules e-learning de notre Chaîne e-learning développement Back-End et PHP. Un apprentissage flexible et complet, à suivre à votre rythme dès le premier jour de votre présentiel et pendant 1 an.

Solutions de financement
Plusieurs solutions existent pour financer votre formation et dépendent de votre situation professionnelle.
Découvrez-les sur notre page Comment financer sa formation ou contactez votre conseiller formation.

Financement par le CPF
Cette formation est éligible au CPF. Si vous souhaitez bénéficier de ce mode de financement, contactez-nous ou rendez-vous directement sur le site moncompteformation.gouv.fr.

Avis clients
4,4 / 5
Les avis clients sont issus des évaluations de fin de formation. La note est calculée à partir de l’ensemble des évaluations datant de moins de 12 mois. Seules celles avec un commentaire textuel sont affichées.
GAËTAN P.
02/07/25
4 / 5

Top! Thomas est à l’écoute et prend le temps d’expliquer. Il maîtrise son sujet.Le ratio entre la théorie et la pratique était bon.
AURELIEN C.
02/07/25
4 / 5

Très bien, mais j’aurais passer plus de temps sur le CSS actuel (grid, display flex etc..)
FRÉDÉRIC M.
25/06/25
5 / 5

Apprentissage par la pratique très agréable.

> Afficher plus d’avis clients


Horaires
les cours ont lieu de 9h à 12h30 et de 14h à 17h30.
Les participants sont accueillis à partir de 8h45. Les pauses et déjeuners sont offerts.
Pour les stages pratiques de 4 ou 5 jours, quelle que soit la modalité, les sessions se terminent à 16h le dernier jour.

Dates et lieux
Sélectionnez votre lieu ou optez pour la classe à distance puis choisissez votre date.
Classe à distance

Dernières places
Date garantie en présentiel ou à distance
Session garantie
PARTICIPANTS
Futurs managers et responsables d’équipe souhaitant structurer leur pratique managériale

PRÉREQUIS
Aucun

COMPÉTENCES DU FORMATEUR
Les experts qui animent la formation sont des spécialistes des matières abordées. Ils ont été validés par nos équipes pédagogiques tant sur le plan des connaissances métiers que sur celui de la pédagogie, et ce pour chaque cours qu’ils enseignent. Ils ont au minimum cinq à dix années d’expérience dans leur domaine et occupent ou ont occupé des postes à responsabilité en entreprise.

MODALITÉS D’ÉVALUATION
Le formateur évalue la progression pédagogique du participant tout au long de la formation au moyen de QCM, mises en situation, travaux pratiques… Le participant complète également un test de positionnement en amont et en aval pour valider les compétences acquises.

MOYENS PÉDAGOGIQUES ET TECHNIQUES
• Les moyens pédagogiques et les méthodes d’enseignement utilisés sont principalement : aides audiovisuelles, documentation et support de cours, exercices pratiques d’application et corrigés des exercices pour les stages pratiques, études de cas ou présentation de cas réels pour les séminaires de formation. • À l’issue de chaque stage ou séminaire, ORSYS fournit aux participants un questionnaire d’évaluation du cours qui est ensuite analysé par nos équipes pédagogiques. • Une feuille d’émargement par demi-journée de présence est fournie en fin de formation ainsi qu’une attestation de fin de formation si le stagiaire a bien assisté à la totalité de la session.

MODALITÉS ET DÉLAIS D’ACCÈS
L’inscription doit être finalisée 24 heures avant le début de la formation.

ACCESSIBILITÉ AUX PERSONNES HANDICAPÉES
Pour toute question ou besoin relatif à l’accessibilité, vous pouvez joindre notre équipe PSH par e-mail à l'adresse psh-accueil@orsys.fr.