5568 sujets

Sémantique web et HTML

rebonjour,
Plus que 4 erreurs sur ma page lors de la validation W3C:

   1.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   2. <html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
   3. <head>
  ...
  37. </head>
 
  39. <body class="sidebars">
  40. <div id="page">
  41. <div id="header" class="clear-block">
[...]  

 643. </div> <!-- /page -->
 644. </body>
 645. </html>


et voilà les erreurs signalées :
1) : Line 644, Column 7: end tag for "div" omitted, but OMITTAG NO was specified
</body>

2) # Info Line 40: start tag was here
><div id="page">

3)Line 644, Column 7: XML Parsing Error: Opening and ending tag mismatch: div line 40 and body
</body>

4)Line 645, Column 7: XML Parsing Error: Opening and ending tag mismatch: body line 39 and html
</html>

5)Line 645, Column 7: XML Parsing Error: Premature end of data in tag html line 2
</html>

D'où vient l'erreur ?
à nouveau merci d'avance de votre aide.
Modifié par Misange (10 Jan 2010 - 22:07)
Cette cascade d'erreurs apparaît quand tu as un élément qui n'est pas fermé. Dans ton cas, tu as un élément div qui comporte bien la balise d'ouverture <div>, mais est dépourvue de la balise de fermeture </div>.

Pour trouver l'élément div en cause, il faut que tu parcoures le code source à partir de l'ouverture de l'élément div "page".
Argh...
mais pourquoi me signale-t-il que le start tag est ici ?
# Info Line 40: start tag was here
><div id="page">
Misange a écrit :
Argh...
mais pourquoi me signale-t-il que le start tag est ici ?
# Info Line 40: start tag was here
><div id="page">

L'élément div "page" contient un élément div qui n'est pas fermé.

Soit dit en passant, sans lien vers la page qui est en cause, il nous est difficile de t'aider efficacement. Smiley cligne
Modifié par Victor BRITO (10 Jan 2010 - 18:32)
Ouh ben s'il y a de bonnes volontés pour regarder Smiley rolleyes
c'est par exemple là :
http://www.excelabo.net

En découpant le code par morceaux, si j'ajoute un </div> à la fin des menus suckerfish, la page est valide mais l'affichage débloque complètement !
Tu as quelques commentaires marquant la fin de blocs, ce qui est très bien. Mais tu n'as pas poussé la logique assez loin, et du coup tu te retrouves avec ceci:
</div></div>
</div>
                            </div>
        <div style="clear:both"></div>
      </div><!-- /section2 -->

Là où tu devrais plutôt avoir qelque chose qui ressemble à ça:
</div><!--.machin-->
</div><!--.truc-->
</div><!--#chose-->
</div><!--#bidule-->
<div style="clear:both"></div>
</div><!--#section2-->
(Bon, la convention utilisée dans ces commentaires est libre. Pour ma part j'imite les sélecteurs CSS car ça me permet de distinguer les classes et identifiants.)

De plus, tu as léger un problème de divite. J'ai du mal à voir à quel endroit le design de ton cite nécessite autant d'imbrications de DIV. S'il y en avait moins à surveiller, ça serait plus simple. Smiley cligne

Pour finir, et pour repérer ce qui cloche, tu peux utiliser Firebug (ou Web Inspector ou équivalent). L'arborescende du DOM te donneras des indices sur quel élément n'est pas fermé.

En gros si tu pensais avoir une structure (schématique) comme ceci:
A
  A1
  A2
B
  B1
  B2

et que dans le DOM tu as:
A
  A1
  A2
  B
    B1
    B2

C'est que l'élément A n'est pas fermé.
merci de vos conseils et commentaires. J'utilise Firebug mais peut être pas assez à fond.
La vraie difficulté pour moi dans ce code c'est qu'une partie est faite maison (celle qui est commentée), l'autre vient des modules de mon CMS (Drupal). Vérifier chaque module, chaque bloc est très long, assez complexe et de plus, risque d'être complètement remis à 0 lors de la prochaine mise à jour ce qui n'incite guère à faire des efforts !
Je suis aussi très surprise de voir un code si mal indenté venant d'une communauté comme celle de Drupal. Que ce soit le cas sur un thème bricolé ça peut se comprendre mais certains modules sont très utilisés et ce n'est guère facile à suivre. Drupal est puissant. Mais pas sans défaut hélas. JE le savais en le choisissant et vu l'investissement que j'ai consenti en temps, je n'envisage pas aujourd'hui de revenir en arrière. MAis j'aimerais bien que mon code reste valide !
Je reviens vers vous si je n'y arrive pas. Probablement le WE prochain, la semaine sera trop chargée.
Merci du support en tous cas
Merci Mistik, je ne connaissais pas et c'est super pratique !

Le problème est RESOLU !
il manquait un </div> dans le pied de page.
Il ne me reste plusqu'à trouver pourquoi ma page qui ce matin s'affichait très bien dans IE6 met maintenant le menu de droite et le pied de page là où ils sont mais ça ne m'empechera pas de dormir vu que ça n'empechera pas ceux qui sont contraints d'utiliser IE6 de lire le site.
Merci de votre aide encore une fois
Misange a écrit :
Je suis aussi très surprise de voir un code si mal indenté venant d'une communauté comme celle de Drupal.

L'indentation du code est gérable avec des fichiers statiques. Dès que l'on génère du code HTML depuis plusieurs sources (ce que fait typiquement un site web complexe ou un CMS), il est presque impossible d'aboutir à une imbrication correcte. Ou alors il faut générer tout le code de la page dans une variable (ou autre forme de buffer) et réarranger le code avec Tidy avant de l'envoyer au navigateur, ce qui peut être complexe ou avoir un impact sur la réactivité du site.