Développer des pages Web moderne en HTML5 et CSS3

A propos de la création de pages web

• Les étapes nécessaires pour la réalisation de pages Web.
• Vue d'ensemble des standards du W3C.
• Présentation et description des langages HTML, CSS et JavaScript.
• La structure d'un site web.
• La compatibilité des navigateurs Web avec les standards HTML5 et CSS3.
• Les différents outils et ressources pour la création de pages Web.

Introduction à la norme HTML5

• Les règles de syntaxe du langage XML.
• Les différentes balises du HTML5.
• Les attributs XML, HTML5 et les parties d'évènements.
• La structure d'un fichier coder en langage HTML5.
• Les éléments du Header (entête).

Conception de pages avec les éléments de base du HTML5

• La balise <section>.
• Les balises titre (H1 à H6).
• La balise <nav>.
• Les autres balises génériques.

Introduction au langage CSS

• La création et l'intégration d'une feuille de style CSS.
• Les sélecteurs CSS de base.
• Les héritages et les cascades CSS.
• Les codes couleurs CSS et la gestion des tailles.

Conception de pages avec les éléments de base du CSS

• La mise en forme du texte, des paragraphes et des listes.
• Les espaces et les sauts de ligne.
• Les polices de caractères incluses.
• Le positionnement multicolonnes.
• L'affichage par blocs ou en ligne.
• Les dimensions et les marges.
• Les bordures et les backgrounds.
• Les arrière-plans et les dégradés de couleurs.

Structuration et positionnement CSS

• Les fonctions avancées.
• Le dimensionnement dynamique et les marges.
• Le positionnement relatif et absolu.
• L'habillage et les superpositions d'éléments.

Stylisation avancée en CSS3

• Les sélecteurs CSS3 (pseudo-classes et pseudo-éléments).
• L'utilisation des variables en CSS3.
• Les propriétés CSS3 des transformations, des transitions et des animations.
• Le codage CSS3 pour les images SVG.

Conception d'un formulaire en HTML5

• La structure d'un formulaire à l'aide des balises HTML <form>, <fieldSet< et <label>.
• Les propriétés de la balise <input>.
• La création de listes de valeurs pour l'attribut input.
• L'affichage des informations avec l'attribut output, progress et meter.
• La mise en forme et la validation d'un formulaire.
• L'ajout de champs de contrôle.

Conception d'un tableau en HTML5

• La balise <table>.
• Les balises <tr>, <td> et <th>.
• Les groupes de lignes et les groupes de colonnes.
• La fusion de cellules.
• La mise en forme d'un tableau.

Insertion de contenus multimédias en HTML5 et en CSS3

• Les différentes lignes de codes pour insérer des images.
• Les différentes lignes de codes pour insérer des fichiers audio et vidéo.
• Les attributs de contrôle de lecture.

Introduction au Responsive Web Design

• Les bases d'une conception de pages responsive.
• Le concept "Mobile First".
• La conception de grilles fluides.
• Les différentes résolutions d'écran. 
• Le module CSS3 Media Queries.
• La règle du Viewport et le Zoom.
• Les conditions et les paramètres d'adaptation (largeur, hauteur, orientation, etc.)
• Les points d'arrêt et les grilles.
• Le choix des résolutions pour les images.

Disposition des éléments avec les Flex Box CSS3

• Le mode d'affichage Flex Box.
• L'axe principal et l'axe secondaire.
• Le positionnement des éléments.
• Les dimensions standard, les grossissements et les réductions.
• La structure des éléments.

Travaux pratiques : création d'une page Web responsive en HTML5 et CSS3

• Codage de la structure HTML d'une page.
• Ajout de titres, de liste à puces et de contenus multimédia.
• Ajout d'un menu de navigation.
• Création d'un tableau et d'un formulaire.
• Mise en forme de tout les éléments de la page.
• Mise en application des techniques de responsive design.