Utiliser des listes non ordonnées pour créer des formulaires?

Question

Ceci est en continuité avec ma question précédente qui était fermée cause de la similitude avec certaines questions SO précédentes. Bien que les réponses à toutes les questions connexes m'ont fait penser à ceci:

Devrions-nous utiliser des listes non ordonnées pour créer des formulaires? Et même si j'ai eu des commentaires mitigés.

Un blog particulier http://green-beast.com/blog/?p=259 a déclaré que l'utilisation de listes non ordonnées pour les formulaires est incorrecte. Ma question pour les développeurs est de commenter cette déclaration?

Answer 1

HTML offre aux auteurs plusieurs mécanismes pour spécifier des listes d'informations. Toutes les listes doivent contenir un ou plusieurs éléments de liste. Les listes peuvent contenir: des informations non ordonnées, ordonnées informations et définitions. (De http://www.w3.org/TR/html4/struct/lists.html#edef-UL)

Je pense que les listes sont les éléments les plus importants en HTML: sémantiquement, il y a tant d'objets qui sont des listes pures. Il est également recommandé d'utiliser ul ou dl pour grouper les zones de saisie et les étiquettes dans form également.

Quelqu'un balisage formulaire en utilisant les paragraphes:

<form action="" method="post"> 
    <fieldset> 
     <p> 
      <label> 
       Full Name: 
       <input type="text" name="name" /> 
      </label> 
     </p> 
     <p> 
      <label> 
       Password: 
       <input type="password" name="password" /> 
      </label> 
     </p> 
    </fieldset> 
    <fieldset> 
     <p> 
      <label> 
       Occupation: 
       <input type="text" name="occupation" /> 
      </label> 
     </p> 
     <p> 
      <label> 
       Location: 
       <input type="text" name="location" /> 
      </label> 
     </p> 
    </fieldset> 
    <p> 
     <input type="submit" value="Submit" /> 
    </p> 
</form> 

Et quelqu'un de balisage à l'aide de listes (et cela semble très organique à mon avis):

<form action="" method="post"> 
    <fieldset> 
     <dl> 
      <dt><label for="name">Full Name:</label></dt> 
      <dd><input id="name" type="text" name="name" /></dd> 
      <!-- <dd class="error">Some errors/validation warnings</dd> --> 

      <dt><label for="password">Password:</label></dt> 
      <dd><input id="password" type="password" name="password" /></dd> 
      <!-- <dd class="note">Some notes about the field above</dd> --> 
     </dl> 
    </fieldset> 
    <fieldset> 
     <dl> 
      <dt><label for="occupation">Occupation:</label></dt> 
      <dd><input id="occupation" type="text" name="occupation" /></dd> 

      <dt><label for="location">Location:</label></dt> 
      <dd><input id="location" type="text" name="location" /></dd> 
     </dl> 
    </fieldset> 
    <p> 
     <input type="submit" value="Submit" /> 
    </p> 
</form> 

Forms sont listes (listes des champs, des données groupées), parce qu'ils ont une structure uniforme et répétitive:

INPUT_1 
INPUT_2 
... 
INPUT_N 

Answer 2

Vous pouvez coller votre formulaire dans des paragraphes, des tableaux, des listes, des listes de définitions ou une série compliquée de découpes et de divs, mais à la fin les seules choses importantes sont le bon fonctionnement de votre formulaire et son utilisation.

Passez votre temps sur tabindex and usability plutôt que de vous soucier de la «manière sémantiquement correcte d'écrire du HTML» telle que définie par un groupe de travail W3C ou le blog de quelqu'un.