Validation des documents HTML5 - SitePoint

Vérification HTML5: simplifiez le code et améliorez la qualité de la page Web

Points clés

• La vérification HTML5 se concentre davantage sur l'utilisation correcte des éléments, la précision des valeurs d'attribut et l'intégrité des attributs requis, plutôt que sur le style de code. Il s'agit toujours d'un outil précieux pour vous assurer que vos balises sont conformes aux spécifications HTML5.
• Il existe de nombreuses différences entre la validation XHTML et HTML5, y compris les éléments et attributs facultatifs, l'insensibilité aux cas et l'efficacité des éléments précédemment dépréciés. Il est recommandé de choisir un style et de maintenir la cohérence tout au long de votre projet HTML5.
• La vérification HTML5 est essentielle pour s'assurer que les pages Web sont correctement formatées et interprétées par le navigateur, améliorant ainsi les performances, réduisant les erreurs et améliorant l'accessibilité. Il existe une variété d'outils en ligne et hors ligne disponibles pour la vérification HTML5, et des outils de vérification plus stricts sont disponibles pour ceux qui souhaitent adhérer à des directives plus strictes.

(Les éléments suivants sont extraits du livre "HTML5 & CSS3 pour le monde réel, 2e édition" co-écrit par Alexis Goldstein, Louis Lazaris et Estelle Weyl. Le livre est disponible dans les magasins du monde entier, et Vous pouvez également le trouver ici. Dans le chapitre précédent, nous avons introduit certains changements de syntaxe dans HTML5 et abordé certains problèmes liés à la validation. Élargissons ces concepts plus en détail afin que vous puissiez mieux comprendre les changements dans la façon dont les pages sont validées.

Le validateur HTML5 ne se concentre plus sur le style de code. Vous pouvez utiliser des lettres majuscules ou minuscules, omettre des citations dans les attributs, exclure les balises fermées facultatives et vous pouvez être arbitrairement incohérent, votre page sera toujours valide.

Ensuite, vous pourriez demander ce qui est considéré comme une erreur de validatrice HTML5? Il vous rappellera une mauvaise utilisation des éléments, des éléments qui ne doivent pas être inclus, des attributs requis manquants, des valeurs d'attribut erronées, etc. En bref, le validateur vous fera savoir si vos balises entrent en conflit avec la spécification, c'est donc toujours un outil précieux lors du développement d'une page.

Pour vous donner une idée de la façon dont HTML5 diffère d'un XHTML trop strict, regardons quelques détails. De cette façon, vous pouvez comprendre ce qui est considéré comme valide dans HTML5:

Dans la syntaxe basée sur XHTML, certains éléments requis dans XHTML ne sont plus requis dans HTML5 pour permettre au document de passer HTML5; En effet, même si vous les excluez, le navigateur les inclura automatiquement dans le document.

• Les éléments vides (c'est-à-dire les éléments sans étiquettes fermées correspondantes ou sans rien) n'ont pas besoin d'être fermées avec des barres obliques fermées;
• Les éléments et les attributs peuvent être en majuscules, en minuscules ou en cas mixte.
• Aucun guillemet n'est requis autour de la valeur d'attribut. L'exception consiste à utiliser plusieurs valeurs séparées dans l'espace, ou l'URL apparaît comme une valeur et contient une chaîne de requête avec un caractère de signe égal (=).
• Dans la syntaxe basée sur XHTML, certaines propriétés requises dans XHTML ne sont plus nécessaires dans HTML5. Par exemple, l'attribut de type de l'élément de script et l'attribut xmlns de l'élément HTML.
• Certains éléments qui sont dépréciés dans XHTML et donc invalides sont désormais valides;
• Le texte droit qui n'apparaît dans aucun élément mais qui est placé directement dans l'élément corporel invalide le document XHTML; ce n'est pas le cas avec HTML5.
• Certains éléments qui doivent être fermés dans XHTML ne peuvent pas être fermés dans HTML5 sans provoquer des erreurs de validation;
• L'élément Form ne nécessite pas d'attribut d'action.
• L'élément de forme (par exemple l'entrée) peut être utilisé comme enfant direct de l'élément de forme;
• Les éléments de TextArea ne nécessitent pas de lignes et d'attributs COLS.
L'attribut cible de la liaison est précédemment déprécié dans XHTML. Il est maintenant valable dans HTML5.
Comme discuté précédemment dans ce chapitre, les éléments au niveau du bloc peuvent être placés dans l'élément de lien (a).
Si le & caractère (&) apparaît sous forme de texte sur la page, il n'a pas besoin d'être codé comme &.

Il s'agit d'une liste assez complète (mais pas exhaustive) des différences entre le schéma strict XHTML et la validation HTML5. Certains sont des choix de style, nous vous encourageons donc à choisir un style et à être cohérent. Nous avons décrit certains des choix de style préférés dans le chapitre précédent, et vous êtes invités à incorporer ces suggestions dans votre propre projet HTML5.

Remarque: outils de vérification plus stricts

Si vous souhaitez utiliser des directives plus strictes pour vérifier le style grammatical des balises, il existe des outils que vous pouvez utiliser pour vous aider. L'un des outils est l'inspecteur HTML de Philip Walton. Pour l'utiliser, vous pouvez inclure le script dans votre page pendant la phase de développement, puis ouvrir la console JavaScript du navigateur dans les outils du développeur et exécuter la commande htmLinSpector.inSpect (). Cela affichera directement de nombreux avertissements et suggestions dans la console, expliquant comment améliorer votre balisage. L'inspecteur HTML vous permet également de modifier les configurations pour personnaliser les outils en fonction de vos besoins.

Résumé

Jusqu'à présent, nous avons appris presque tous les nouveaux changements sémantiques et de syntaxe dans HTML5. Certaines de ces informations peuvent être difficiles à digérer au début, mais ne vous inquiétez pas! La meilleure façon de se familiariser avec HTML5 est de l'utiliser - commencez par votre prochain projet. Essayez d'utiliser certains des éléments structurels que nous avons introduits dans le chapitre précédent, ou une partie de la sémantique au niveau du texte que nous avons vu dans ce chapitre. Si vous ne savez pas à quoi sert un élément, revenez en arrière et lisez cette section, ou, mieux encore, lisez la spécification elle-même. Bien que la langue soit certainement plus ennuyeuse que le texte de ce livre (au moins nous l'espérons!), La spécification peut décrire plus en détail l'utilisation prévue d'un élément donné. N'oubliez pas que la spécification HTML5 est toujours en cours de développement, donc une partie du contenu que nous avons couvert peut encore se produire dans la nouvelle version HTML5.1 (ou dans la "norme dynamique" HTML5 si vous suivez la définition de Whatwg). La spécification contiendra toujours les dernières informations.

