Développement HTML, CSS et Javascript et création de son premier site Web

 Description

Cette formation a pour but de rendre les stagiaires capables de créer des sites Web sur mesures en utilisant des technologies HTML, CSS et Javascript.

 Pré-requis

  • Connaitre l’environnement Windows, Mac OX ou Linux
  • Connaitre les fondamentaux d’internet

 Publics

  • Personnes en charge de la création d'un site Web et ne disposant d'aucune connaissance technique sur les technologies HTML, CSS et Javascript

 Objectifs

  • Maitriser le langage HTML
  • Maitriser la mise en page avec des règles de style CSS
  • Rendre certains contenus dynamiques grâce au Javascript

 Plan de formation

Accessibilité d’un site Web

Familiarisation avec l’environnement de développement Web

  • La préparation du projet
  • Définition de l’environnement
  • Choix des outils

Les technologies HTML, CSS et Javascript

  • Le HTML/xHTML
    • Qu’est-ce que le HTML/xHTML ?
    • Le W3C
    • Quelles sont les normes qui existent ?
    • Choix d’une norme
    • Validation du code
    • Syntaxe
  • Le CSS
    • Qu’est-ce que le CSS ?
    • Les normes du CSS
    • Validation du code
    • Syntaxe
  • Qu’est-ce que le Javascript
    • Qu’est-ce que le Javascript ?
    • Quel est son utilité ?
    • Comment l’utiliser ?
    • Syntaxe

Création d’une interface simple

  • Structure d’une page HTML de base
    • Le doctype
    • Les balises html
    • Les balises head et leurs contenus
    • Les balises body
  • Création des différentes zones de la page
    • Les balises div
    • Dimensionnement et positionnement des différents blocs en CSS
    • Les sélecteurs de base en CSS
  • Ajout et mise en forme du contenu
    • Les titres (h1, h2, h3, etc…)
    • Les paragraphes (p)
    • Les textes (span, strong, em, etc…)
    • Insertion d’images (img)
    • Insertion de liens (a)
    • Les listes (ul, ol)
    • Les tableaux (table)
    • Les règles de style liées au texte
    • Les bordures
    • Les règles de style pour les listes

Création d’une interface complexe

  • Techniques de style avancées
    • Insertion de plusieurs fichiers de style
    • Les médias supportés
    • Insertion de règles de style dans la page
    • Insertion de règles de style dans les éléments
    • Les sélecteurs avancés
    • Positionnement avancé des éléments
    • Utilisation des marges
    • Utilisation des backgrounds
    • Visibilité d’un élément
  • Créer des formulaires
    • Les balises form
    • Les différents types de champs
    • Les labels
    • Les groupes de champs (fieldset et legend)
    • Le traitement des données

Utilisation du Javascript pour rendre les pages dynamiques

  • Insertion des scripts dans les pages Web
  • Les commentaires
  • Les variables
    • Déclaration
    • Comment les nommer ?
    • Utilisation
  • Les tableaux et les objets
  • Les opérateurs
  • Les structures conditionnelles
    • If, elseif, else
    • Switch
    • For, for in
    • While, Do while
  • Les fonctions de base de Javascript
    • Affichage de messages d’information/de confirmation/de saisie par l’utilisateur
    • Log de variables
    • Sélection d’un élément
    • Affichage de la valeur d’un champ/ du contenu d’un élément
  • Les fonctions personnalisées
    • Déclaration
    • Utilisation
    • La portée des variables
  • Les évènements
    • De la souris
    • Du clavier
    • Autres…

Aller plus loin

  • Le HTML 5
  • Le CSS 3
  • Pourquoi utiliser un langage orienté serveur pour les traitements lourds ?
  • Présentation du PHP

 Profil du formateur

Le formateur, consultant expert sur la technologie, enseignera les bonnes pratique à utiliser lors de ce type de projet et offrira son retour d’expérience dans la création de site Web.