Formation HTML 5 CSS3: Création de site et applications Web

Demander un devis
Je souhaite télécharger le programme ou imprimer le programme
  • Imprimer

Objectif

formation-html5

HTML est un langage qui permet de présenter des informations sur Internet. Bien qu'encore en cours de création, la version HTML 5 est un langage parfaitement utilisable.

A la fin de cette formation, vous serez capable de :

•    Savoir développer des sites internet en HTML 5

•    Créer des pages en HTML 5 et utiliser les nouvelles balises HTML 5.

•    Utiliser les APIs JavaScript de HTML 5..

•    Connaître le niveau de support des fonctionnalités HTML 5 par les navigateurs actuels.

•    Emuler certaines fonctionnalités HTML5 sur des navigateurs moins récents.

•    Développer des applications dynamique avec  interaction avec les uilisateurs

•    Mettre en page et en forme avec CSS3

 

Public concerné

Développeurs de sites Web, chefs de projets web,   responsables de site web, webmasters

Pré-requis

Il faut connaitre le (X)HTML et le JavaScript ou avoir suivi les formations XHTML/CSS et JavaScript.

Informations pratiques

Référence : #HC53 V2

Durée : 10 sessions de 5 jours

Tarif inter-entreprises: 2050 (HT)

Stage intra-entreprise disponible

 

 Dates  :

 - 18 au 22 janvier 2016

 - 08 au 12 Février 2016

 - 14 au 18 Mars 2016

 - 11 au 15 Avril 2016

 - 09 au 13 Mai 2016

 - 20 au 24 Juin 2016

 - 18 au 22 Juillet 2016

 - 05 au 09 février 2016

 - 10 au 14 Octobre 2016

 - 28 Novembre au 02 Décembre 2016

 - entre janvier et décembre 2016

 - une semaine par mois

 

Consultez-nous pour obtenir un devis et les prochaines disponibilités de nos consultants formateurs.

Présence nationale

Thumbnail image

Cliquez sur l'image pour l'agrandir

Aix-en-Provence, Auxerre, Bordeaux, Caen, Clermont-Ferrand, Dijon, Grenoble, Lille, Lyon, Marseille, Montpellier, Nantes, Nice, Paris, Perpignan, Reims, Rennes, Rouen, Strasbourg, Toulouse, Toulon, Tours

Programme

Présentation

  • HTML : le langage du Web
  • Contexte historique

Environnement et structure

  • Le concept des balises
  • Le bon usage des balises
  • Particularités et pièges du HTML
  • Le document HTML minimum

Mise en forme du document

  • Le texte simple
  • Les objets d'un document
  • L'en-tête d'un document HTML

Mise en forme du texte

  • Les titres
  • Les paragraphes de texte
  • Le contrôle de passage à la ligne
  • Le formatage du texte
  • L'alignement
  • La taille, la couleur et la police
  • Les caractères spéciaux
  • Les commentaires
  • Les autres balises de texte

Les listes

  • Numérotées
  • A puces
  • Imbriquées
  • Les listes de définition

Les tableaux

  • Les cellules de tableau
  • La fusion des cellules
  • Gestion de la taille du tableau
  • En-tête et légende
  • Les bordures
  • Les groupes de colonnes
  • Les groupes de lignes

Les hypertextes

  • La balise de liens
  • Liens vers une autre page
  • Liens à l'intérieur d'une page
  • Liens vers un autre site Web
  • Liens vers une adresse électronique
  • Liens pour télécharger un fichier
  • Les Target
  • L'attribut titre
  • La couleur des liens
  • Liens et feuilles de style

Insertions d'images

  • Les images du Web
  • L'insertion d'une image
  • L'espace autour d'une image
  • L'alignement d'une image
  • L'insertion d'une couleur d'arrière-plan
  • L'insertion d'image d'arrière-plan
  • L'insertion d'un lien sur une image
  • Les images réactives

Les formulaires

  • La déclaration de formulaire
  • Zone de texte à une ligne, à plusieurs lignes
  • Menu déroulant
  • Bouton radio
  • Bouton checkbox
  • Bouton d'envoi
  • Bouton d'annulation
  • Bouton de commande
  • Les formulaires cachés
  • Les formulaires de transfert de fichier
  • Les formulaires de mot de passe
  • L'organisation des éléments d'un formulaire

Les meta-informations

  • Doctype ou DTD

Les feuilles de style

  • Les propriétés : couleur, police, marge,...
  • Les classes
  • Dynamiser un site avec CSS
  • Gérer les positionnements

Introduction à JavaScript

  • JavaScript pour quoi faire ?
  • L'environnement du client Web
  • Le navigateur
  • Les outils
  • Insérer un script dans un document HTML/XHTML

