Badge Développement

Formation
HTML 5/CSS 3

: 5 jours

: Gratuit

: Technobel - Ciney

: 5 jours

: Gratuit

: Technobel - Ciney

Cette formation aborde l’utilisation du langage HTML et le langage de style CSS dans le contexte du métier de développeur Web. Elle est fortement orientée sur la pratique et présente de nombreux exemples aux participants. Cette formation aborde l’entièreté des possibilités de développement offertes par la combinaison HTML 5/CSS 3 aussi bien en ce qui concerne le développement Web que le développement Mobile.


  • Maîtriser les formats des documents
  • Maîtriser les balises
  • Mettre en forme des listes sur une page
  • Structurer un document HTML
  • Utiliser les styles de paragraphes
  • Utiliser les hyperliens
  • Mettre en forme des listes imbriquées
  • Utiliser une feuille de style
  • Créer une feuille de style
  • Maîtriser les unités de mesure
  • Appliquer les ordres de priorité sur les feuilles de style
  • Mettre en page avec des blocs
  • Utiliser les styles textuels
  • Mettre en page des formulaires
  • Mettre en page des tableaux
  • Gérer l’utilisation des images et leur redimensionnement
  • Mettre en place un design responsive
  • Utiliser différents modes d’affichage
  • Gérer les débordements
  • Respecter les contraintes ergonomiques
  • Gérer les menus en fonction de la taille de l’écran
  • Définir le rôle des technologies HTML 5 et CSS 3 dans le développement applicatif
  • Positionner HTML 5 par rapport à ses alternatives
  • Utiliser les nouvelles possibilités offertes par HTML 5
  • Utiliser les nouvelles possibilités offertes par CSS 3
  • Développer des formulaires utilisant les fonctionnalités d’HTML 5
  • Mettre en place des graphismes disposant d’ombres et de bordures avec CSS 3
  • Utiliser le responsive design pour la mise en place d’une application Web
  • Lire des flux vidéo et audio en HTML 5
  • Utiliser les mécanismes de géolocalisation de HTML 5
  • Travailler avec des images vectorielles
  • Utiliser le stockage local
  • Communiquer avec le serveur en HTML 5

Connaissances en algorithmes


  • Le format des documents
    • Le format HTML
    • Les différents types de format
    • Les formats texte, image et vidéo
  • Présentation du protocole http
    • Principes du protocole
    • Les différents types de requêtes
  • Généralités sur HTML
    • Structure type d’une page HTML
    • Format des commandes
    • Exemples de messages
  • Structure d’un document HTML
    • Les balises principales
    • L’instruction !DOCTYPE
    • Les balises BDO, INS et DEL
  • L’en-tête HTML
    • La balise META
    • La reconnaissance par les moteurs de recherche
  • Les styles de paragraphe
    • Les entêtes de paragraphes
    • Les sauts de paragraphes
    • Le formatage des textes
    • Les balises DIV et SPAN
    • Le formatage des textes par les balises
    • Les séparateurs graphiques
  • Les hyperliens
    • Les liens hypertexte
    • Les autres types de liens
  • Les listes
    • Les listes à puce
    • Les listes numérotées
    • Les listes de définition
    • Les listes de menu et répertoire
    • Les listes imbriquées
  • Les tables
    • Définir une table
    • Les balises de définition de tables et leurs attributs
    • La mise en page avec la balise DIV
  • Les styles
    • Les styles physiques
    • Les caractères accentués
    • Les styles logiques
    • Les modifications de fontes
    • Les balises FONT
    • La mise en page des tables
    • La mise en page basée sur les DIV
  • Les images et les couleurs
    • L’insertion d’images
    • Les formats d’images
    • La balise IMG
    • Les balises OBJECT et PARAM
    • Le fond d’écran
    • Les images background
  • Les images réactives
    • Définition d’une image réactive
    • Les coordonnées
    • Imagemap
  • Le multifenêtrage
    • Définition
    • Utilisation
    • Création
    • Les balises de multifenêtrage : frame et frameset
    • La balise noframes
  • Les formulaires
    • Définition d’un formulaire
    • La balise INPUT
    • La balise SELECT
    • La balise TEXTAREA
    • La balise BUTTON
    • La balise FIELDSET
  • La base des CSS
    • Les avantages des feuilles de style
    • Les différentes versions de CSS
    • Le support par les navigateurs
    • Le stockage des feuilles de style
    • Les sélecteurs
    • L’ordre de priorité
    • Les propriétés
    • Les unités de mesure
    • Les couleurs
  • Les boîtes et blocs
    • Les balises de bloc vs. en ligne
    • Les tailles
    • Le positionnement
    • Les marges
    • Les fonds et bordures
    • Le contenu (déroulement/scrolling)
    • Cas particulier des tableaux
  • Les styles textuels
    • Modification des fontes
    • Alignement du texte
    • Cas particulier des liens
    • Effets visuels
    • Listes et menus horizontaux et verticaux
  • Les images
    • De contenu (img) vs. d’apparence (background)
    • Redimensionnement
    • Rollover
    • Liens et images
  • Les formulaires
    • Design des contrôles
    • Mise en forme
  • Responsive design
    • Définition
    • Définir les tailles d’écran
    • Contraintes ergonomiques et fonctionnelles
    • Minimas et maximas
    • Modes portrait et paysage
    • Gérer les débordements de contenu
    • Gérer les débordements de médias
    • Galerie d’exemples
    • Méthodologie de mise en place
    • Media-queries : s’adapter à la résolution d’écran et à l’orientation
    • Gestion des menus
    • Viewport
  • Présentation des technologies
    • HTML 5 : standards et retro-compatibilité
    • Navigateurs et outils de travail
    • HTML 5 vs. Flash
    • Applications HTML 5 vs. applications natives
  • Sémantique, référencement et accessibilité en HTML 5
    • DOCtype, encodage, règles de syntaxe
    • Les nouvelles balises sémantiques
    • Relations, micro-formats et micro-données
  • Sélection et positionnement en CSS 3
    • Nouveaux sélecteurs CSS 3
    • Inline, block et float
    • Contenu en colonnes
    • Le futur du positionnement : (flex)box
  • Formulaires nouvelle génération
    • Nouveaux types de champs
    • Validation par le navigateur
    • Ergonomie, mobile et accessibilité
    • Suggestions automatiques
    • Graphisme dynamique simplifié
  • Graphisme avancé :
    • Polices de caractères personnalisées
    • Couleurs et dégradés
    • Ombres et opacité
    • Bordures et arrières plans avancés
  • Graphisme façon print
    • Contenu en colonne
    • Régions et exclusions
  • Animations
    • Transformations
    • Transitions
    • Animations autonomes
  • Vidéo et audio
    • Formats, codecs et outils
    • Balises
    • API Javascript
    • Plein écran et lecture partielle
  • Géolocalisation
    • Obtenir et suivre la position de l’utilisateur
  • Images : canvas et SVG
    • Images vectorielles
    • Création dynamique d’images en Javascript
  • Stockage local et contenu hors ligne
    • Attributs data-personnalisés
    • localStorage et sessionStorage
    • manifest
    • indexedDB : base de données locale
  • Communication serveur nouvelle génération
    • SPDY : le http accéléré
    • Server-sent events
    • Websockets : communication permanente
    • Initiation à Node-JS
  • Performances et optimisation
    • Webworkers, scripts simultanés et partagés
    • Page Visibility API
    • Battery API

Nous utilisons des cookies à des fins statistiques et pour faciliter la navigation et le partage social.