Corrigé : Programmation WWW

Première partie : HTML 4

    1. Pas de doctype au début du document
    2. Le corps du document doit être dans un élément <p>
    3. <center> est interdit en html4
    4. Un élément de liste doit apparaître dans une liste
    5. Une image doit obligatoirement avoir un attribut alt
    6. Les éléments de table doivent apparaitre dans un élément tr
    7. L'élément table doit être fermé
  2. <table width="100%" border="1" summary="tableau">
<tr>
<td colspan="2" height="100">titre</td>
</tr>
<tr>
<td width="20%">tdm</td>
<td>contenu</td>
</tr>
</table>

  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
               "http://www.w3.org/TR/html4/frameset.dtd">
<html>
  <head>
    <title>Exemple de site avec frames</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  </head>
  <frameset rows="100,*" border="0">
    <frame name="titre" src="siteftitre.html" frameborder="0" scrolling="no">
    <frameset cols="20%,*">
      <frame name="tdm" src="siteftdm.html" frameborder="0">
      <frame name="contenu" src="sitefcontenu.html" frameborder="0">
    </frameset>
      <noframes>
    <p>Cet ensemble de frames contient :
    <ul>
      <li><a href="siteftitre.html">Titre</a>
      <li><a href="siteftdm.html">Table des matières</a>
      <li><a href="sitefcontenu.html">Contenu</a>
    </ul>
      </noframes>
  </frameset>
</html>
  4. Un document respectant parfaitement la syntaxe s'affichera sans problème sur tous les navigateurs (y compris les navigateurs textuels ou les navigateurs futurs). On peut vérifier la syntaxe en utilisant par exemple le service Validator du W3C, ou le programme Tidy du W3C.

Deuxième partie : CSS

  1. Les feuilles de style permettent de gérer séparément l'aspect et le contenu des pages. Elles permettent égalent d'uniformiser et de changer plus facilement l'aspect d'un site.
    1. BODY { background-color: white; background-image: url(paper.gif); backgrount-repeat: repeat-xy; margin-left:2cm; font-family: Arial, Helvetica, sans-serif; font-size: 12pt;}
    2. OL LI { color: blue;}
    3. P.important {color: red;}
    4. LI LI { color: green;}

Troisième partie : Protocole, clients et serveur

    1. connection
    2. commande (GET), URI sur le serveur, version du protocole parlé par le client
    3. nom du client (Netscape)
    4. types MIME acceptés par le client
    5. langages acceptés, par ordre de préférence
    6. fin de requête
    7. version du protocole comprise par le serveur, code d'erreur (200=OK)
    8. date de la réponse
    9. type et version du serveur
    10. date de dernière modification du document
    11. taille du document en octets
    12. type MIME du document
    13. fin d'en-têtes de réponse
    14. début du document
  2. À ne demander un document que si il a été modifié depuis une certaine date (le plus souvent, la dernière fois qu'on l'a récupéré).
  3. Un proxy-cache permet de stocker localement les documents les plus demandés pour éviter l'encombrement du réseau vers l'extérieur.

Quatrième partie : formulaires et CGI

On peut stocker la table des matières et chaque message dans des fichiers HTML (comme pour le livre d'or). On devra gérer un compteur de messages, pour donner un nom dirrérent à chaque fichier de message. Le script permettant de poster un message devra :

  1. incrémenter ce compteur,
  2. en stocker la nouvelle valeur dans un fichier de compteur,
  3. stocker le message posté dans un fichier html,
  4. ajouter le titre du message à la table des matières, avec un lien vers le fichier html du message.

D'autre part, comme le formulaire devra être placé en bas de la table de matières, il est plus simple de la générer avec un script CGI séparé, qui affiche la TDM suivie du formulaire.

Frederic Devernay