HTML5 et CSS3

L’importance de la typographie sur le Web

• Les défis de la police sur le Web
• Définition d’une famille de polices
• Dimensionner le texte avec CSS
• Les pixels et les points ne sont pas les meilleurs choix
• Utiliser une combinaison de pour cent et la mesure em
• L’utilisation des marges pour modifier l’espace entre votre texte
• Paragraphe pour réglage de la hauteur de ligne
• Transformation de texte avec CSS
• Utilisation des listes HTML
• Listes HTML avec Styles

Introduction à la mise en page CSS

• Travailler avec un fichier de réinitialisation CSS
• Une brève histoire des techniques de mise en page sur le web
• Un aperçu de la page des options de mise en page
• La compréhension de l’élément <div>: la création d’une disposition de deux colonnes à largeur fixe
• Comprendre la propriété CSS float
• Création de colonnes avec la propriété float
• Travailler avec la propriété claire
• Création d’une navigation basée sur une liste en utilisant des flotteurs
• Ajout de styles de texte
• L’effet des marges et le remplissage de votre mise en page à largeur fixe
• Un examen de l’utilisation de marges et le remplissage des mises en page
• Styling de votre pied de page avec une image d’arrière-plan

Atelier et cas pratique

Création de formulaires HTML 5

• Les formulaires mis à jour
• Le fonctionnement des formulaires
• Les composants d’un formulaire
• L’ajout de nouveaux types d’entrée HTML5 et les attributs
• Création d’un formulaire de commande
• Fournir une solution de repli pour les navigateurs qui ne prennent pas en charge HTML5

Principes de base de HTML, XHTML et CSS

• Langages du Web
• Page structure basée sur HTML
• Les détails de la syntaxe XHTML
• Doctype permet au navigateur web savoir à quoi vous attendre
• Le W3C et la page de validation
• La structure HTML
• Mise en place des images en HTML
• Le rôle du CSS
• Du style d’une rubrique
• Comprendre les styles de classe et l’élément <span>
• Trois façons d’utiliser le style
• Feuilles interne vs. Feuilles externe
• Création d’une feuille de style externe
• Ce qui rend les styles en cascade

Introduction à JavaScript et jQuery

• Interactivité sur le web
• Adobe Flash
• JavaScript
• Bases JavaScript
• Placer votre JavaScript dans un document externe
• Le modèle objet de document
• Framework JavaScript
• Cacher un élément avec JQuery
• Ajout d’un événement pour déclencher l’événement show
• Ajout d’une vidéo
• Ajout du support pour d’autres navigateurs
• Contrôle d’une vidéo avec JavaScript
• Ajout d’audio

Atelier et cas pratique

Travailler avec les dessins

• Comprendre l’élément canvas
• Les avantages de l’élément canvas
• Dessin de rectangles
• Tracer des lignes et des cercles
• Dessin avec des courbes
• Ajout d’un texte
• L’utilisation de couleurs, des styles et des dégradés
• Ajout d’images
• L’utilisation des transformations
• Création d’une boucle de dessin

CSS 3

• Comprendre le rôle de CSS3
• Ajout de plusieurs images d’arrière-plan
• Travailler avec la transparence et l’opacité CSS3
• En utilisant des gradients CSS3
• CSS3 gradients de potentiel pour l’avenir
• Transformation CSS3, des transitions et des animations
• Utilisation des polices web
• En utilisant @ font-face pour spécifier une police web
• L’utilisation d’un service Web pour générer plusieurs polices

CSS 3 médias Queries et avenir de CSS 3

• Le rôle des médias queries CSS3
• Utilisation de médias queries CSS3 pour fournir une mise en page mobile optimisé
• Développements à venir dans CSS3
• La mise en page multi-colonnes CSS3
• Le module de mise en boîte souple CSS3
• Le module de mise en page du modèle CSS3
• Ajout position sur la base du modèle CSS

Atelier et cas pratique

Types de stockage HTML5

• Méthodes localStorage
• Exemple localStorage
• Mettre tout ensemble
• Stockage de données avancées
• La mise en cache des applications
• Le cache, le fichier manifeste
• Mise à jour du cache
• L’objet applicationCache
• Amener tout ensemble

HTML 5 Géolocalisation

• Comprendre Géolocalisation
• Obtenir l’emplacement de l’utilisateur
• Affichage de l’emplacement de l’utilisateur avec Google Maps
• Navigateurs manquant HTML5 Géolocalisation
• Création d’un HTML5 Géolocalisation et mashup Google Maps
• Ajout de marqueurs de carte Google à votre page Géolocalisation

HTML 5 Drag & Drop

• Glissez et déposez sur le Web
• Glisser-déposer Cross-navigateur
• Transfert de données avec une opération de glisser-déposer

Atelier et cas pratique