Formation Webmaster Avancé : HTML5/CSS3/Javascript/JQuery (Certif…480) - 5 jours (Éligible au CPF)

IntroductionHistorique : Evolution du HTML et de CSS

Le HTML5 : Présentation des problèmatiques actuelles

Exemples d’applications en HTML 5 et CSS3

Apercu d’outils de développement comme Visual Studio



HTML5Structurer une page en HTML5 :

Les balises sémantiques : header, article, hgroup, aside…

Création d’un conteneur de disposition

Les nouveaux attributs utilisés par les moteurs de recherche



Atelier pratique : Architecture d’une page en HTML5



Gestion des médias en HTML 5Les balises audio et video

La balise Canvas : Utilisation de l’API Canvas.

Graphiques interactifs avec SVG



Atelier pratique : Création de graphiques interactifs



CSS 3Application de styles aux propriétés de zone HTML 5

Les sélecteurs : Référencement balise et attributs, Héritage, les préfixes, !important, l’architecture objet, les pseudo-classes et les pseudo-éléments.

Apparence: Taille, bordures, contours, background, image arriere-plan, dégradés,ombres, détourage,

transparence, dimensionnement, marges…

Problèmatiques de positionnement, les différents modes de positionnement., affichage, masquage

Disposition en colonnes. Flottements, exclusions.



Atelier pratique : Création d’une page d’articles de presse



Application de styles aux propriétés de texte HTML 5Format, couleur, ombre portée…

Intégration de polices : @font-face

Alignement, indentation du texte, justification, césure.



Atelier pratique : Mise en page d’un article



Les transitions et les transfomations en CSS3Transformation d’objets en 2D et 3D

Animations d’objets avec les transitions CSS

Adaptation de l’interface en fonction des médias utilisés



Atelier pratique : Animation de la page web




Le Responsive Web DesignPrésentation du Responsive Web Design : objectifs, alternatives...

Le modèle flexible

Les media queries

Disposition utilisant les régions, le regroupement et l’imbrication

Les grilles fixes et fluides

Compression d'images, sprites, Data URI

API Network Information JavaScript pour Responsive



Atelier pratique : Adaptation de la page web aux multiples formats ( tablettes, smartphone…)



Les principales API de HTML 5Les API de stockages : LocalStorage, SessionStorage, IndexedDB

La géolocalisation

L’API appCache

Offline web application



JavaScriptLes principaux éléments du JavaScript : variables, tableaux, fonctions…

Les instructions de conditions et d’itérations

La gestion des erreurs et des exceptions

Les objets en Javascript

Prototypage

Constructeurs, héritage, portée des variables

Présentation du DOM (Document Object Model)

Parcours du DOM, filtres

Accès, modification, ajout d'éléments et d'attributs HTML 5

Gestion dynamique des CSS

La gestion des évènements

Propagation d’évènements

Introduction à l‘API WebSocket HTML5

Création de WebWorkers en BackGround



Atelier pratique: Utiliser JavaScript pour animer la page Web

Formulaires HTML 5Validation de formulaires avec HTML

Validation de formulaires avec JavaScript

Utilisation des expressions régulières.

Prévention des injections de code

Récupération des données, encodage



Atelier pratique: Utiliser JavaScript pour valider un formulaire



Ajax et XMLHttpRequestCommunication synchrone et asynchrone

Instancier un objet XMLHttpRequest

Gestion des erreurs

Barre de progression

Principes des Callback

Transmission de données: format GET et POST

Sérialisation et désérialisation de données

Utilisation des données: Le format XML, le format JSON

Appliquer Jquery pour effectuer une requête Ajax

Fonctions jQuery disponibles pour effectuer des requetes Ajax



Atelier pratique: Utiliser Ajax avec Jquery et Javascript pour créer des éléments d’un formulaire à partir de données fournies en XML et JSON

Préparation de la certification Microsoft 70-480

Présentation du contenu de la certification :

- Mise en œuvre et manipulation des structures de document et des objets (24 %)

- Mise en œuvre du flux de programme (25 %)

- Accès aux données et sécurisation des données (26 %)

- Utilisation de CSS3 dans les applications (25 %)



Passage et correction d'un test blanc

Ateliers corrigés

Questions/réponses, gestion du temps lors du passage de l'examen