5568 sujets

Sémantique web et HTML

Bonsoir,
je suis nouveau sur ce forum et un peu perdu. Je pense avoir posté dans la bonne rubrique. Voici mon problème:
faisant la refonte de tout un site créé avec des tableaux, je suis un peu perdu suite à l'utilisation d'un formulaire. Le validateur m'indique une erreur:

<form action="" method="get">
      <p> 
        <label for="mail"> 
        <input type="text" id="mail" value="Entrez votre mail" onFocus="if (this.value=='Entrez votre mail') {this.value=''}" size="15" />
        </label>
      </p>
      <p> 
        <input type="submit" value="Envoi" />
      </p>
    </form>

Je pense que le probleme se trouve au niveau du Focus.

Merci
Modifié par oualad (05 May 2006 - 13:14)
Salut,

sans le texte d'erreur, difficile de répondre à coup sûr.

Mais il y a bien une erreur au niveau du onFocus.

En xHTML (que tu sembles utiliser vu les "/>" à la fin de tes input, mais sans le doctype et l'erreur encore une fois...), les attributs doivent être indiqués en minuscule
Donc :
onFocus -> onfocus

Par ailleurs, il est conseillé d'extraire le code JavaScript du code HTML comme c'est fait avec les CSS Smiley cligne

Sinon, mieux vaut utiliser <div> que <p> pour encadrer les champs.
Il manque l'attribut name à ton champs "mail"

Enfin, ton label est mal employé.

Tu utilises un label englobant le champs input, il n'y a pas besoin d'attribut for donc. Mais tu utilises l'attribut value avec une valeur qui devrait en fait être la valeur de ton label.

(j'ai un vieux doute pour l'attribut size, mais il ne me semble pas qu'il soit permis, mais je ne suis pas sûr)

Ton code "corrigé" :

<form action="" method="get">
<div><label for="mail">Entrez votre mail"</label> <input type="text" name="mail" id="mail" /></div>
<div><input type="submit" value="Envoi" /></div>
</form>


++
Modifié par Olivier (01 May 2006 - 00:02)
Merci de ton aide. A vrai dire, ça fait quelques temps que j'essaie de comprendre les formumaires en CSS.
En ce qui concerne le "for", j'ai lu qu'il était préférable de le laisser afin d'éviter toute confusion avec certains navigateurs.

Néanmoins, je vais relire le tout et vais essayer ce que tu me proposes.

Voici l'erreur du validateur:
a écrit :

Line 23 column 71: there is no attribute "onFocus".

...l" value="Entrez votre mail" onFocus="if (this.value=='Entrez votre mail') {t

You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).

This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information.

How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute.


Je vais toujours commencer par mettre en minuscule, même si je doute Smiley confus

merci
Non non, aucun doute Smiley cligne

les attributs doivent être en minuscule en xHTML strict !

Je suppose que c'est le cas pour ta page (rien ne me permet de le savoir si tu ne donnes pas plus d'info).

Le validateur te le dit clairement d'ailleurs :
validateur a écrit :

How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute
Bonjour et merci. Mais je vis une histoire de fous. Je me suis pincé, j'ai crié Aïe! Smiley bawling
Et pourtant, c'est la vérité:
J'ai remplacé onFocus par onfocus. J'ai sauvegardé et dévinez... il se remet en onFocus. Est-ce cette connerie de DWV ou alors onFocus ne peut-il s'écrire que de la sorte.


Merci
C'est cette connerie de DW. Smiley dehors Smiley lol

Plus sérieusement : ton label est très mal employé.
Ne jamais utiliser la syntaxe suivante :

<label .... >Libellé : <input .... /></label>

Mieux vaut privilégier celle-ci :

<label for="....">Libellé : </label><input id="...." ... />

J'ai lu à plusieurs reprises qu'IE n'interprètait pas comme il faut la première. En plus, c'est plus logique : on a bien un libellé et un champ, et le champ est à l'extérieur du libellé.
Bonsoir et encore merci de vos conseils.
Tout est bien ok actuellement.

Une question pourtant en ce qui concerne les majuscules: cela veut-il dire que si le nom de mes photos comportent des majuscules la validation risque de mal se passer?

Merci bien
@+
oualad a écrit :
Bonsoir et encore merci de vos conseils.
Tout est bien ok actuellement.

Une question pourtant en ce qui concerne les majuscules: cela veut-il dire que si le nom de mes photos comportent des majuscules la validation risque de mal se passer?

Merci bien
@+


Non, aucun pépin pour les valeurs d'attributs. C'est juste les attributs et les balises qui doivent être en minuscule.

Par ailleurs, il est en général conseillé d'utiliser des minuscules, pas d'espace, pas d'accent etc pour les noms de fichiers, ça simplifie tout Smiley cligne