Développer des pages Web moderne en HTML5 et CSS3
Les standards de développement HTML (HyperText Markup Language) et CSS (Cascading Style Sheets) sont 2 langages fondamentaux approuvés par l'organisme de standardisation World Wide Web Consortium (W3C). Dans sa dernière version, le HTML5 est utilisé pour représenter le contenu des pages Web de façon structuré, tandis que le langage CSS en version 3 est employé pour mettre en forme le design de ce contenu. Avec cette formation de 4 jours, vous acquerrez les compétences indispensables pour développer des pages de sites Internet modernes.
Le cours débute par une première partie traitant des langages et des outils de création de contenu Web. Il se poursuit avec les bases du HTML5, à savoir le fonctionnement des balises et des attributs. Vous découvrirez ensuite les techniques d'intégration pour ajouter du texte, des listes, des liens hypertextes, des images et bien plus encore. Une fois cette étape franchie, vous apprendrez à styliser ce contenu avec le langage de style CSS3. Vous vous familiariserez avec les propriétés de style des éléments de texte et des sections de texte. Vous aborderez les aspects structurels d'une page Web (section, entête, pied de page, et menu) et vous verrez les méthodes pour positionner tous ces éléments sur une page Internet.
Pour finir, vous passerez à un niveau supérieur avec l'intégration de contenus audios et vidéos ainsi que la création de tableaux et de formulaires en HTML5. En conclusion, vous verrez aussi de quelle manière adapter votre page Web à différents écrans (Responsive Web Design). En suivant cette formation, vous serez également préparer pour le passage de la certification IT - Développement de sites web avec le langage de balises HTML et des feuilles de styles CSS.
Objectifs
A l’issue de cette formation HTML5 et CSS3, vous acquerrez les objectifs de compétences suivants :
- développer une page web en langage HTML5 composée de texte, d'images, de listes à puces et de liens hypertextes ;
- mettre en forme le contenu d'une page Web avec du CSS3.
- créer un menu de navigation, des formulaires et des tableaux en HTML5 et les mettre en forme avec du CSS3.
- intégrer des éléments multimédias dans une page web ;
- appliquer à votre page Web différentes techniques CSS3 qui permettent de la rendre responsive.
Programme
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.
Prérequis
Suivre la formation développer des pages Web moderne en HTML5 et CSS3, ne nécessite aucun prérequis.
Public
Cette formation s'adresse aux publics suivants :
- tout professionnels du développement Web qui désirent se former aux standards HTML 5 et CSS 3 pour concevoir des pages Web moderne et responsive.
Points forts
Certification
Ce programme de formation vous permet une préparation à la certification IT - Développement de sites web avec le langage de balises HTML et des feuilles de styles CSS. Elle est inscrite au répertoire spécifique de France Compétences et elle est délivrée par notre partenaire certificateur EDITION ENI.
Afin d'obtenir cette certification, vous devrez passer un examen en ligne de type QCM qui durera 1 heure. Tous les examens de certification ENI garantissent la réussite aux tests. Sur une échelle de 1000 points, vous obtiendrez un score qui indique votre niveau de compétence sur une technologie ou un produit donné.
- Score de 0 à 149 : vous êtes en phase d'acquisition des compétences.
- Score de 150 à 349 : vous avez acquis les compétences fondamentales.
- Score 350 à 649 : vous avez acquis les compétences intermédiaires.
- Score de 650 à 1000 : vous avez acquis les compétences avancées.
PS : après avoir suivi cette formation en développement Web, il est nécessaire de faire des exercices approfondis et d'avoir une bonne expérience professionnelle pour réussir l'examen.
Objectifs
A l’issue de cette formation HTML5 et CSS3, vous acquerrez les objectifs de compétences suivants :
- développer une page web en langage HTML5 composée de texte, d'images, de listes à puces et de liens hypertextes ;
- mettre en forme le contenu d'une page Web avec du CSS3.
- créer un menu de navigation, des formulaires et des tableaux en HTML5 et les mettre en forme avec du CSS3.
- intégrer des éléments multimédias dans une page web ;
- appliquer à votre page Web différentes techniques CSS3 qui permettent de la rendre responsive.
Programme
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.
Prérequis
Suivre la formation développer des pages Web moderne en HTML5 et CSS3, ne nécessite aucun prérequis.
Public
Cette formation s'adresse aux publics suivants :
- tout professionnels du développement Web qui désirent se former aux standards HTML 5 et CSS 3 pour concevoir des pages Web moderne et responsive.
Points forts
Certification
Ce programme de formation vous permet une préparation à la certification IT - Développement de sites web avec le langage de balises HTML et des feuilles de styles CSS. Elle est inscrite au répertoire spécifique de France Compétences et elle est délivrée par notre partenaire certificateur EDITION ENI.
Afin d'obtenir cette certification, vous devrez passer un examen en ligne de type QCM qui durera 1 heure. Tous les examens de certification ENI garantissent la réussite aux tests. Sur une échelle de 1000 points, vous obtiendrez un score qui indique votre niveau de compétence sur une technologie ou un produit donné.
- Score de 0 à 149 : vous êtes en phase d'acquisition des compétences.
- Score de 150 à 349 : vous avez acquis les compétences fondamentales.
- Score 350 à 649 : vous avez acquis les compétences intermédiaires.
- Score de 650 à 1000 : vous avez acquis les compétences avancées.
PS : après avoir suivi cette formation en développement Web, il est nécessaire de faire des exercices approfondis et d'avoir une bonne expérience professionnelle pour réussir l'examen.