Felipe a écrit :
Bonjour,
bon conseil de la part de loicbn.
Je suis directement allé voir le formulaire de contact et il y a à redire.
Il n'y a pas d'étiquette (valide et accessible) devant les champs à saisir.
Les aides à la saisie sont écrites en rouge parce qu'elles servent également de message d'erreur.
J'ai donc un message d'erreur avant même d'avoir commencé à taper mon nom, c'est peu engageant.
De plus, imposer à quelqu'un la manière dont il doit s'appeler c'est AMHA mal vu car pas commercial : si je m'appelle Gertrüd čźed le MØøse (de mère tchèque et de père suédo-montypythonnesque), ben c'est mon nom 100% union européenne et je vais pas avoir envie d'en changer parce qu'un formulaire en a envie
Idem pour le mail : il ne permet pas de valider test+etiquette@gmail.com ou fredo@culture.gouv.fr ou toto@domain.co.uk ou conservateur@domain.museum
Les TLD avec plus de 3 lettres sont peu nombreux mais au moins l'un d'entre eux a 6 lettres (museum), .gouv.fr c'est le genre de clients que peu de pros du web peuvent se permettre de refuser dès le formulaire de contact , un client britannique pro a de fortes chances d'avoir un mail en .co.uk et enfin GMail a les faveurs des geeks et des consultants web 2.0, l'astuce du '+' est connue de certains (même si ça les empêchera pas de valider le formulaire en enlevant le + parce que c'est que du confort, ils vont se dire que si ça passe pas sur votre formulaire, il y aura d'autres trucs embêtants sur le site web qu'ils voulaient vous faire réaliser)
Justement, en parlant du formulaire, je note aussi que lorsque ces messages en rouge apparaissent ou disparaissent, ça cause un "flickering" désagréable. Et désolée pour le mot anglais, mais je ne connais pas son équivalent français puisque j'ai surtout vu le tableau des critères d'accessibilité en anglais. Mais ceux qui auront remarqué cet effet de déplacement verront de quoi je parle.
Sinon, je vais être plutôt brève dans les notes puisque ma tête ne file pas la super forme, mais voici les principales :
- Tu as entre 9 et 24 erreurs de validation selon la page, et elles sont toutes facilement évitables.
- Les tableaux de mise en page, c'est à remplacer, car trop rigides pour la maintenance et plus lourdes à charger que du full-CSS
- Évite les styles imbriqués (via l'attribut style=""), externalise-les pour permettre la mise en cache du style et ainsi alléger le chargement, et aussi pour rendre la maintenance plus aisée.
- Externalise tes scripts, en aussi peu de fichiers que possible et mets-les autant que possible à la fin du document, avant </body>, pour laisser le contenu se charger en priorité.
- Les images porteuses de contenu comme ton menu
doivent toujours utiliser la balise <img /> et non la feuille CSS ! Si ces images ne peuvent être chargées ou vues (navigateur texte, images bloquées au boulot, dépassement de quota chez les Belges, lecteur d'écran, robots des moteurs de recherche), on perd toute l'information car il n'y a aucun texte de remplacement ! Remplace-les par des <img /> avec un attribut alt=""
correctement renseigné
- Utilise des tailles de polices relatives au lieu de l'unité pt (qui doit être réservé à l'impression), car sinon, l'agrandissement ne fonctionne pas sous IE6 et IE7 qui sont encore bien présents dans les entreprises et qui sont bien souvent le seul choix possible (surtout pour IE6).
- Aucune balises <label> n'est présente dans ton formulaire ! Un non-voyant qui viendrait aurait donc du mal à savoir s'il remplit correctement les champs, qui n'ont aucun <label> lié à ces champs.
- La méta keywords est inutiles, Google a confirmé ne pas l'utiliser pour le référencement.
- Je ne vois aucune hiérarchie des titres !
- Les alt="" de ton header ne sont pas explicite. Les textes de remplacement
doivent être équivalents au contenu que ces images portent, afin qu'on puisse savoir sur quel genre de site on se trouve, quel que soit le média qu'on utilise !
Maintenant, d'autres détails peuvent m'avoir échappé, donc Laurie-Anne pourra toujours compléter si elle passe ici.
Donc, diagnostic : Code très mal optimisé qui transpire les mauvaises pratiques qui ne favorisent aucunement l'ergonomie et l'accessibilité. Je te recommande donc
très fortement de lire les tutos de ce site pour apprendre à coder selon les bonnes pratiques. Cela en va de votre image, car si un service de création de sites web fait des sites bien codés, ça ne fera que de la bonne publicité et un meilleur référencement.