Créer des pages en HTML5 et utiliser les nouvelles balises
Mettre en page et en forme avec CSS3
Utiliser les nouvelles API JavaScript
Gérer la mobilité et maîtriser le responsive web design
Rappel sur les évolutions de HTML et CSS depuis 20 ans
Le processus de normalisation : le W3C et le WHATWG
Les apports de HTML5, CSS3 et JavaScript
La syntaxe HTML
Le nouveau Doctype
Encodage des caractères
Le support navigateur
Créer un template de base réutilisable pour tous les projets
Évolution de l’imbrication des balises : disparition des notions de inline et block
Les nouvelles balises : header, footer, structure, aside, nav, hgroup, etc.
Les balises obsolètes : center, font, frame, acronym, etc.
Structurer une page avec les nouvelles balises
Les nouveaux champs de formulaire et leur structure
Les nouvelles pseudo-class CSS (valid, invalid, checked…)
Créer un formulaire de contact type
Accessibilité des éléments dynamique (ARIA)
La balise video
La balise audio
Le ShadowDom
Les balises object, embed et svg
Conteneur (MP4, OGG, WEBM) et codec (.h264, Vorbis, Theora, VP8…)
Inclure une vidéo dans une page et créer une interface de contrôle personnalisée
La balise canvas
SVG et ses filtres
WebGL
Créer un graphique
Extension du DOM : getElementByClassName, querySelector, contenteditable
Les WebWorkers
Drag n’ Drop
Gestion des fichiers et de l’historique
Communication bi-directionnelle asynchrone (WebSocket)
Stockage de données (côté client)
Web Storage (sessionStorage et localStorage) et IndexedDB
appcache : fonctionnement déconnecté
Géolocalisation
Device API et Web API
Créer une liste d’articles fonctionnant sans connexion
Stockage permanent et stockage dans la session
Utilisation d’une base de données en HTML 5
Cartes (Google & Bing Maps)
Utiliser la localisation en HTML 5
Intégrer une carte Maps
Utiliser le multitouch
Les préfixes
Cascade et compatibilité
Rappel sur les sélecteurs
Les nouveaux sélecteurs CSS3
Les nouvelles pseudo-class CSS3 (last-child, nth-child, nth-of-type, not…)
Fonction calc() et propriété box-sizing
Mise en forme tabulaire et multi-colonnes
Le modèle de boite flexible
Les modèles de mise en page CSS
La mise en page en grille CSS
La mise en forme d’un modèle de site vitrine
Les bonnes pratiques du Responsive Web Design
Adaptabilité des pages et web application
Framework et librairies : iUi, Less, FitVids, Modernizr, Angular…
Adaptabilité du contenu et du contenant
Le viewport
Créer une page adaptive
Couleurs et polices de caractères
Coins arrondis, ombres portés, dégradé de couleurs
Bordures en images
Fonds multiples
Transformations 2D et 3D
Génération de contenu
Les tooltips
Les transitions
Les animations
Le menu de navigation animé
Présentation de Bootstrap 3 et 4, le Framework cadriciel de Twitter
Faites-nous part de votre projet de formation,
nous sommes là pour vous guider.
