Formation Transitions, Animations, Canvas, SVG, WebStorage

Rappel HTML5

Syntaxe, nouveau doctype et outils

format des balises

type des balises

structure et sémantique

Nouvelles balises HTML5

Atelier pratique : Créer un site en HTML5/CSS3

Le positionnement en CSS3

position relative

position absolue

float

display

box-sizing

multi-colonnes

Modèle de boîte flexible (flexbox model)

CSS3 :Transformations, transitions et animations

Rotation

translation

Atelier pratique : Animer les différentes propriétés d’un élément

CSS3 : animations

Animations

Atelier pratique : Animer les différentes propriétés d’un élément

JavaScript : 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

Présentation et introduction à <canvas>

Tracé de points et lignes

Tracé de courbes et de cercles

Intégration d’images

Gestion du texte

Mise en place d’un graphique de données

Création des barres de données

Bases de l’animation avec l’API Canvas

Le cas de IE < 9.0

SVG

Présentation de SVG

les objets géométriques

le texte

les couleurs

les remplissages et les gradients.

Les groupes (élément ).

Générateurs et outils SVG

SVG et interactivité

Intégration SVG dans des pages Web

Web Storage et sites hors ligne

Stockage local et stockage de session

Principes généraux de manipulation

Syntaxe JSON

manifest

indexedDB : base de données locale

Géolocalisation

Vue d’ensemble

Se positionner (latitude, longitude)

savoir manipuler l’API

API Google Map

L’approche AJAX

Pourquoi utiliser Ajax?

Comment cela fonctionne?

Construire une requête, pas à pas

L’objet XMLHttpRequest

Les proprietes: readyState, status, responseText, responseXML

Les methodes: open, send….

Gestion du retour (texte, XML ou JSON).

Comment utiliser XMLHttpRequest

Le problème de mémoire cache

XML – AJAX

Présentation du format XML

Structure d’un document XML

format des balises

Atelier pratique : recuperer et traiter un flux xml avec la requête AJAX

JSON – AJAX

Connaître le format JSON

parser une chaine JSON

Atelier pratique: mettre en place une autocompletion