147
Mise en forme des formulaires et des tableaux de données
Figure 7.4
Mise en forme simple
de formulaire.
Éléments de formulaire utiles
Le.HTML.propose.un.certain.nombre.d’éléments.utiles.qui.aident.à.structurer.les.formulaires.et.leur.confèrent.un.sens..Le.premier.est.l’élément.fieldset.(ensemble.de.champs)..
Il est.utilisé.pour.regrouper.des.blocs.liés.d’informations..À la.Figure 7.4,.deux.ensembles.
de. champs. sont. utilisés :. l’un. pour. les. informations. de. contact. et. l’autre. pour. les. commentaires..La.plupart.des.agents.utilisateurs.les.encadrent.d’une.fine.bordure,.qui.peut.être.
désactivée.si.on.attribue.la.valeur.none.à.la.propriété.border..
Un.élément.legend.peut.être.utilisé.pour.identifier.le.rôle.de.chaque.ensemble.de.champs..
Les.légendes.agissent.à.la.manière.d’un.titre..Elles.sont.généralement.centrées.en.haut.de.
l’ensemble.et.légèrement.en.retrait.vers.la.droite..Malheureusement,.elles.sont.particulièrement.difficiles.à.mettre.en.forme.à.cause.du.manque.de.cohésion.entre.les.navigateurs.pour.
ce.qui.concerne.leur.positionnement..Certains.navigateurs,.comme.Firefox.et.Safari,.utilisent.un.remplissage.pour.créer.un.léger.retrait..D’autres,.comme.Opera.et.Internet.Explorer,.
ont.de.grands.retraits.par.défaut.qui.ne.peuvent.se.contrôler.à.l’aide.du.remplissage,.des.
marges.ou.même.du.positionnement..Si.vous.utilisez.des.légendes,.vous.devrez.donc.accepter.
certaines.variations.entre.navigateurs.
Étiquettes de formulaire
L’élément.label.est.extrêmement.important.parce.qu’il.contribue.à.structurer.les.formulaires.et.à.améliorer.leur.utilisabilité.et.leur.accessibilité..Il.permet.d’ajouter.une.étiquette.
descriptive. à. chaque. élément. de. formulaire. et,. dans. de. nombreux. navigateurs,. d’activer.
l’élément.de.formulaire.associé.quand.on.clique.dessus..Le.véritable.intérêt.des.étiquettes.
tient.à.ce.qu’elles.rendent.les.formulaires.plus.accessibles.pour.les.utilisateurs.équipés.de.
périphériques.d’assistance..Quand.un.formulaire.les.utilise,.les.lecteurs.d’écran.associent.
correctement. chaque. élément. de. formulaire. à. son. étiquette.. Sans. cela,. ces. périphériques.
Mise en forme des formulaires et des tableaux de données
Figure 7.4
Mise en forme simple
de formulaire.
Éléments de formulaire utiles
Le.HTML.propose.un.certain.nombre.d’éléments.utiles.qui.aident.à.structurer.les.formulaires.et.leur.confèrent.un.sens..Le.premier.est.l’élément.fieldset.(ensemble.de.champs)..
Il est.utilisé.pour.regrouper.des.blocs.liés.d’informations..À la.Figure 7.4,.deux.ensembles.
de. champs. sont. utilisés :. l’un. pour. les. informations. de. contact. et. l’autre. pour. les. commentaires..La.plupart.des.agents.utilisateurs.les.encadrent.d’une.fine.bordure,.qui.peut.être.
désactivée.si.on.attribue.la.valeur.none.à.la.propriété.border..
Un.élément.legend.peut.être.utilisé.pour.identifier.le.rôle.de.chaque.ensemble.de.champs..
Les.légendes.agissent.à.la.manière.d’un.titre..Elles.sont.généralement.centrées.en.haut.de.
l’ensemble.et.légèrement.en.retrait.vers.la.droite..Malheureusement,.elles.sont.particulièrement.difficiles.à.mettre.en.forme.à.cause.du.manque.de.cohésion.entre.les.navigateurs.pour.
ce.qui.concerne.leur.positionnement..Certains.navigateurs,.comme.Firefox.et.Safari,.utilisent.un.remplissage.pour.créer.un.léger.retrait..D’autres,.comme.Opera.et.Internet.Explorer,.
ont.de.grands.retraits.par.défaut.qui.ne.peuvent.se.contrôler.à.l’aide.du.remplissage,.des.
marges.ou.même.du.positionnement..Si.vous.utilisez.des.légendes,.vous.devrez.donc.accepter.
certaines.variations.entre.navigateurs.
Étiquettes de formulaire
L’élément.label.est.extrêmement.important.parce.qu’il.contribue.à.structurer.les.formulaires.et.à.améliorer.leur.utilisabilité.et.leur.accessibilité..Il.permet.d’ajouter.une.étiquette.
descriptive. à. chaque. élément. de. formulaire. et,. dans. de. nombreux. navigateurs,. d’activer.
l’élément.de.formulaire.associé.quand.on.clique.dessus..Le.véritable.intérêt.des.étiquettes.
tient.à.ce.qu’elles.rendent.les.formulaires.plus.accessibles.pour.les.utilisateurs.équipés.de.
périphériques.d’assistance..Quand.un.formulaire.les.utilise,.les.lecteurs.d’écran.associent.
correctement. chaque. élément. de. formulaire. à. son. étiquette.. Sans. cela,. ces. périphériques.