XHTML/ CSS (FEUILLES DE STYLE)

OBJECTIFS

À la fin de la formation, le participant saura intégrer une charte graphique dans un site Web sans que le contenu en soit bouleversé.  Il pourra ainsi mieux structurer le contenu d’un site, améliorer un site existant et optimiser l’affichage entre les différents navigateurs.

CLIENTÈLE VISÉE

Informaticiens et Web Designers ayant une expérience dans le domaine du web

PRÉALABLES

Avoir une bonne pratique du HTML.

DURÉE

4 jours (30 heures)

 

PLAN DE FORMATION

1. Introduction à XHTML et CSS2

  • Avantages et bénéfices du changement
  • Appréhension de la compatibilité pour les différentes versions des navigateurs
  • Outils d’édition HTML, XHTML et CSS : présentation de différents outils
  • Le langage CSS : les différents types de sélecteurs : classe de sélecteur, identifiant de sélecteur, sélecteurs contextuels, sélecteurs groupés
  • Les blocs de texte, les boîtes de texte
  • Les propriétés CSS1, CSSP, CSS2
  • Unités de mesures relatives, absolues

 

2. Techniques de mise en page

  • Démos de sites full CSS, XHTML
  • Structure de documents : utilisation de balises de structuration et de sémantique
  • Positionnement avec la propriété position, positionnement avec la propriété float
  • Création de plusieurs colonnes
  • Mise en page pour les formulaires
  • Mise en page pour les tableaux de données
  • Mise en page pour les menus

3. Introduction à SVG (Scalable Vector Graphics)

  • Rôle et importance du SVG
  • Utilisation de SVG côté client : les formes de base
  • Structure de document SVG, exemple de balises
  • Utilisation des styles CSS avec SVG
  • Différentes méthodes d’intégration du SVG dans un document XHTML

 

4. Optimisation du code Javascript

  • Introduction au DOM et au Javascript
  • Accéder aux objets du document : les différentes techniques d’accès, l’utilisation du mot-clé this, créer dynamiquement des éléments
  • Positionnement d’éléments à l’aide du Javascript : positionnement d’éléments par rapport à la souris, mouvement d’éléments
  • Affichage/masquage d’éléments pour la création de menus hiérarchiques
  • Techniques d’optimisation du code : utilisation d’objets, littéraux d’objet, optimisation des boucles