Dans le chapitre suivant, nous examinerons les nouvelles fonctionnalités clés introduites dans HTML5: Formes et fonctionnalités liées au formulaire.

HTML5 Vérification du document FAQ (FAQ)

Qu'est-ce que la vérification HTML5 et pourquoi est-ce important?

La vérification HTML5 est un processus de vérification du code de page Web en fonction des règles de syntaxe formelle de la spécification HTML5. Ceci est très important car il garantit que votre page Web est formatée correctement et peut être interprétée correctement par le navigateur. Cela conduira à de meilleures performances, à moins d'erreurs et à une amélioration de l'accessibilité pour les utilisateurs handicapés. De plus, il peut aider avec le référencement, car les moteurs de recherche préfèrent les sites bien structurés et sans erreur.

Comment vérifier mon document HTML5?

Vous pouvez utiliser des outils en ligne tels que les services de vérification de balises W3C pour vérifier vos documents HTML5. Entrez simplement votre URL de page Web ou téléchargez votre fichier HTML et l'outil le vérifiera par rapport à la norme HTML5 et signalera toutes les erreurs ou avertissements.

Quel est le document HTML5 le moins valide?

Le document HTML5 valide minimum est le document HTML5 le plus simple, qui est toujours conforme aux normes fixées par la spécification HTML5. Il comprend la déclaration de type de document, l'élément racine (HTML), l'élément de tête et l'élément corporel.

Quelles sont les erreurs de vérification HTML5 courantes?

Les erreurs de validation HTML5 courantes incluent des balises fermées manquantes, la nidification incorrecte des éléments, l'utilisation d'éléments ou d'attributs obsolètes et oubliant d'inclure des déclarations de type de document au début du document.

Comment corriger les erreurs de vérification HTML5?

Correction des erreurs de vérification HTML5 incluent la correction du code en fonction des messages d'erreur fournis par l'outil de vérification. Cela peut inclure l'ajout de balises manquantes, la suppression ou le remplacement des éléments obsolètes ou la correction de la nidification des éléments.

Quel est le rôle de la déclaration de type de document dans la vérification HTML5?

La déclaration de type de document est la première ligne d'un document HTML5, qui indique au navigateur dans quelle version de HTML est écrite. Il est crucial pour la vérification car il aide le navigateur et les outils de vérification à interpréter correctement le reste du code.

Puis-je vérifier la documentation HTML5 contenant CSS et JavaScript?

Oui, vous pouvez vérifier les documents HTML5 contenant CSS et JavaScript. Cependant, la vérification ne vérifie que le code HTML. Pour CSS et JavaScript, vous devez utiliser un outil de vérification distinct.

Quels sont les avantages de l'utilisation de validateurs HTML5?

L'utilisation du validateur HTML5 peut vous aider à attraper et à corriger les erreurs avant de causer des problèmes. Il peut améliorer les performances de votre site Web, l'accessibilité et le classement des moteurs de recherche. C'est également un excellent moyen d'en savoir plus sur le HTML et d'améliorer vos compétences de codage.

Puis-je vérifier les documents HTML5 hors ligne?

Oui, il existe des outils qui vous permettent de vérifier les documents HTML5 hors ligne. Ces outils incluent des applications logicielles et des outils de ligne de commande que vous pouvez installer sur votre ordinateur.

Quelle est la différence entre la vérification HTML5 et la vérification de la cohérence HTML5?

La validation HTML5 consiste à vérifier la syntaxe du code selon la spécification HTML5. La vérification de la cohérence, en revanche, consiste à s'assurer que vos pages Web suivent les meilleures pratiques en matière de conception et d'accessibilité Web, et la syntaxe correcte.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!