Cette page regroupe des explications, documents, tutoriels, et une serie de liens pour appréhender convenablement la création de site en XHTML (Extensible Hypertext Markup Language) et CSS (Cascading Style Sheets) avec ou sans Adobe Dreamweaver. Vous trouverez également des tutoriaux d’utilisation sur Adobe Dreamweaver.

N’hésitez pas à consulter la documentation CSS (liste des propriétés) et la documentation XHTML disponibles sur ce wiki.

Si vous utilisez Firefox, nous vous recommendons d’installer notre plugin de recherche intégré à votre navigateur.

• Création d'un site web XHTML et CSS
• Intégrer une animation Flash dans une page XHTML - SuperDevy
• Comprendre les chemins absolus et relatifs - Nanoum
• Utiliser au mieux les balises META - Gamin
• Centrer un site qui utilise calques en absolus et tableaux - Nanoum
• Centrer une page à l'aide d'un tableau - Gto
• Intégration de fichiers son - Nanoum
• Comment intégrer une vidéo QuickTime dans une page XHTML ?
• Les rudiments du HTML - Piloue
• Optimiser ses images pour le web - Nanoum
• Référencer que ce qui vous intéresse avec Robots.txt - Gto
• Bien débuter en (X)HTML - mEga
• Empêcher le vol des images et l'affichage de la source - Piloue
• Insérer une vidéo dans une page Web - Antoine

• Raccourcis d'écriture - SuperDevy
• Faire un cadre arrondi ou graphique en CSS
• Comprendre les Feuilles de style en cascades
• Utiliser les CSS - Gto
• Astuces CSS
• Afficher, masquer les calques grace aux CSS - Sibelius
• Faire une mise en page grace aux css - Sibelius
• Faire une zone scrollable dynamique grâce aux CSS - Sibelius
• Savoir utiliser et positionner les calques (div) - Sibelius
• Une mise en page différente à l'écran et à l'impression - Piloue
• Le modèle hierarchique de la boite CSS - Antoine
• La transparence CSS - Antoine

Tutoriaux génériques et globaux sur le gestion de sites.

• Avant de publier son site sur le web - Piloue
• Bien référencer son site - Piloue
• Comment bien commencer son site ? - Piloue
• Création d'un AUTORUN pour vos projets cd-roms - Egraphiste
• Importer des données tabulées dans Dreamweaver - Qwix
• Comment faire du dynamique dans Dreamweaver MX
• Déclencher du streaming au format RealMedia (.rm) - Qwix
• Menu déroulant avec Fireworks & Dreamweaver - eGraphiste
• Afficher-Masquer les calques avec Dreamweaver - gTo
• Calque d'annonce de Chargement de la page en cours - gTo

Les différences entre le HTML et le XHTML, il faut partir du principe que le HTML est beaucoup plus tolérant que l’XHTML : il autorise le fait que des balises ne soient pas fermées, qu’elles soient mal imbriquées, etc., car il est basé sur le SGML et non pas l’XML, comme l’est l’XHTML.

• Le XHTML est sensible à la casse : tous les éléments doivent être écrits en minuscule. (<strong></strong> et non pas <STRONG></STRONG> )
• Tout les éléments doivent être correctement imbriqués. ( <p><span></span></p> et non pas <p><span></p></span> )
• Tout les éléments doivent être correctement fermés. ( <p></p><p></p> et non pas <p><p> ou <img src=” " alt=” " /> et non pas <img src=” " alt=” “> )
• Certains attributs sont différents. ( <img src=” " alt=” " /> et non pas <img src=” " name=” " /> )

L’utilisation conjointe d’une page XHTML et d’une feuille de style CSS permet de séparer le contenu (structure, textes, images, etc.) du contenant (présentation, couleurs, etc.). L’alliance XHTML et CSS évite donc d’imposer au lecteur une mise en page et améliore ainsi considérablement l’accessibilité des documents.

Les navigateurs texte comme Lynx ou bien ceux destinés aux handicapés, affichent donc beaucoup plus sémantiquement les sites valides aux normes du W3C. Un site de la sorte permet aussi une meilleur gestion du style de plusieurs pages (donc pas forcément besoin de PHP) et même de mettre en place un “style switcher” pour en changer rapidement selon les désirs du visiteur.