HTML5 : Développement Web avec CSS3 et JavaScript

Formation #2320 - 4 jours

HTML5 permet aux développeurs d'optimiser l'expérience utilisateur sur les navigateurs de bureau, les smartphones et tablettes. Vous appliquez les bonnes pratiques et les normes émergentes pour le balisage HTML, la mise en forme CSS et la programmation JavaScript pour optimiser vos applications web, améliorer la performance des sites, l'accessibilité et les moteurs de recherche.

  • Exploiter HTML5 pour concevoir des sites modernes riches en fonctionnalités
  • Améliorer le SEO/a11y avec les éléments sémantiques, les rôles ARIA et les microdonnées
  • Créer des présentations accrocheuses et professionnelles avec CSS3
  • Programmer des applications Internet riches avec les API JavaScript

  • Amélioration de la sémantique, de l'accessibilité et de l'optimisation pour les moteurs de recherche grâce à l'utilisation de balises
  • Éviter les erreurs de saisie avec la validation et les sélecteurs
  • Moderniser l'aspect à l'aide des CSS3 et des Media Queries
  • Personnaliser l'expérience utilisateur avec la programmation JavaScript
  • Dépeindre graphiquement des données avec Canvas et SVG

Aux concepteurs et développeurs de sites web souhaitant migrer leurs sites vers HTML5.

Des connaissances en HTML et CSS du niveau de la formation 470, Développement d'un site web, ainsi qu'une expérience de JavaScript sont fortement recommandées.

  • Démystifier HTML5
  • Optimisation regressive pour supporter les anciens navigateurs

Optimiser les balises avec de nouvelles sémantiques

  • Faire passer les pages à HTML5
  • Sectionner le contenu avec des éléments structurels

Annoter le HTML avec des vocabulaires liés

  • Maximiser l’accessibilité avec des rôles ARIA
  • Optimiser la visibilité de la page avec les microdonnées

Aider les utilisateurs avec la saisie des formulaires

  • Faciliter la saisie avec autofocus et placeholder
  • Valider la saisie de données sans écriture de scripts
  • Prévenir les erreurs avec les contraintes et les sélecteurs
  • Personnaliser les messages d’erreur avec l’API Constraint

Manipuler les bordures et l’arrière–plan

  • Préfixes vendeurs
  • Coins arrondis
  • Gradients
  • Images de bordure redimensionnables

Créer des effets recherchés

  • Zones de texte et boîtes flottantes avec ombres et opacité
  • Animer les transformations et les transitions

Personnaliser l’aspect à travers les navigateurs

  • Installer les polices téléchargeables avec @font–face
  • Masquer des valeurs dans les attributs data–* personnalisés
  • Adapter les versions pour mobiles avec des Medias Queries

Permettre aux utilisateurs de travailler hors ligne

  • Définir un manifest
  • Traiter les avertissement de cache

Programmer l’API de géolocalisation dans JavaScript

  • Évaluer la latitude et la longitude de la position de l’utilisateur
  • Sélectionner le contenu par la proximité

Appliquer les bonnes pratiques JavaScript modernes

  • Exploiter les fonctions anonymes et les IIFE
  • Simplifier le développement de JavaScript avec jQuery

Conserver les données avec l’API de stockage Web

  • Sauvegarder les paires nom/value dans localStorage
  • Stocker les données complexes au format JSON

Optimiser les formulaire avec du texte enrichi et JavaScript

  • Tester et prendre en charge les fonctionnalités avec Modernizr
  • Simplifier la mise en forme du contenu avec les éditeurs WYSIWYG

Manipuler les fichiers avec le glisser–déposer

  • Gérer les événements sur les cibles compatibles avec le glisser–déposer, interfaces de programmation HTML5 pour le téléchargement de fichier en glisser–déposer

Échange de données de messagerie avec des API JavaScript

  • Poster des messages à travers les fenêtres
  • Accéder aux fournisseurs externes avec Cross–Origin Resource Sharing (CORS) et XMLHttpRequest 2
  • Envoyer des données avec WebSockets
  • Améliorer la réactivité avec les Web Workers

Remplir l’élément Canvas

  • Éliminer les dépendances des plugins avec les graphiques natifs
  • Dessiner des graphiques avec des lignes et des rectangles
  • Rendre du texte et enrichir les images

Réduire la taille des pages avec SVG

  • Créer des graphiques avec un éditeur de texte
  • Remplacer les images vectorielles par des fichiers PNG plus gros

Enrichir un site avec du son

  • Ajout d’éléments audio à une page web
  • Prise en charge de multiples formats de fichiers

Ajouter une vidéo sur le web

  • Conversion aux formats H.264, Ogg et WebM avec Firefogg et HandBrake
  • Sous–titrer une vidéo avec WebVTT (Web Video Text Tracks)

Sessions planifiées inter-entreprises

Contactez-nous au 01 49 68 53 00 pour planifier une session.

Demander un devis

Intra-entreprise

Organisez cette formation Learning Tree sur votre lieu de travail avec notre solution intra-entreprise.

Demander un devis

Crédits ECTS : 10

Formation éligible aux parcours diplômants de SUPINFO International University.

Financez votre formation

  • Programmes Visa Société et Passeport
  • Réduction Return to Learn

Pour en savoir plus, cliquez ici.

Notre catalogue

Vous souhaitez parcourir toute notre offre de formation ultérieurement ?

Téléchargez notre catalogue

Suivez une formation Learning Tree et profitez des avantages de SUPINFO International University !

Pour toute formation que vous aurez suivi chez Learning Tree, SUPINFO International University vous offre pendant un an le statut Advanced Member d'une valeur de 250€.
Ce statut privilégié vous permettra de profiter de ressources pédagogiques sélectionnées par SUPINFO :

* Services disponibles prochainement.