Les Formulaires

Un formulaire est une ensemble de champs (champ de texte court, champ de texte long, case à cocher, bouton radio, menu déroulant,etc.) permettant de récolter des informations de la part de l'utilisateur du document. Ce dernier soumettra le forulaire généralement grâce à un bouton ) que le navigateur enverra à un navigateur ou agent qui délivrera selon les informations reçues un deuxième document HTML pour reporter du succès de l'envoi du formulaire.
Ces agents sont développés dans un langage de programmation tels que PHP (Personal Home Page ou PHP Hypertext Preprocesor ), par le webdeveloppeur.

Le formulaire que nous allons faire sur cette page n'est pas fonctionnel puisqu'il necessite l'intervention d'un webdéveloppeur.

Les éléments de formulaires

L'ensemble d'un formulaire est sémantisé par l'élément de type bloc form. Cet élément nécessite deux attributs :

L'attribut action: Cet attribut permet de spécifier l'adresse du robot auquel le navigateur devra envoyer les données du formulaire remplies par l'utilisateur.
L'attribut method: Cet attribut permet de spécifier la méthode d'envoi que le navigateur devra utiliser. Il en existe deux, la methode GET qui loge les données dans la requète, transformant celle-ci d'une URL en URI, et la méthode POST qui permet d'envoyer les données en parallèle de la requête, c'est à dire que les données ne font pas partie de l'URL. A notre niveau, il est seulement important de se souvenir qu'il faut toujours utiliser POST lorsque les données sont longues ou bien à caractère personnel. GET est utilisé pour des données courtes et informelles, de navigation par exemple.

Chaque champ du formulaire s'accompagne d'un libellé permettant de spécifier l'information requise par le champ (dans le cas d'un champ de texte) ou de préciser l'information liée à la sélection du champ (dans le cas des cases à cocher ou des boutons radios).

Ainsi chaque champ doit être couplé à un élément label (libellé). Ce champ requiert un attribut permettant de lier sémantiquement le libellé au champ : for. La valeur de l'attribut est une chaine de caractères choisie arbitrairement qui ne doit cependant pas commencer par un numéro, ni posseder de caractères spéciaux ou de blancs. Il sera nécessaire d'attribuer l'attribut id à chaque champ et qui aura la même chaine de caractères utilisés par l'attribut for du libellé auquel il est lié.

Les éléments de champ

L'élément input

L'élément permet de sémantiser un champ de plusieurs types. Il ne possède pas de balise de fermeture et devra obligatoirement posséder deux attributs :

L'attribut type

Cet attribut précise la nature ou le type du champs. Il aura pour valeur :

text: permettant d'entrer un texte sur une ligne
radio: permettant de cocher un bouton radio (généralement ces boutons sont au nombre de deux au minimum, pour un seul choix possible, ils possèdent alors la même valeur d'attribut name)
checkbox: permettant de cocher une case.
file: permettant de proposer un système de navigation local pour insérer un fichier.

L'attribut name

Chaque donnée insérée par l'utilisateur va etre envoyée par un robot. Il est utile de s'imaginer chaque donnée dans une boite que le robot sera amené à utiliser et à manipuler.S'il est impossible de savoir à l'avance le contenu de ces boites, qui peuvent par ailleurs être vides si l'utilisateur n'a pas rempli tous les champs, le robot doit, quand à lui, associer les boites aux informations demandées par le formulaire, et donc attendues par le robot. Chaque boite devra alors posséder un nom. Par exemple, si un formulaire demande le nom du visiteur, un champ de type text permettra de créer une boite qui pour la différencier des autres boites devra posseder un nom unique.C'est le système de variables dans les langages de programmation.
Ici aussi la valeur de l'attribut name est arbitraire mais ne devra pas commencer par un numéro, ni posséder de caractères spéciaux ni de blancs. Tous les noms des champs devront être communiqués aux webdeveloppeur pour la programmation de son robot.

Note sur les boutons

Un bouton ne permet pas d'entrer une donnée alpha numérique, c'est à dire que lorsqu'un bouton sera coché, la valeur stockée das la boite ne correspondra pas à du texte. Aussi il peut être facile d'imposer une valeur sous forme de texte. Pour cela, précisez cette valeur grâce à l'attribut value.

Il est possible de cocher un bouton par défut en lui ajoutant l'attribut checked ayant pour seule valeur possible checked. Si cela n'est pas nécessaire sur les cases à cocher, au moins un bouton radio dans un ensemble de boutons radio doit être coché par défaut coché .

L'élément select

Cet élément permet de proposer une liste d'options sous forme d'un menu déroulant. Comme la syntaxe d'une liste, l'élément select englobera autant d'éléments option que nécessaire. Les attributs id et name seront attribués à select.

Note : L'attribut selected ayant pour seul valeur possible selected permet de spécifier une valeur par défaut pour une seule option en particulier.

l'élément textarea

Sans doute le plus simple, permet de proposer un champ de texte sur plusieurs lignes. Deux attributs sont nécessaires :

L'attribut cols: spécifie un nombre de colonnes à votre champ, généralement une colonne correspond à un caractère
L'attribut rows: spécifie une nombre de lignes

Note : ne laissez RIEN entre les deux balises de l'élément, même pas un blanc.

Les boutons d'envoi

L'élément button permet de créer un bouton. Ses balises encadrent le mot ou groupe de mots écrits sur le bouton. L'attribut nécessaire type spécifie la fonction du bouton selon la valeur :

reset: permet d'effacer le contenu du formulaire pour le réinitialiser tel qu'il était avant que l'utilisateur l'ait rempli.
submit: permet de soumettre le formulaire, c'est à dire de l'envoyer au robot.

La structure d'un formulaire

En terme d'accessibilité, il sera conseillé d'organiser votre champ par de sous ensemble de champs. Il en faut au moins un et généralement il est conseilllé d'en utiliser un pour les questions, et un autre pour les boutons.
L'élément fieldset permet de délimiter ou de créer ces sous ensembles. le premier élément de chaque fieldset devra être l'élément legend qui sémantise un mot ou groupe de mot résumant la fonction ou le contenu du sous ensemble ainsi crée.

...and Voodoo Muzak is playing for you !