Apprenez le HTML ! #2

Encore, on m'en veut je crois :

        <TR>
          <form action='recherche.php3' name='recherche' method='GET'>
          <td class=or2><INPUT size=14 value="mot clé" name=recherche></td>
          <td class=or2>
            <P><a href='#' onclick='document.recherche.submit()'><IMG height=18 hspace=5 src="sommaire_fichiers/bo-ok.gif"
            width=18 border=0></a></P></td></TR>
          </form>

Après indentation correcte, pour essayer de comprendre la tentative :

<tr>
	<form action='recherche.php3' name='recherche' method='GET'>
	<td class=or2>
		<input size=14 value="mot clé" name=recherche>
	</td>
	<td class=or2>
		<p>
			<a href='#' onclick='document.recherche.submit()'>
				<img height="18" hspace="5" src="sommaire_fichiers/bo-ok.gif" width="18" border="0">
			</a>
		</p>
	</td>
</tr>
	</form>

Les erreurs (dans l'ordre) :

  • Des balises en majuscule.
  • Un <form> qui englobe deux <td>, c'est fort.
  • l'attribut name pour <form> qui n'existe pas.
  • La méthode "GET" pour <form> au lieu de "get".
  • Les quotes manquantes pour les valeurs d'attributs.
  • la class "or2" qui n'existe pas.
  • L'attribut name qui vaut "recherche" pour le <form> et le <input>.
  • L'attribut alt manquant sur la balise <img>.
  • Des balises fermées n'importe comment, et n'importe quand surtout.
  • Une absence d'indentation intelligente correcte.

Ce qu'il ne faut pas faire :

  • Mettre des simple quote pour les valeurs d'attributs.
  • Mettre l'attribut onclick sur un <a>, mettre un attribut href vide.
  • Faire un formulaire sans <input type="submit">
  • Code n'importe comment, ça fait chier tout le monde.

La version corrigée :

<tr>
	<td>
		<form id="recherche" action="recherche.php3" method="get">
			<input size="14" value="mot clé" name="recherche">
			<a href="#" onclick="document.getElementById('recherche').submit();">
				<img width="18" height="18" src="sommaire_fichiers/bo-ok.gif" hspace="5" border="0">
			</a>
		</form>
	</td>
</tr>

Note : Le doctype utilisé sur cette page est un HTML 4.0 (le 4.01 suivra quand j'aurai corrigé la tonne de fautes),
c'est donc normal d'avoir des bizarreries et autres mochetées (normal ne veut pas dire bien).

Pour ceux qui ne sont pas familier avec le HTML, la lecture/correction/validité de ce code peut se rapprocher du langage SMS. C'est bourré de faute, on passe un temps fou à déchiffrer, et ça marche mal.

Commentaires

Humm... T'en a du bol :-)

On peut aussi constater qu'il manque le "type" de la balise "input"... Je ne sais pas si c'est considéré comme une faute, mais en tout cas, c'est crade :-(

hspace et border c'est valide pour quel doctype ca ?

Tu dois te faire des amis au boulot :)

@SnakeBoudoir : J'avais même pas vu xD !
Sinon : www.la-grange.net/w3c/htm... (La valeur par défaut de cet attribut est "text").

@Palleas : www.la-grange.net/w3c/htm... (hspace et border c'est aussi valide que id).

@Maxi : ... ^^'

Ah ouais ? oO
Dingue, j'savions pas
Thx :]

Valide ne veut pas dire conforme, c'est peut être correct au niveau de l'orthographe, ça n'en reste pas moins un attribut de mise en forme, donc pas conforme ;) (en gros c'est à oublier :D) !

Bah c'est de l'HTML 4.01 Transitional donc il y a plein de trucs moches qui sont valides (déconseillés, mais valides).

Enfin, quand tu tombe sur un site comme ça, le rendre valide HTML 4.01 Transitional est déjà un grand pas.

Mon erreur préférée c'est quand le validateur indique un table/td/tr mal placé ou mal fermé, super pratique à remettre tout dans l'ordre quand on a 5 tableaux imbriqués par endroits...

On dirait des fossiles de la programmation HTML tes "collegues". T'es sur que tu ne bosses pas avec un certain Cro-Magnon ?

Enfin bon, le titre du billet, ca aurait pu être aussi "Apprenez le XHTML", vu que certaines erreurs que tu listes relèvent plus du XML + HTML ;)

Avant de cracher dans la soupe, il faut balayer devant sa porte!

Tu dis que le doctype est html 4.01 donc tes affirmations sont fausses.

> Ce qu'il ne faut pas faire :

> * Mettre des simple quote pour les valeurs d'attributs.

Les simples quotes sont parfaitement valides. Il est même valide de ne pas mettre de quotes si l'attribut ne comporte pas d'espace.

> * Code n'importe comment, ça fait chier tout le monde.

dire n'importe quoi, ça induit les gens en erreur.

> l'attribut name pour <form> qui n'existe pas.

Tu aurais pu vérifier!
www.w3.org/TR/html401/int...

Tiens, Nicolas ici, le monde est petit ;)

hum.. C'est vrai que j'ai un peu fait un amalgame entre bonnes pratiques et code valide. C'est parce que pour moi ça coule de source de lier les deux.
Plutôt que d'aller apprendre qu'on peut mettre des simple quote ou pas du tout je préfère dire de mettre des double quotes, comme ça si un débutant passe par là il n'aura pas de questions à se poser et tout le monde sera content..

> dire n'importe quoi, ça induit les gens en erreur.
Désolé de ne pas être parfait, mais je croyais que la perfection n'était pas de ce monde... En plus c'est un petit peu gros de dire que j'induis les gens en erreur ^^.

> Tu aurais pu vérifier!
Je n'ai pas le temps de lire toute les spécifications, et autant le dire, je m'en fous des spécifications du HTML 4.01. Encore plus quand on me demande de rendre un site valide (pour la veille) et que la source est constituée d'une tonne de tableau imbriqués.
J'ai dit que l'attribut name n'existe pas parce que c'est ce que le validateur me disait. Après je m'en fous que ça existe ou pas, et je m'en fous que la spec ou le validateur se trompent.

Laissez le vôtre !

Les commentaires pour ce billet sont fermés.

À propos du billet

mercredi 18 avril 2007 à 10:12

Classé dans :

12 commentaires

Navigation inter-billets