• Standards du Web, accessibilité
• Doctype, les normes HTML4, XHTML, HTML5, CSS1, CSS2, CSS3
• Structure des pages
• Conception graphique
• Cahier des charges techniques (standards, accessibilité, navigateurs, OS)
• Analyse des structures de sites avec la barre Webdevelopper
• Feuilles de style internes, externes, intégrées
• Héritage des styles en cascade, sélecteurs css, classes, id, pseudo-classes…
• Principes de nomenclature pour les styles
• L’architecture du HTML et des CSS
• Structure et sémantique : balises sémantiques, balises inline et bloc
• Utilisation efficace de l’héritage (éviter la “classite” et la “divite”)
• Pseudo-éléments et propriétés avancées
• Modèles de boîtes CSS
• Flux et positionnements (relatif, absolu, fixe, flottant)
• La gestion des clear
• CSS et navigateurs
• Maîtrise des rendus sur les différents navigateurs
• Outils de validation
• Conception de gabarits de base (multicolonnes, centré, fluide / fixe)
• Conception de menus horizontaux, verticaux et à onglets avec les listes
• Conception d’une galerie photos
• Conception d’un formulaire
• La technique des portes coulissantes
• Designer une zone à contenus variables
• Les sprites
• Les techniques de centrage
• Architecture des feuilles de style :
- arborescence des fichiers et répertoires
- nomenclature
- organisation des règles de style
• Présentation des frameworks CSS et des feuilles resets CSS : conseils et comparatifs
• Modes d’écriture et organisation des propriétés
• La cascade, les règles hiérarchiques, les conflits d’héritage (calcul des spécificités des sélecteurs)
• Utilisation des outils d’analyse
• Quirks mode et Doctype
• Les modèles de boîtes CSS : rappel
• Le facteur IE : quelques bugs connus
- solutions : hacks et contournements
• Bien utiliser les flottants pour les maquettes
• La problématique du zoom des navigateurs
- unités em ou % ?
- astuces et utilisation du convertisseur pixels / em
• Les CSS dans un contexte CMS
• Les CSS pour les newsletters
• Les feuilles de style pour différents rendus
(résolution, impression, PDA...)
• L’avenir du Web : HTML5 et CSS3
• Les nouveautés HTML5 (header, nav, section, footer, caption...)
• Nouveaux sélecteurs et propriétés CSS3 : images de fonds multiples, taille des images de fond, coins arrondis, displays...)
• Exemples de structure de maquette
• Analyse comparative de sites
• Analyse d’un prototype de développement
• Personnalisation : choix d’habillage en fonction de l’utilisateur
• Faire un “style switcher” en vue de l’accessibilité
• Ajustement d’un gabarit à différentes résolutions