La validation du W3C n’est parfois pas très aisée, mais elle vous permet de voir les erreurs générées par votre balisage. De nombreuses erreurs et avertissements émis par le validateur sont un bon indicateur du fait que votre XHTML n'est pas en très bon état et qu'il peut ne pas sembler cohérent d'un navigateur à l'autre. Voici 10 problèmes de validation insidieux qui agitent les développeurs et comment les éviter..
Avant de commencer, voici quelques bonnes pratiques à retenir lors de l'utilisation du validateur W3C.
Avec ces astuces de base, voyons quelques-unes des raisons pour lesquelles votre balisage ne valide pas..
Une des raisons les plus courantes pour lesquelles les mises en page ne sont pas validées. Il n'est jamais étonnant de constater combien de fois c'est le coupable d'une mise en page géniale. Les balises div non fermées sont l’une des erreurs de mise en page les plus courantes et des plus difficiles à diagnostiquer. Le validateur ne pointe pas toujours la balise div non fermée, il n'est donc pas toujours facile de trouver l'aiguille dans la botte de foin.
Au début des années 90, des navigateurs tels que Microsoft et Netscape ont commencé à reconnaître des déclarations de police uniques qui n’avaient jamais été normalisées. Malheureusement, cela signifie que le validateur W3C ne reconnaît toujours pas certaines balises HTML importantes telles que "incorporer", même si elles sont largement utilisées à ce jour. Si vous cherchez vraiment à obtenir cette validation DOCTYPE stricte, vous devrez abandonner l'intégration..
Si vous voulez vraiment avoir un balisage valide et support intégré, essayez d’utiliser la méthode Flash Satay.
Une erreur fréquente est soit de ne pas déclarer un DOCTYPE, soit de déclarer le mauvais DOCTYPE en haut du document. En règle générale, Strict DOCTYPE est la validation la plus haute pour laquelle tirer. Une validation stricte signifie que vos pages Web ont la meilleure idée pour s'afficher correctement dans tous les navigateurs. Voici à quoi ressemble une déclaration stricte:
Si votre site ne valide pas correctement, il y a de bonnes chances que la raison soit une barre oblique manquante quelque part dans votre code. Il est très facile d'oublier quelque chose comme une barre oblique finale, en particulier dans des éléments tels que les balises d'image. Par exemple:
Cela ne validera pas contre un DOCTYPE strict. Ajoutez un '/' avant la fin de la balise img pour résoudre le problème.
Vous utiliserez la balise "align" si votre DOCTYPE est défini sur Transitional, mais si vous prenez la route la plus haute et choisissez une validation Strict, vous verrez des erreurs. Align est une autre balise dépréciée qui ne devrait plus être utilisée dans le balisage. Au lieu d’aligner, essayez d’utiliser flotte ou aligner le texte déplacer l'élément.
Si vous avez déclaré un DOCTYPE strict, vous devez envelopper les balises CDATA dans votre code JavaScript. Cet aspect de la validation a déconcerté de nombreux développeurs, car les sites ont tendance à utiliser le JavaScript en ligne pour des tâches telles que les annonces et les scripts de suivi. Si vous devez inclure JavaScript, ajoutez simplement ces balises avant et après:
Si vous ne l'avez pas encore remarqué, les images sont un obstacle majeur à une bonne validation. En plus des barres obliques, ils nécessitent également des balises alt décrivant les images, c.-à-d. Alt = "image de vampire effrayant".
Les moteurs de recherche s'appuient également sur cette balise alt pour identifier les images sur la page. Il est donc conseillé d'ajouter les balises alt quand même..
Les entités sont un autre petit piège qui a tendance à faire obstacle à la validation. Au lieu d'utiliser des symboles tels que "&", il est judicieux d'utiliser des caractères correctement codés. Voici une liste complète des entités de caractères correctement codées à utiliser dans le balisage XHTML.
La nidification est quand vous avez des éléments à l'intérieur des éléments, comme ceci:
Sucré!
Il est assez facile de se mélanger, et mélanger est l'ordre des éléments imbriqués. Par exemple, démarrez la balise forte avant la balise div, mais fermez-la en premier. Cela ne modifiera peut-être pas l'apparence de la mise en page, mais cela empêchera certainement votre balisage de valider.
Bien que cela puisse sembler un problème évident, de nombreux développeurs (y compris moi-même), laissent de temps en temps une balise 'title' dans la section 'head'. Si vous voyez l'erreur "manque un sous-élément requis de HEAD", alors vous savez qu'il vous manque une balise de titre.
Si vous avez trouvé cet article utile, votez pour lui sur Digg.