HTML5 / CSS3 / JAVASCRIPT Créer des pages Web Mixte : présentiel / à distance

• Toute personne souhaitant apprendre à créer des pages Web statiques côté client avec les standards HTML5, CSS3 et JavaScript

• Avoir une expérience de programmation, quel que soit le langage d'origine
• Avoir développé et livré une application en autonomie ou en équipe

A l'issue de cette formation, l'apprenant sera capable de :

• Construire une page Web en HTML5
• Mettre en forme une page avec CSS3
• Créer des formulaires avancés
• Créer des tableaux de données
• Créer des menus de navigation
• Gérer des interactions simples en JavaScript

Jour 1 – Matin

Introduction

• Vue d'ensemble de la création de contenu pour le Web
• 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

Notions fondamentales du langage HTML5

• Syntaxe XML
• Vue d'ensembles des balises HTML
• Attributs XML, HTML et Evénements
• Structure du document HTML
• Eléments d'entête

Jour 1 – Après-midi

Mise en page à l'aide d'éléments conteneurs

• Eléments de section
• Eléments de titres
• Eléments de navigation
• Eléments génériques

Jour 2 – Matin

Notions de base de la mise en forme en CSS

• Création et intégration d'une feuille de style CSS
• Sélecteurs CSS simple
• Couleurs et Unités de mesures

Positionnement et dimensionnement des conteneurs

• Comprendre le positionnement naturel des éléments
• Dimensionner les éléments
• Positionner les éléments

Jour 2 – Après-midi

Intégration de contenu et groupe de contenu simple

• Créer des paragraphes, listes, figures
• Ajouter du texte standard et préformaté
• Gérer les espaces et les sauts de lignes
• Utiliser les éléments sémantiques textuels

Jour 3 – Matin

Mise en forme avancée en CSS3

• Sélecteurs CSS avancés
• Héritages des styles
• Bordures et Trames de fonds
• Mise en forme du texte
• Transition CSS

Création de formulaires HTML5

• 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

Création de tableaux

• Elément Table
• Eléments lignes et cellules
• Groupes de lignes et de colonnes
• Fusionner des cellules
• Mise en forme d'un tableau

Intégration du contenu multimédia

• Ajouter des images
• Intégrer des documents audio et vidéo
• Configurer le composant de contrôle de la lecture

Jour 3 – Après-midi

Gestion d'interaction simple en JavaScript

• Notions de base du langage JavaScript
• Parcours et Manipulation du DOM
• Gestion des événements
• Afficher des menus déroulants et contextuels
• Ajouter des informations sur demande avec les éléments Details et Summary
• Autoriser la modification de contenu

Travaux pratiques

• Création d'un site Web par étapes en respectant l'enchainement des modules théoriques
• Structure HTML de la page
• Ajout de contenus simples, titres, listes, images
• Mise en place de liens de navigation entres les pages
• Ajout d'un tableau de données HTML
• Création d'un formulaire HTML
• Insertion de contenus multimédia, vidéo et audio
• Mise en forme du site Web en CSS
• Mise en forme des éléments texte
• Mise en page et positionnement des contenus
• Création d'un bandeau d'en-tête
• Mise en forme du menu de navigation
• Habillage du tableau de données
• Mise en forme du formulaire
• Adaptation des styles aux différentes résolutions d'écrans (Responsive Web Design)
• Mise en place d'interactions simples en JavaScript
• Ouverture et fermeture d'un menu
• Validation d'une sa

• Créer des menus de navigation
• Construire une page Web en HTML5
• Mettre en forme une page avec CSS3
• Créer des formulaires avancés
• Créer des tableaux de données
• Gérer des interactions simples en JavaScript

• Explications théoriques suivies de pratiques guidées puis de mises en autonomie.
• Exercices autonomes et réguliers pour assurer l'assimilation

Votre formation a lieu en présentiel :

• 1 vidéoprojecteur par salle
• 1 ordinateur

Votre formation se déroule à distance avec :

• 1 ordinateur
• 1 connexion Internet
• 1 adresse e-mail valide
• 1 équipement audio (micro et enceintes ou casque)
• 1 Webcam (facultatif – dans l'idéal)
• 1 deuxième écran (facultatif – dans l'idéal)

Votre formation se déroule sur notre plate-forme de formation avec :

• 1 ordinateur
• 1 connexion Internet
• 1 adresse e-mail valide
• 1 équipement audio (micro et enceintes ou casque - facultatif)

Support stagiaire :

À l'issue de la formation, les exercices et travaux pratiques réalisés, leurs corrigés ainsi qu'un support de cours dématérialisé sera fourni à chaque stagiaire par e-mail ou via la plate-forme FOAD.