web:html:debug

Coder en HTML

Le rendu HTML d'une page n'est pas sensible à la mise en forme du code source HTML écrit :

  • Espace
  • Tabulations
  • Sauts de lignes

Ne sont pas interprétés par le navigateur.

Ils permettent par contre de rendre plus lisible un code source :

<h1>Liste exemple</h1><ul><li>Item1</li><li>Item 2</li></ul>

<h1>Liste exemple</h1>
<ul>
    <li>Item1</li>
    <li>Item 2</li>
</ul>

Votre IDE (Webstorm ou un autre) doit vous permettre de formater votre code automatiquement, et peut être configuré pour le faire sur enregistrement.

Pour afficher le code source de la page produit côté client : CTRL + U

Il est également possible de visualiser la structure du DOM créée par le navigateur, à partir du HTML interprété :

Pour inspecter les éléments : CTRL + MAJ +U

L'affichage du réseau peut également donner des indications sur un disfonctionnement (fichier CSS non chargé par exemple) :

Activer l'onglet Network ou Réseau après avoir choisi Inspecter :

Le validateur W3C peut également donner des indications sur une mauvaise interprétation du code :

  • web/html/debug.txt
  • Dernière modification : il y a 21 mois
  • de jcheron