
-Concevoir et développer des applications Web en HTML5 et CSS3 
-Mettre en place et valider la structure des pages Web 
-Ecriture de feuilles de style avec CSS3 
-Rendre les pages Web responsive design
-Standard du W3C
– Langages HTML, CSS & JavaScript
– Organisation d’un site web 
– Principaux navigateurs et niveau de compatibilités aux nouveautés 
HTML5 et CSS3
– Outils de création de contenu pour le Web 
Travaux pratiques 
Découverte des possibilités du HTML5 et des outils de développement
– Vue d’ensemble des balises HTML
– Attributs HTML et Evénements
– Structure du document HTML
– Eléments d’entête 
Travaux pratiques 
Création et validation d’un document HTML5.
– Eléments de section
– Eléments de titres
– Eléments de navigation
– Eléments génériques 
Travaux pratiques 
Mise en œuvre des éléments conteneurs
– Création et intégration d’une feuille de style CSS
– Sélecteurs CSS simples
– Héritage et cascades
– Couleurs et Unités de mesures : px, in, %, em 
Travaux pratiques 
Création d’une feuille de style
– Gestion du texte, des paragraphes et des listes
– Gérer les espaces et les sauts de lignes
– Polices embarquées
– Présentation multicolonnes
– Affichage en ligne ou en bloc
– Dimensions et marges
– Bordures et Fonds
– Images de fond 
Travaux pratiques 
Mise en forme du contenu de la page HTML
– Unités avancées : %, vh, vw, calc()
– Dimensionnement fluide et marges
– Positionnements relatifs et absolus
– Habillage et débordements 
Travaux pratiques 
Gestion du positionnement
– Sélecteurs CSS3
– Variables CSS
– Transformations
– Transitions
– Animations
– Éléments graphiques SVG 
Travaux pratiques 
Mise en œuvre de la mise en forme avancée de CSS3
– Structurer le formulaire avec les éléments Form, FieldSet et Label
– Ajouter des éléments Input
– Créer des listes de valeurs pour les éléments Input
– Afficher des informations avec les éléments Output, Progress et Meter
– Mettre en forme et valider un formulaire
– Ajouter des boutons de contrôle 
Travaux pratiques 
Création d’un formulaire
– Elément Table
– Eléments ligne et cellules
– Groupes de lignes et de colonnes
– Fusionner des cellules
– Mise en forme d’un tableau 
Travaux pratiques 
Ajout d’un tableau dans une page web
– Ajouter des images 
 – Intégrer des documents audios et vidéos
– Configurer le composant de contrôle de la lecture 
Travaux pratiques 
Ajout d’un élément multimédia
– Principes fondamentaux
– Résolutions et densités des principaux smartphones et tablettes
– Viewport et Zoom
– Critères d’adaptation (width, height, device-width, orientation, etc.)
– Points de ruptures et grilles
– Résolution des images 
Travaux pratiques 
Rendre les pages web responsive design
– Axe principal et axe transversal
– Répartition et alignement des éléments
– Dimensions de base, agrandissements et réductions
– Ordonnancement des éléments 
Travaux pratiques 
Mise en page modulaire et adaptée en responsive design
– Le principe de Grilles « Grid ».
– Réaliser une mise en page par bloc.
– Positionnement de chacun des blocs sur la page.
– Changement de la disposition et de la taille des blocs parents en fonction de la taille de l’écran de l’internaute. 
Travaux pratiques 
Mise en page modulaire et adaptée en responsive design.
Référence : WEB017
Type de Stage : Pratique
Durée : 4 jours
Développeurs Web. Chefs de 
projet Web
Aucune connaissance particulière