HTML5 et CSS3 Perfectionnement

DESCRIPTION :

  • HTML5 (HyperText Markup Language 5) est la prochaine révision majeure d’HTML (format de données conçu pour représenter les pages web). HTML5 spécifie deux syntaxes d’un modèle abstrait défini en termes de DOM : HTML5 et XHTML5.
  • CSS3 est le dernier standard du langage CSS

OBJECTIFS :

  • Enrichir vos sites grâce à la puissance des nouvelles versions des langages HTML5 et CSS3.

MÉTHODES PÉDAGOGIQUES :

  • Méthode active et démonstrative basée sur l’alternance de la théorie et de travaux pratiques sur ordinateur.
  • Chaque stagiaire dispose d’un ordinateur et l’alternance de la théorie et de travaux pratiques permet une validation concrète des acquis des stagiaires tout au long de la formation sous la conduite du formateur.
  • Validation des acquis par des grilles d’analyses, des exposés, des apports méthodologiques, des exercices et des tests d’évaluations.

DURÉE :

2 Jours – 14h.

PUBLIC :

Graphistes, webmestres, toute personne connaissant déjà ces langages et souhaitant découvrir les possibilités offertes par ces technologies de pointe.

PRÉ-REQUIS :

Il est nécessaire d’avoir suivi le stage « HTML et CSS Initiation » pour suivre cette formation.

PROGRAMME DE FORMATION :

Les spécifications HTML5 et CSS3

  • Compatibilités et restrictions par rapport aux différents navigateurs
  • Différences entre le HTML4 et le HTML5 : balises et attributs dépréciés

HTML5 : structure et syntaxe

  • La structure d’une page
  • Les nouvelles balises et leurs attributs : header, nav, article, section, figure, footer, aside, adress, time, rôle
  • Découvrir les APIs de dessin 2D, de lecture vidéo et audio

CSS3 : nouveaux sélecteurs et propriétés* *

  • Cibler les éléments avec précision : les sélecteurs :before, :after, ~, [attr], :empty, :enabled, :root, :first-of-type…
  • Décorer efficacement : border-radius, transitions, rotations, opacity, box-shadow
  • Gérer les images de fond :
    • multiple backgrounds
    • background-size
  • Formater le texte :
    • les polices embarquées avec @font-face
    • text-shadow
  • Le multicolonne :
    • propriétés inline-block
    • column-count
    • column-gap
    • column-rule
    • column-width

HTML5 et CSS3 pour les mobiles et les tablettes

  • Intégration d’un template en HTML5 et CSS3
  • Utilisation de l’API de la balise vidéo : contrôler la vidéo via HTML5 et appliquer des effets CSS
  • Utilisation de l’API de la balise audio : du son sans plugin
  • Typographie Web : expérimenter les effets de texte avec des polices customisées
  • Galerie photo et slideshow avec animations et transitions
  • Utilisation de l’API de dessin 2D avec l’élément Canvas