HTML5 et CSS3

Objectifs

Cette formation vous permet d'utiliser les langages HTML et CSS dans leurs dernières versions pour créer des documents respectant les standards W3C. Décrire les structures et syntaxes HTML5 et CSS3. Évaluer la qualité de votre code.

Public

Toute personne désirant connaître ou utiliser les langages d’encodage HTML5 et CSS3.

Durée

35 heures en présentiel sur 5 jours

Pré-requis

Être à l’aise avec l’utilisation de son environnement informatique.

Formateur

Formateur expérimenté, développeur de site Web, et spécialiste du Web.

Méthode pédagogique

8 participants maximum, un poste par stagiaire et un support de cours est remis en fin de stage. La formation est constituée d'apports théoriques, de démonstrations et de mises en pratique basées sur des exercices.

Modalité de validation des acquis

Évaluation en ligne des acquis via un questionnaire. Attestation de fin de stage.

Déroulé

Concepts généraux

  • Définition des termes HTML, XHTML et CSS
  • Différence entre le XHTML et le HTML
  • La notion de balise
  • Standards et validation W3C
  • Qu’est-ce que HTML5 et CSS3 ?

Structure d'une page HTML5

  • Le Doctype
  • Différentes parties d’un document HTML
  • Les balises et leurs attributs
  • Utiliser les commentaires
  • Gérer les paragraphes
  • Intégrer des titres
  • Gérer des listes d'éléments
  • Structurer un document à l'aide des « boîte div »

Intégrer des médias

  • Les éléments audio et vidéo
  • Contrôler l'interface, les paramètres par défaut
  • Les conteneurs, le problème des codecs
  • Mettre en place une politique HTML5 + Flash pour le multimédia

Gérer les liens

  • Notion de lien absolu et de lien relatif
  • Créer des liens hypertextes
  • Créer des ancres

Les formulaires

  • La balise form
  • Créer et utiliser des formulaires HTML5
  • Adapter ses formulaires à l'environnement mobile (téléphone, tablette)
  • Les contrôles disponibles (slider, etc.)
  • Mettre en place des validations

Introduction aux API HTML5

  • La géo-localisation
  • Fullscreen
  • Canvas
  • Drag and Drop

 

Les bases de CSS

  • Structure CSS
  • Syntaxe d’une feuille de style
  • Notions d'éléments «in-line» et «block»
  • Utilisation des sélecteurs de balise

Les sélecteurs CSS

  • Utilisation des attributs HTML « id » et « class »
  • Utilisation des sélecteurs d'identifiant et de classe
  • Utilisation des pseudo-classes et mise en forme des liens
  • Utilisation des sélecteurs descendant

CSS3 : les nouveautés

  • Coins arrondis
  • Ombres portées
  • Transparence
  • Animations

Mise en page et positionnement

  • Mise en page par patron
  • Mise en page multi-colonnes
  • Mise en page par boites horizontales ou verticales
  • Positionnement par grille
  • Autres nouveautés