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