Télécharger le programme HTML5/CSS3 Perfectionnement au format PDF

Formation HTML5/CSS3 Perfectionnement

Responsive, animations, APIs et JavaScript

Objectifs de la formation

Cette formation vous permet d'utiliser les fonctions avancées du langage HTML5 et APIs pour le développement de documents web responsives et interactifs, à l’aide également de CSS3 et de Javascript.

Public

Intégrateurs et développeurs front-end, webmestres, concepteurs de sites web.

Durée

35 heures en présentiel sur 5 jours

Pré-requis

Avoir les bases des langages HTML/CSS.

Formateur

Formateur expérimenté, développeur de site Web, et spécialiste du Web.

Méthode pédagogique

8 participants maximum, un poste par stagiaire et un support de cours est remis en fin de stage. La formation est constituée d'apports théoriques, de démonstrations et de mises en pratique basées sur des exercices.

Modalité de validation des acquis

Évaluation en ligne des acquis via un questionnaire. Attestation de fin de stage.


Programme HTML5/CSS3 Perfectionnement

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