Introduction
Pourquoi HTML5 ?
Format des balises
Les normes HTML, CSS, XHTML, XML, HTML5
Le W3C et les validateurs
La logique d’encodage, ISO-8859-1, UTF-8,..
Rappel sur les bases
Type des balises
syntaxe des règles de style
Positionnement css(relatif, absolu, flaot, display)
Atelier pratique : Créer un site XHTML/CSS
Passage en HTML5
Syntaxe, nouveau doctype et outils
structure et sémantique
Div et span
Nouvelles balises HTML5
Atelier pratique : Reconstruire notre site en HTML5/CSS3
Balises multimédias
inserer une image(Balises <figure>)
insérer une vidéo(Balises <video>)
insérer un son (Balises <audio>)
Compatibilité navigateur
Atelier pratique : Utiliser JavaScript pour contrôler les objets audio et video
Les formulaires
Nouveaux types pour <input>
Nouveaux attributs
Nouveaux éléments <output>,
Les validations de formulaire en HTML5v
Atelier pratique : Réaliser un formulaire HTML5
Dessiner : Création dynamique d’images en JavaScript
La balise Canvasv
SVGv
Tracer de formes(rectangle, cercle,,,,)
Couleurs, remplissages, dégradés
Atelier pratique : Améliorer la lecture de notre vidéo par une barre de progression
Géolocalisation
Vue d’ensemble
Se positionner (latitude, longitude)
CSS3
Vue d’ensemble
Syntaxe, préfixes CSS3
Coins arrondis
Ombres portés
Text-Shadow
Box-shadow
Dégradé linéaire
font-face
Sélecteur d’attribut
CSS3 :Transformations, transitions et animations
Rotation,
translation
Animations
Atelier pratique : Animer les différentes propriétés d’un élément
Découvrir JavaScript
Introduction à JavaScript
Concepts de base du Javascript
Notion d’événements
Gestion dynamique des CSS
Atelier pratique : Validation des champs de notre formulaire de contact
Document Object Model
Qu’est-ce que le DOM ?
Concept de noeud
Hiérarchisation des noeuds(Arbre DOM)
Les proprités de rélation
Les proprités d’état
Les méthodes d’accès aux noeuds
Firefox DOM Inspector
modification du contenu HTML
Modification du style des elements HTML
Atelier pratique : Créer une galerie photo
Faire du responsive design
Principe
Medias queries CSS 3
Atelier pratique : création d’un site multiplateforme (smartphone, tablette..)
Utiliser Bootstrap
Présentation de Bootstrap
Installation de Bootstrap
Le système de grille pour positionnement
Les layouts
Le responsive Design
Atelier pratique : créer une page avec Bootstrap
Les composants Bootstrap
Menus déroulants
Barres de navigation
Fil d’arianne
