Descriptif
HTML5 et XHTML : les fondamentaux est une formation de 2 jours (14 heures), de niveau initiation, rattachée au domaine « Développement logiciel, informatique et Web ». Structurer des pages Web conformes aux standards. Conçue et animée par des praticiens en activité, elle alterne apports ciblés (30 %) et mises en pratique (70 %) sur des laboratoires cloud individuels, avec des cas inspirés des secteurs banque, assurance et services publics. Disponible en inter-entreprises, en intra sur catalogue et en version sur mesure adaptée au contexte de l'entreprise.
Objectifs pédagogiques
À l'issue de la formation, le participant sera capable de :
- Structure
- Sémantique
- Formulaires
- Médias
- Validation
Programme détaillé
| N° | Contenus et activités | Durée |
|---|---|---|
| Jour 1 | ||
| 1 | Ouverture : attentes, test de positionnement sur les standards du Web et prise en main de l'éditeur en ligne fourni, utilisable directement dans le navigateur | 0,5 h |
| 2 | Comment fonctionne une page Web : client et serveur, URL, échange HTTP, rôle du navigateur, doctype, différences entre HTML5 et XHTML, règles de syntaxe bien formée | 1,5 h |
| 3 | Atelier guidé : écrire sa première page valide — squelette du document, métadonnées, encodage, titres, paragraphes, listes, liens internes et externes | 2 h |
| 4 | Structure sémantique : header, nav, main, section, article, aside et footer, hiérarchie des titres, attributs lang, id et title | 1,5 h |
| 5 | Travaux pratiques : structurer la page d'accueil et une page de contenu du site fil rouge en balises sémantiques | 1,5 h |
| Jour 2 | ||
| 6 | Atelier guidé : les formulaires HTML5 — types de champs, label, placeholder, required et pattern, validation native du navigateur, regroupement par fieldset, accessibilité de base | 2 h |
| 7 | Travaux pratiques : construire le formulaire de contact du fil rouge avec validation côté navigateur et messages explicites | 1,5 h |
| 8 | Médias et contenus riches : images adaptatives avec srcset et picture, audio et video, iframe, SVG en ligne, tableaux de données structurés | 1,5 h |
| 9 | Travaux pratiques : intégrer médias et tableau tarifaire au site, puis l'habiller avec une feuille de styles externe | 1,5 h |
| 10 | Évaluation des acquis : passage du site au validateur W3C, correction des erreurs relevées et check-list de publication | 0,5 h |
Méthodes pédagogiques
- Pédagogie active : 61 % du temps en pratique encadrée — laboratoires cloud provisionnés par participant, travaux pratiques guidés, fil rouge applicatif —, le reste en apports structurés, démonstrations commentées, cadrage et évaluation
- répartition calculée sur le déroulé détaillé de cette formation, et non annoncée de façon uniforme
- classe inversée avec prérequis sur le LMS
- apprentissage adaptatif selon le positionnement initial
- travaux en binômes
- classe virtuelle en séquences de 3 h 30 maximum sur Microsoft Teams
- support clair, complet et paginé remis à chaque participant
Technologies et outils mobilisés
HTML5, CSS3, VS Code, outils de validation W3C
Modalités d'évaluation et de validation
- Positionnement initial en ligne
- quiz de validation à chaque séquence
- évaluation finale des acquis (QCM et mise en situation)
- satisfaction à chaud
- questionnaire de transfert à 30 jours
- attestation de fin de formation
Plateforme, laboratoires et ressources
- LMS DATAROCKSTARS : parcours, supports numériques, quiz, évaluations, émargement par demi-journée
- laboratoires cloud individuels accessibles depuis un navigateur, sans installation, données fictives, détruits en fin de session
- bibliothèque O'Reilly (plus de 60 000 ressources)
- accès aux supports pendant 6 mois