Objectifs
- Exploiter les fonctionnalités avancées du HTML5 et de ses APIs.
- Concevoir des interfaces responsives avec les techniques modernes de CSS3.
- Dynamiser une interface grâce à JavaScript.
- Manipuler le DOM et créer des interactions utilisateur.
- Communiquer avec un serveur grâce aux échanges asynchrones (AJAX).
Compétences visées
- Développer des interfaces Web modernes avec HTML5, CSS3 et JavaScript.
- Concevoir des mises en page responsives adaptées à tous les écrans.
- Créer des animations et des interactions côté client.
- Manipuler dynamiquement le contenu d'une page Web.
- Intégrer les principales APIs HTML5 dans un projet Web.
Pré-requis
Maîtriser les bases du HTML5 et du CSS3 ou avoir suivi la formation Développer des sites Web avec HTML5 et CSS3.
Quel profil ?
Cette formation s'adresse aux intégrateurs Web, développeurs front-end, webdesigners, webmasters et à toute personne souhaitant approfondir ses compétences en développement d'interfaces Web.
Formations associées
Au programme de la formation
HTML5, CSS3 et JavaScript : techniques avancées
Introduction
- Histoire du HTML et du Javascript
- Définition et utilité de HTML/CSS/JavaScript, les langages du web
- Diversité des terminaux d'affichage (desktop, tablette, smartphone…)
- Structure d'un document HTML5
- Séparation entre contenu, présentation et interactions
- Déclaration de type de document (DTD)
- Rappel sur les syntaxes HTML et CSS3
- Utiliser la console du navigateur
Les nouveautés de HTML5 et CSS3
- Les nouvelles balises sémantiques et les APIs
- Balises audio et Vidéo (supports et formats)
- Principe général de la Géolocalisation
- Stockage local et stockage de session
- Canvas, SVG et Javascript
- Animations, filtres et fonctions avec CSS3
Principes du Responsive Web Design (RWD)
- Différence entre résolution et taille d'affichage
- Interface utilisateur (UI) et expérience utilisateur (UX)
- Détection du navigateur, du terminal, des fonctionnalités
- Mise en page fluide et adaptative
- Principe des media queries CSS
- Différence entre viewport et screen
- Points de rupture et règles conditionnelles
- Conception en grille CSS ou utilisation de Flexboxs
- Menus adaptatifs
- Tableaux et formulaires flexibles
- Entête HTTP et chaîne User-Agent
- Exemple de la class Mobile_Detect en PHP
- Modification dynamique des contenus avec Javascript
Polices web
- Intégrer des polices Web
- Adaptation des tailles de polices
- Colonnes multiples et césure
JavaScript
- Rappels sur la syntaxe Javascript et le DOM
- Frameworks et librairies utiles (jQuery, Backbone, …)
- Les interactions utilisateur (écouteurs d’événements)
- Les manipulation du DOM (ajout, modification, suppression, modifcations)
- Les animations avec Canvas
- Piloter les animations CSS avec Javascript
- AJAX pour communiquer avec le serveur
Comment se déroule la formation ?
Chaque notion est abordée de manière concrète, puis appliquée à travers des exercices et des cas pratiques. Les groupes sont limités à 8 participants pour favoriser les échanges et permettre un accompagnement adapté à chacun.
Un support pédagogique est remis à l'issue de la formation pour retrouver facilement les notions abordées.
Comment les acquis sont-ils évalués ?
En fin de parcours, une évaluation permet de mesurer l'atteinte des objectifs pédagogiques. Selon la formation, elle peut prendre la forme d'un questionnaire, d'un exercice pratique ou d'une certification.
Le suivi est formalisé par une feuille d'émargement et une évaluation des compétences.
Autres formations de la même catégorie
Apprenez les fondamentaux du HTML5 et du CSS3 afin de créer des pages Web modernes, structurées, responsives et conformes aux standards du Web.
Apprenez les fondamentaux de JavaScript afin de créer des pages Web interactives, manipuler le DOM et développer vos premières fonctionnalités côté client.
Approfondissez votre maîtrise de JavaScript en découvrant la programmation orientée objet, les design patterns et les techniques utilisées dans le développement d’applications Web modernes.
Apprenez à concevoir des interfaces Web responsives, ergonomiques et adaptées aux usages actuels sur ordinateur, tablette et smartphone.
Apprenez les fondamentaux de PHP et MySQL pour créer des sites Web dynamiques, traiter des formulaires et exploiter une base de données.
Approfondissez votre maîtrise de PHP et MySQL afin de développer des applications Web plus robustes, maintenables et évolutives.
Apprenez à développer un thème WordPress personnalisé en exploitant le système de templates, les contenus dynamiques, les Custom Post Types et les champs personnalisés.
Apprenez à intégrer une maquette HTML/CSS dans WordPress et à concevoir un thème personnalisé conforme aux standards du Web et à l’architecture du CMS.
Apprenez à développer des plugins WordPress sur mesure afin d’ajouter des fonctionnalités fiables, sécurisées et adaptées aux besoins d’un projet.
Apprenez à développer et personnaliser une boutique PrestaShop en créant des modules, des hooks, des contrôleurs et des fonctionnalités adaptées aux besoins métier.
