Au bon vieux temps, lorsque les normes HTML étaient une cible mouvante, peu importait que vous terminiez correctement la balise <p> ou que vous gardiez vos règles de formatage séparées de votre code de style. Balises incompatibles, attributs manquants, éléments mal imbriqués - le manque de normes largement adoptées entraîne ces erreurs et d'autres, mais comme la plupart des navigateurs ont une intelligence intégrée pour éviter ces erreurs, la plupart des développeurs ne seront pas du tout conscients de leur existence. .
Bien que le navigateur lui-même essaie de corriger ces erreurs, cela ne signifie pas que vous pouvez ignorer ces problèmes. Pour que vos pages Web se comportent de manière cohérente dans tous les navigateurs, votre HTML doit être totalement cohérent avec les règles et la syntaxe définies dans la norme W3C. Il existe de nombreux outils pour répondre à cette exigence, à la fois en ligne et hors ligne. eux : le très cool HTML Tidy.
HTML Tidy est un outil de vérification HTML gratuit. Il est conçu pour vérifier votre code HTML et signaler les endroits où il n'est pas entièrement conforme aux normes publiées par le W3C. Il peut être utilisé pour analyser un fichier HTML ou une chaîne contenant des instructions HTML. peut automatiquement apporter les modifications nécessaires pour mettre le code en conformité avec les normes en vigueur.
Installer
HTML Tidy est gratuit et peut fonctionner sur les plateformes Windows, Macintosh et *NIX. Des versions binaires sont disponibles pour une utilisation immédiate. Si vous utilisez une plateforme *NIX, vous préférerez peut-être la compiler et l'installer vous-même à partir du code source. faire : extrayez les fichiers sources dans votre dossier temporaire et effectuez un processus de compilation-installation de base, comme ceci :
shell> cd /tmp/tidy/build/gmake
coquille> faire
shell> faire installer
Une fois ce processus terminé, vous devriez pouvoir trouver une version binaire compilée de Tidy dans le dossier /tmp/tidy/bin/tidy. Copiez ce fichier dans votre dossier système /usr/local/bin / afin qu'il soit plus facile d'y accéder. . Vous êtes maintenant prêt à utiliser cet outil.
Utilisation de base
Une fois la version binaire installée, vous pouvez immédiatement commencer à l'utiliser pour vérifier le code HTML. Le listing A montre un exemple simple :
Liste A :
shell> ranger -e -q index.html
ligne 1 colonne 1 - Attention : déclaration <!DOCTYPE> manquante
ligne 2 colonne 1 - Attention : insertion d'un élément 'title' manquant
ligne 4 colonne 1 - Avertissement : attribut propriétaire <body> leftmargin
ligne 6 colonne 1 - Avertissement : hauteur de l'attribut propriétaire <table>
ligne 6 colonne 1 - Avertissement : <table> manque d'attribut de résumé
ligne 11 colonne 37 - Attention : <img> manque d'attribut alt
ligne 15 colonne 1 - Avertissement : <table> manque d'attribut de résumé
ligne 17 colonne 50 - Attention : <img> manque d'attribut alt
Dans cet exemple, Tidy a trouvé huit erreurs potentielles dans le fichier et a imprimé un avertissement pour chaque erreur. Notez que ces erreurs ne sont pas des erreurs graves, mais simplement un avertissement indiquant que certaines parties du code ne sont pas très correctes.
Vous pouvez corriger automatiquement le fichier d'origine en ajoutant l'option -m (modificateur) à la ligne de commande :
shell> bien rangé -m -q index.html
Si vous devez tester un grand site Web, vous pouvez utiliser des caractères génériques sur la ligne de commande pour tester tous les fichiers d'un dossier (au lieu d'un seul) :
shell> bien rangé -m -q *.html
Si vous souhaitez que Tidy aide à écrire la page Web révisée dans un nouveau fichier (plutôt que d'écraser celui d'origine), utilisez l'option -output avec un nouveau nom de fichier, comme dans l'exemple suivant :
shell> bien rangé -output index.html.new -q index.html
Vous pouvez afficher toutes les erreurs dans un fichier journal séparé pour une révision ultérieure via l'option -e ("erreur") :
shell> Tidy -f error.log index.html
Notez également que si votre code HTML contient du code PHP, ASP ou JSP intégré, Tidy les ignorera simplement et les laissera en place, ce qui signifie que vous pouvez même exécuter l'outil Tidy sur un script côté serveur, pour vérifier la partie code HTML, ceci est un exemple :
shell> Tidy -e -q processeur.php
Vous pouvez également exécuter l'outil Tidy de manière interactive, en appelant le fichier programme sans ajouter de paramètres. Dans cet exemple, Tidy attend l'entrée de la console et vérifie les erreurs. Le listing B en montre un exemple :
Liste B
coquille> bien rangé
<html>
ligne 1 colonne 1 - Attention : déclaration <!DOCTYPE> manquante
<tête>
<titre>Ceci est un test
</tête>
ligne 3 colonne 1 - Attention : manquant </title> avant </head>
<corps marge gauche=0>
<p>
C'est un paragraphe mal terminé
</corps>
</html>
ligne 5 colonne 1 - Avertissement : attribut propriétaire <body> leftmargin
Info : le contenu du document ressemble à du HTML propriétaire
3 avertissements, 0 erreur trouvée !
Notez qu'en plus de vous donner des avertissements d'erreur en temps réel, Tidy peut également imprimer la version correcte du code à la fin de la saisie :
<html>
<tête>
<meta name=contenu du générateur=
HTML Tidy pour Linux/x86 (vers le 1er septembre 2005), voir www.w3.org>
<title>Ceci est un test</title>
</tête>
<corps marge gauche=0>
<p>Ceci est un paragraphe mal terminé</p>
</corps>
</html>
Applications avancées
Vous pouvez également contrôler la façon dont Tidy modifie un fichier. Cela peut être réalisé en passant des paramètres spécifiques sur la ligne de commande. Par exemple, pour que Tidy ré-indente correctement le code, vous pouvez ajouter l'option -i ("indent") :
shell> Tidy -output new.html -i index.html
Pour remplacer <font> et d'autres éléments de formatage liés aux règles de style CSS, vous pouvez utiliser l'option -c ("clear") :
shell> Tidy -output new.html -c index.html
Par défaut, Tidy utilise des lettres minuscules pour toutes les balises et attributs des fichiers HTML. Si vous souhaitez utiliser des lettres majuscules, vous pouvez ajouter l'option -u (« lettres majuscules »), comme indiqué dans l'exemple suivant :
shell> Tidy -output new.html -c -u index.html
Pour envelopper le texte avec une largeur de ligne spécifique, vous pouvez ajouter l'option -w ("retour à la ligne") avec la largeur de ligne spécifiée, comme indiqué dans l'exemple suivant :
shell> Tidy -output new.html -w 40 index.html
Vous pouvez convertir un document HTML en un document XHTML bien formé en ajoutant l'option -asxhtml :
shell> Tidy -output new.html -asxhtml index.html
L'opération inverse est possible via l'option -ashtml :
shell> Tidy -output new.html -ashtml index.html
Si vous devez apporter des ajustements importants aux options par défaut de Tidy, il est préférable de placer ces options dans un fichier de configuration distinct que vous pouvez référencer à chaque fois que vous appelez le programme. Le listing C montre un exemple de fichier de configuration :
Liste C :
nu : oui # supprimer le HTML propriétaire
doctype : auto # définit le doctype
drop-empty-paras : yes # supprime automatiquement les balises <p> vides
fix-backslash : oui # remplacer par / dans les URL
attributs littéraux : oui # conserve les espaces dans les valeurs d'attribut
littéraux inférieurs : oui # convertir les valeurs d'attribut en minuscules
output-xhtml : yes # produit une sortie XHTML valide
guillemet-esperluette : oui # remplacer & par &
guillemets : oui # remplacer par
attributs répétés : keep-last # utilise le dernier des attributs dupliqués
retrait : oui # indente automatiquement le code
indent-spaces : 2 # nombre d'espaces par lesquels mettre en retrait
wrap-php : pas de # retour à la ligne du texte contenu dans les balises PHP
char-encoding : ascii # encodage de caractères à utiliser
Tidy-mark : non # omettre les méta-informations Tidy dans le code corrigé
Lors de l'organisation d'un fichier, vous pouvez demander à Tidy d'utiliser ces paramètres en ajoutant l'option -config à la ligne de commande :
shell> Tidy -output a.html -configconfig.tidy index.html
Vous pouvez obtenir une liste d'options de configuration avec l'option -help-config :
shell> Tidy -help-config...quote-esperluette Booléen o/n,
oui/non, t/f, vrai/faux, 1/0guillemets Booléen o/n,
oui/non, t/f, vrai/faux, 1/0quote-nbsp Booléen y/n,
oui/non, t/f, vrai/faux, 1/0numéro d'attributs répétés garder en premier,
keep-lastreplace-color Booléen o/n, oui/non,
t/f, vrai/faux, 1/0show-body-only booléen o/n,
oui/non, t/f, vrai/faux, 1/0...
Ou utilisez l'option -show-config pour afficher un instantané des paramètres de configuration actuels :
shell> Tidy -show-config...show-body-only
Erreurs booléennes noshow Entier
6show-warnings Booléen yesslide-style
Stringsplit Booléen non...
Enfin, vous pouvez utiliser l'option -h pour obtenir de l'aide depuis la ligne de commande :
shell> bien rangé -h
C'est tout pour le moment. J'espère que vous trouverez dans Tidy un outil extrêmement précieux pour aider votre site à devenir pleinement conforme aux normes de publication du W3C. Les points de ce guide vous donneront une idée de la manière de contrôler l'outil HTML Tidy. votre code et vous aider également à utiliser cet outil plus efficacement.