Search
Intitule:search
Categories:search



48

image

Webdesign , Webmaster, HTML Javascript (niveau 3)

Webdesigners, webmasters, programmeurs
Aucun prérequis

Permettre aux stagiaires de maîtriser les structures, les fonctions, les types sous les langages Javascript, HTML, CSS, AJAX

communication programmation

perfectionnement

Webdesign , Webmaster, HTML Javascript (niveau 3) :

Introduction :

  • Qu’est-ce qu’une page Web ?
  • Brève histoire et Ă©volution de JavaScript
  • ECMAScript et JavaScript
  • Que fait JavaScript concrètement ?

Premiers pas :

  • PrĂ©sentation des outils : Sublime Text, le navigateur
  • Console et outils de dĂ©bogage
  • Insertion de JavaScript dans des pages
  • Notions de variables et de donnĂ©es

Les types et operateurs : 

  • Les nombres (type Number)
  • OpĂ©rateurs numĂ©riques : + * / %
  • Autres opĂ©rateurs : ++ -+=…
  • Math : la “calculette” du dĂ©veloppeur
  • Les chaĂ®nes (type String) et la concatĂ©nation
  • Fonctions liĂ©es aux chaĂ®nes
  • Les boolĂ©ens (type Boolean)

Les conditions :

  • Structure conditionnelle : if, else, else if
  • Écriture des tests : opĂ©rateurs de comparaison
  • Exemple avec une page login

La notion d’objet :

  • Comment dĂ©finir un objet ?
  • PropriĂ©tĂ©s, mĂ©thodes et Ă©vĂ©nements

Les événements liés à l’utilisateur :

  • MouseEvent : click, mouseover, mouseout, mousemove…
  • KeyboardEvent

Le DOM : modifier la page avec JavaScript :

  • L’arbre DOM, les noeuds, les parents, les enfants
  • AccĂ©der aux Ă©lĂ©ments de la page
  • Accès aux attributs, aux styles et aux classes
  • CrĂ©ation, modification et suppression d’élĂ©ments DOM
  • Quelques mots sur jQuery

Les fonctions :

  • DĂ©claration et appel d’une fonction
  • Paramètres des fonctions
  • Usage et exemples de fonctions utilitaires courantes

Les boucles :

  • La boucle for, variable d’incrĂ©mentation
  • La boucle while
  • CrĂ©ation d’un menu dynamique avec une boucle

Les tableaux : Array

  • La notion d’index
  • Array et boucles
  • Manipuler un Array : exemple d’un panier de courses

Les dates :

  • Gestion du temps avec les dates
  • CrĂ©ation d’une horloge digitale

Exercices Evénements et données :

  • Organisation des Ă©vĂ©nements. Impact des Ă©vĂ©nements sur les types de navigateurs et versions de DOM
  • Positionner des Ă©couteurs sur des Ă©vĂ©nements par programme et paramĂ©trage de balises HTML
  • Règles pour faire un codage multinavigateur
  • CrĂ©er, dĂ©truire des Ă©couteurs
  • Les traitements Ă©vĂ©nementiels JavaScript : gestionnaire clavier, souris, formulaires, rollover, menus dynamiques
  • L'objet Event et son utilisation
  • Les objets du DOM (window, document...) et leur manipulation
  • Manipulation des URL (redirections http ...).
  • Gestion des cookies (lecture et Ă©criture)
  • Programmation d'Ă©vĂ©nements multiples sur les Ă©lĂ©ments formulaire, souris, clavier...

 
Exercice Gestion de formulaires HTML :

  • Manipulation de contenu de formulaires
  • Accès et modification dynamique des composants du formulaire : zone de saisie, cases Ă  cocher, cases d'options...
  • Fonctions de validation de formulaire
  • EvĂ©nements liĂ©s aux Ă©lĂ©ments de formulaire : changement, initialisation, clic... 
  • Conception de fonctions personnalisĂ©es contrĂ´lant les activitĂ©s de l'utilisateur

 
Exercice Javascript et CSS : 

  • Rappel sur les feuilles de style en cascade (CSS-1, CSS-2)
  • Les outils pour les manipuler
  • ImplĂ©mentation des CSS en tant que propriĂ©tĂ©s des objets du DOM
  • Modification directe des propriĂ©tĂ©s CSS des objets du DOM
  • Modification de l'objet CSS stylesheets
  • Rendre la page dynamique via le changement des propriĂ©tĂ©s de style
  • RĂ©alisation de pages simples afin de se familiariser Ă  l'utilisation de feuilles de style et Ă  leur manipulation Ă  travers JavaScript

Exercice Javascript DOM XML :

  • PrĂ©sentation du langage XML (Ă©lĂ©ments attributs)
  • ImplĂ©mentation des parseurs XML chez Microsoft IE et les autres : variantes entre les navigateurs, maintenance...
  • Manipulation des objets du DOM (lecture, ajout, suppression, modification de noeuds)
  • Familiarisation Ă  la construction d'un chemin d'accès Ă  un Ă©lĂ©ment du DOM

Exercice AJAX : 

  • Enjeux, solutions et alternatives
  • Les bibliothèques du marchĂ©
  • HTTP et Ajax : Ă©changes HTTP et l'objet XMLHttpRequest
  • RĂ©cupĂ©ration de donnĂ©es XML et affichage des donnĂ©es. Interrogation d'une base de donnĂ©es. CrĂ©ation d'un formulaire de connexion

Autres sujets avancés :

  • CrĂ©er un menu en HTML / CSS
  • Graphisme avancĂ© : canvas, SVG
  • Responsive design pour les mobiles
  • Convertir et insĂ©rer des sons, musiques
  • Convertir et InsĂ©rer des videos
  • Couleurs et dĂ©gradĂ©s de couleurs
  • Polices de caractères hĂ©bergĂ©es
  • frames, iframes, pseudo frames en CSS
  • Champs formulairĂ©s spĂ©ciaux : Date, Time, Email, URL ; number, min, max, step, range ; Required, Focus
  • Controle avec RegExp
  • header / footer
  • Datalist et Ajax
  • GPS
  • Webcam API
  • Boutons avancĂ©s avec CSS3
  • Flash et alternatives
  • CSS transition, CSS animation, SVG, Canvas
  • HTML5 cache
  • Javascript et Jquery : cours et exercices
  • Google Map, KML
  • Emailing, newsletter, HTML et CSS adaptĂ©s ; plateformes hĂ©bergĂ©es comme mailchimp, phplist, wordpress, drupal et appli.pro
  • introduction aux services Web REST
  • Balises sĂ©mantiques avancĂ©es
  • SecuritĂ© : SSL, .htaccess, hacking etc ...
  • Paiment par internet, Paypal etc ...
  • ConsidĂ©rations techniques et de contenu Ă  prendre en compte pour optimiser le rĂ©fĂ©rencement (SEO)
  • Exercices pratiques avec un hebĂ©rgement ou sur plateforme appli.pro



formation-webmaster-avance




Parties du prog de formation

Espace Informatique de Vincennes. 26 rue de Eglise, 94300 Vincennes. Email : info@netvincennes.fr, Centre de formation 11940752894 (num. existence) , SIRET 508 593 845 00011, NAF 6190Z, Pas de TVA Art. 293 B du CGI


sitemap xml