HTML 4 avec XHTML et CSS (chap.01-05)
13 novembre 2008
Bien. Nous sommes le jeudi 13 novembre, il est 8h30 et j’ai un peu de temps devant moi. Quelques jours, pour commencer. Il s’agit d’avancer en repartant sur des bases solides. Donc de les cimenter sans plus et plus attendre. Je m’y attelle. Ce bloc-notes voudra peut-être m’accompagner ?
Première étape :
Elizabeth Castro
HTML 4 avec XHTML et CSS
Trad. Bernard Jolivalt
Ed. CampusPress, coll. Le Programmeur, 2006
Soit ici, un certain nombre de points relevés en chemin contre l’oubli ou les mauvaises habitudes.
Chapitre 1 / Les blocs de construction d’une page web
Fermer la balise des éléments vides de contenu textuel.
Ex : <img src=”image.jpg” /> ou <br />
Utiliser comme valeur des attributs sans valeur le nom de ces attributs.
Ex : <hr noshade=”noshade” />
Préférer les valeurs de longueur relatives :
- 2em = le double de la taille de la police de l’élément ou de l’élément parent ;
- 50% = la moitié de la taille de la police de l’élément ou de l’élément parent ;
- line-height: 1,5 : l’interligne sera d’une fois et demie la taille de la police ;
- px : unité liée à la résolution de l’écran ;
- pt, mm, cm : unités absolues.
Préférer les URL relatives aux URL absolues :
- <a href=”fichier.html”>lien</a> si le fichier à appeler se trouve au même niveau que le fichier où est placé le lien ;
- <a href=”dossier/fichier.html”>lien</a> si le fichier à appeler se trouve dans un dossier enfant du dossier parent du fichier où est placé le lien ;
- <a href=”../dossier/fichier.html”>lien</a> si le fichier à appeler se trouve dans un dossier de niveau supérieur ;
- <a href=”../../dossier/fichier.html”>lien</a> si le fichier à appeler se trouve dans un dossier de niveau encore supérieur ;
- Dans les feuilles de style : background: url(“fond.jpg”);
Abréviations :
CSS : Cascading Style Sheet
FTP : File Transfert Protocol
HTTP : HyperText Transfert Protocol
URL : Uniform Ressource Locator
XHTML : Extensible HyperText Markup Language
Chapitre 2 / Les fichiers de pages web
Nommer “index” la page d’accueil par défaut (généralement, ou “default” sur un serveur Microsoft).
Placer une page par défaut dans chaque dossier dont on ne souhaite pas afficher la liste des éléments.
Chapitre 3 / La structure (X)HTML de base
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//FR” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”fr”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Site – Titre</title>
</head>
<body>
<div id=”article”>
<h1>Titre de niveau 1</h1>
<div id=”introduction”>
<p id=”chapeau”>Paragraphe 1</p>
<p class=”important”>Paragraphe 2</p>
</div>
<div id=”developpement”>
<!– ci-dessous le corps de l’article –>
<h2>Titre de niveau 2</h2>
<h3>Titre de niveau 3</h3>
<p>Texte <span class=”imptxt”>texte important</span> texte.</p>
<p>Ligne 1<br />
Ligne 2</p>
(…)
</div>
</div>
</body>
</html>
http://www.site.org/fichier.html#developpement pointe vers <div id=”developpement”>
Chapitre 4 / La mise en forme de base du (X)HTML
Gras :<b>Texte en gras</b> ou <strong>Texte en gras</strong>
Italique : <i>Texte en italique</i> ou <em>Texte en italique</em>
Barré : <del>Texte barré</del>
Lignes de code : <code>Code</code>
Citation : <blockquote>Citation</blockquote>
Chapitre 5 / Créer des images pour le web
Pour afficher progressivement une image de grande taille, choisir GIF entrelacé ou JPEG progressif.
(To be continued…)