Objectifs pédagogiques
- Mettre en place une architecture front claire avec composants réutilisables.
- Appliquer un design responsive mobile‑first (grille, variables CSS).
- Optimiser la performance (images, fonts, lazy‑loading, Core Web Vitals).
- Garantir l’accessibilité (sémantique, ARIA, formulaires robustes).
- Implémenter le SEO technique (métadonnées, sitemap/robots, schema.org).
Public & prérequis
Public : intégrateurs, développeurs front, responsables communication/marketing technique. Prérequis : bases HTML/CSS et un peu de JavaScript.
Matin — Fondations modernes
- HTML5 sémantique, structure accessible, navigation clavier.
- Design tokens, variables CSS, grille responsive, typographie fluide.
Après‑midi — Composants UI
- Header/nav collants, hero, cartes, footer, accordéons.
- JS léger pour interactions (menus, modales) sans bloat.
Matin — Performance
- Images responsives (srcset, formats modernes), lazy‑loading.
- Fonts optimisées (preconnect/preload, subsetting), bundle minimal.
Après‑midi — SEO technique
- Title/meta, sitemap/robots, hreflang.
- schema.org (Organization, WebSite, Breadcrumb, Article).
Matin — Accessibilité pratique
- ARIA pragmatique, gestion du focus, contrastes, formulaires.
- Audit Axe, correctifs rapides, pièges fréquents.
Après‑midi — Mise en ligne
- Favicon/manifest, pages 404/500, Netlify ou GitHub Pages.
- Audit final Lighthouse & plan d’amélioration.
Méthodes & évaluation
- Théorie le matin, ateliers l’après‑midi.
- Évaluation continue, objectifs mesurables (Lighthouse, Axe).
- Attestation + audit final exporté.
FAQ
Qui peut s’inscrire ?
Intégrateurs, développeurs front, communicants techniques, profils en reconversion avec bases HTML/CSS.
Quel niveau JavaScript est nécessaire ?
Notions de base (sélection DOM, gestion d’événements). Pas besoin de framework.
Chaque participant repart‑il avec un site ?
Oui, un site vitrine complet hébergé, audité et partageable à l’issue du Jour 3.