JavaScript : le coeur du langage

  • La syntaxe
  • Les variables
  • Les fonctions globales
  • Les opérateurs
  • Les structures de contrôle
  • Les fonctions : définition, arguments, fonctions littérales, fonctions sous forme de données
  • Les objets personnalisés : constructeur, méthodes et propriétés, prototype, objets littéraux, objets sous forme de tableaux associatifs
  • Les objets globaux : Array, Date, Math, RegExp, String... Manipuler les tableaux, les dates, les chaînes de caractères

Les objets du navigateur

  • La hiérarchie des objets
  • Les principaux objets : window, document, location, screen, navigatior, form... Leurs propriétés et méthodes
  • Manipuler des fenêtres
  • Gérer des timers
  • Écrire et lire des cookies

Introduction à HTML 5 et CSS3

  • Contexte : fonctionnement d’un site internet
  • Histoire du HTML
  • Organismes de normalisation : WHATWG et W3C
  • La nouvelle vision HTML 5
  • Roadmap HTML 5

Utiliser le HTML 5 aujourd'hui

  • Savoir quand choisir le HTML 5
  • Utiliser le HTML 5 avec des navigateurs qui ne le supportent pas

Balisage HTML 5

  • Structure d'une page : disparition des notions "en ligne" et "bloc"
  • Doctype, NameSpace, Encoding
  • Les nouveaux éléments : section, article, aside, nav, ... pour en-têtes , pied de pages, etc.
  • Les indispensables balises telles que menu, command, details, summary
  • Elements  sémantiques
  • Les micro data
  • Dates et temps
  • Les éléments obsolètes : center, font, frame, acronym, ...
  • HTML 5 et CSS
  • Compatibilité entre navigateurs
  • Optimisation des balises pour les moteurs de recherche (SEO)

Les formulaires HTML 5

  • Balise form
  • Créer et utiliser des formulaires HTML 5
  • Gestion des dates, des emails, ..
  • Les validations de formulaire en HTML5
  • Auto focus

Audio et Video en HTML 5

  • Les éléments audio et video
  • Les conteneurs
  • Contrôler la vidéo, l'audio avec l'API HTML5
  • Support et formats (codecs WebM, MP4, H.264, Ogg Theora, MP3, AAC, Vorbis)
  • Gérer plusieurs sources vidéos/audios
  • Streaming
  • Ajouter des sous-titres à une vidéo HTML5

Vue d'ensemble des APIs pour HTML 5

  • Les APIs HTML 5
  • Gestion des fichiers
  • Audio et Vidéo
  • Site web hors ligne
  • Drag & Drop
  • Extension de HTMLDocument
  • Extension de HTML Element
  • Historiques de pages

Dessiner en HTML 5

  • Dessiner en JavaScript
  • Canvas vs SVG
  • Contexte
  • Accessibilité
  • Quid des designers actuels ?

La communication en HTML 5

  • Les événements
  • Envoi de messages entre documents
  • Envoi de messages par canaux
  • Le push serveur
  • Web Sockets
  • Présentation de node.js
  • Les Web Workers pour le multi-tâches

La géo-localisation avec HTML 5

  • Vue d'ensemble
  • La vie privée de l'utilisateur
  • Géolocaliser ses utilisateurs sur Google Maps

Stockage avec HTML 5

  • Stockage local
  • Stockage en session
  • Bases de données SQL Web

CSS3 : standardiser des propriétés

  • Vue d'ensemble : se passer d'images, éviter les astuces
  • Coins arrondis
  • Ombres portés
  • Transparence
  • Mise en page et positionnement
  • Autres nouveautés

CSS3 : mise en page et positionnement

  • Vue d'ensemble : clarifier le code, éviter la multiplication de
    imbriquées
  • Niveau de présentation
  • Mise en page par patron
  • Mise en page multi-colonnes
  • Mise en page par boite horizontales ou verticales
  • Positionnement par grille
  • Autres nouveautés

CSS3 : animation

  • Transformations (2D et 3D)
  • Transitions

Logiciels utilisés

Tout logiciel où il n'y a aucun intérêt pédagogique à le faire faire par les stagiaires sera préinstallé sur les postes.

Travaux pratiques

Tout au long de cette formation, de nombreux exercices seront effectués. En effet, environ 60% du temps est concacré à la pratique.

Formations connexes disponibles dans notre centre de formation

Si vous souhaitez aller plus loin, vous pouvez suivre les formation Ajax avec JQuery ou php initiation.

Mots clés associés à cette formation

XHTML, HTML5, HTML 5, CSS3, CSS 3, JavaScript, Standard, W3C, WHATWG, Internet, Web, site.

Financement de la formation professionnelle

Ce cours peut être financé par l'OPCA (Agefos, Fafiec, Opcalia...) de votre entreprise ou par le Fongecif de votre région.

Il peut également être suivi dans le cadre du DIF, du CIF, ou d'une période de professionnalisation.

.

X
 
 
 
 
 

You havecharacters left.