L'ajout de cookie est désactivé sur votre navigateur, vous devez l'activer pour pouvoir naviguer sur ce site internet.
UpUp, la 1ère plateforme de mutualisation de formations.

Les fondamentaux du développement d'interfaces graphiques avec HTML5, CSS3 et JavaScript

Formation Développement web et mobilité

Les fondamentaux du développement d'interfaces graphiques avec HTML5, CSS3 et JavaScript

Informatique > Développement web et mobilité

Objectifs

  • Disposer des compétences nécessaires au développement d'un site internet full HTML5 / CSS3.
  • Savoir produire des pages compatibles avec les différents navigateurs internet.
  • Être capable de créer des interactions dynamiques avec l'utilisateur sans développement serveur.
  • Comprendre comment tirer parti des dernières nouveautés HTLM5 comme le lecteur vidéo compatible mobiles.

Le programme de la formation

Présentation

 

HTML : le langage du Web
Contexte historique

 

Environnement et structure

 

Concept et usage 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

 

Titres et 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, à puces, imbriquées
Les listes de définition

 

Les tableaux

 

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

 

Les hypertextes

 

La balise de liens
Les différents types de liens : vers une autre page, dans une page, vers un site Web, de téléchargement...
Les Target
L'attribut titre
La couleur des liens
Liens et feuilles de style

 

Insertions d'images

 

L'insertion d'une image
L'espace autour d'une image
L'alignement d'une image
Couleur et 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
Menu déroulant
Boutons : radio, checkbox, d'envoi, d'annulation, de commande
Les formulaires : cachés, de transfert de fichier, de mot de passe
L'organisation des éléments d'un formulaire

 

Les méta-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

 

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
Objets personnalisés et objets globaux
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, navigator, form...
Manipuler des fenêtres
Gérer des timers

 

Introduction à HTML5

 

Contexte : fonctionnement d'un site internet
Histoire et normalisation du HTML
La nouvelle vision HTML5
Roadmap HTML5

 

Comment utiliser le HTML5 aujourd'hui

 

Savoir quand choisir le HTML5
Utiliser le HTML5 avec des navigateurs qui ne le supportent pas

 

Le balisage HTML5

 

Structure d'une page
Doctype
Les nouveaux éléments et les éléments obsolètes
HTML5 et CSS3

 

Les formulaires

 

La balise form
Créer et utiliser des formulaires HTML5

 

Audio et vidéo

 

Les éléments audio et vidéo
Les conteneurs, les codecs
Compromis pour un site à forte audience

 

Vue d'ensemble des APIs

 

Les APIs HTML5
Audio et vidéo
Site web hors ligne
Drag et Drop

 

Dessiner en HTML

 

Canvas vs SVG
Contexte et accessibilité

 

La communication en HTML5

 

Les évènements
Envoi de messages entre documents
Envoi de messages par canaux
Le push et les WebSockets pour plus de performances

 

La géolocalisation

 

Vue d'ensemble
La vie privée de l'utilisateur

 

Stockage

 

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

 

CSS : standardiser des propriétés

 

Se passer d'images, éviter les astuces
Coins arrondis, ombres portées, transparence, animations
Autres nouveautés

 

CSS : mise en page et positionnement

 

Vue d'ensemble : clarifier le code, éviter la multiplication de div imbriquées
Niveau de présentation
Mise en page par patron
Mise en page multi-colonnes
Mise en page par boites horizontales ou verticales
Positionnement par grille
Autres nouveautés
CSS pour mobiles et tablettes

Public et Pré-requis de la formation

Développeurs .Net ou Java souhaitant savoir exploiter les possibilités offertes par HTML5 et CSS, Chargés de développement d'applications informatiques.

 

Connaissance internet standard, notions d'algorithmie.

Méthode pédagogique de la formation

Une progression pédagogique qui permet de comprendre les traitements qui peuvent être délocalisés du serveur vers le poste client.
Création d'une application "fil rouge" : création du contenu, de la mise en forme, tests multi-navigateurs, ajout de fonctionnalités dynamiques et HTLM5, mise en production.
La pédagogie favorise les échanges entre participants ; l'animateur apporte des réponses personnalisées à chacun.
Les contenus digitaux mis à disposition des participants après la formation renforcent l'efficacité pédagogique du programme et garantissent un bénéfice durable de l'action de formation.

29 Commentaires