3246 sujets
Critiques de vos sites: code et design
Ton flash ne fonctionne pas chez moi (Ubuntu + Firefox 3.6), j'ai un grand carré blanc. En plus, il est inséré de façon non valide, <embed> est une balises propriétaire et n'est pas acceptée dans la forme stricte de XHTML.
http://www.alsacreations.com/astuce/lire/25-animation-flash-valide-embed-object-swfobject.html
mais anyway, les splashscreens n'apportent pas grand chose et retardent l'atteinte du contenu, d'autant plus que le lien pour accéder ne ressort tellement pas et n'est pas explicite ! Si ce n'était pas de la latence de plusieurs seconde dans le chargement de l'image de fond, je ne suis pas sûre que j'aurais vu le lien, car celui-ci n'est pas très lisible, et la description l'est encore moins !
Maintenant, pour la page d'accueil, une fois passé le splashscreen, je vais te proposer un petit exercice : Installe l'extension Web Developer et ensuite, sur la barre, tu vas dans Image > Désactiver les images > Toutes les images.
Qu'est-ce qui se passe alors ? Tu perds beaucoup d'information, car tu as inséré ta bannière et autres images porteuses d'information comme images de fond, sans avoir quoi que ce soit pour les remplacer ! Ces images doivent toujours être insérées avec la balise <img /> et avoir un attribut alt="" correctement rempli pour que des textes puissent prendre le relais même si ces images ne pouvaient pas être vues ni chargées (non-voyants utilisant un lecteur d'écran, images bloquées au boulot, moteurs de recherche, serveur qui déconne).
Je te donne ce lien à lire : http://www.alsacreations.com/astuce/lire/62-balise-ltimggt-ou-feuille-de-style-css.html
Car dans la situation actuelle, ta bannière est en fond alors qu'elle aurait dû être insérées avec <img />, alors que dans le cas des boutons "Accueil" et "Contact", ils utilisent bien la balise <img /> mais n'a aucun texte alternatif défini !
Maintenant, je passe à d'autres points :
- Dans ton formulaire, je ne vois aucun <label>, alors que ceux-ci sont importants pour l'accessibilité ! Si un non-voyant avec son lecteur d'écran passait, comment pourrait-il s'assurer qu'il remplit correctement les champs s'il y a absence de <label> pour pouvoir les lier aux champs ?
- Je ne vois aucune utilisation des titres, je ne vois que quelques <p> et à part de ça, je ne vois que des <div>, des <span> et des <br> pas toujours écrits correctements (je vois des </br> à certaines places alors qu'on doit écrire <br />). Pour mieux comprendre, je te propose un autre exercice : Sous Mozilla Firefox, va dans Affichage > Style > Aucun style et dis-moi si tu arrives à distinguer tes titres, tes menus et tes paragraphes. Sûrement que non, car la structure de ta page manque de sémantique, et c'est bien souvent là le problème des kits graphiques, ceux-ci ne suivent pas toujours les bonnes pratiques.
- Je vois du code PHP visible dans le code HTML alors que normalement c'est supposé de ne pas s'afficher puisque c'est le serveur qui lit le code (contrairement au Javascript qui est lu par le navigateur) et retourne le code HTML résultant. Du fait de ce problème de traitement, tu as une faille de sécurité énorme puisque je viens de découvrir tes identifiants MySQL et je serais donc capable de pirater ton site en me connectant à phpmyadmin si j'en avais envie. Je remarque aussi que même si t'essaies d'éviter les injections SQL, de façon assez bourrine je trouve, tu ne vérifies pas assez tes données, comme par exemple l'adresse e-mail, car qu'est-ce qui te dit que le visiteur ne voudra pas mettre quelquechose qui n'a pas du tout le format d'une adresse email, comme une simple série de chiffres ou une adresse URL ou une série de caractères bizarres ? Je te recommande donc de t'informer sur le principe du Never Trust User Input.
Bref, pour conclure : Une grosse faille de sécurité à corriger au plus vite, et des gros points à améliorer au niveau de l'accessibilité.
Je te recommande donc de la lecture :
http://www.alsacreations.com/tutoriels/
http://www.siteduzero.com (pas seulement les cours mis en avant, mais aussi les cours des membres)
http://www.alsacreations.com/astuce/lire/25-animation-flash-valide-embed-object-swfobject.html
mais anyway, les splashscreens n'apportent pas grand chose et retardent l'atteinte du contenu, d'autant plus que le lien pour accéder ne ressort tellement pas et n'est pas explicite ! Si ce n'était pas de la latence de plusieurs seconde dans le chargement de l'image de fond, je ne suis pas sûre que j'aurais vu le lien, car celui-ci n'est pas très lisible, et la description l'est encore moins !
Maintenant, pour la page d'accueil, une fois passé le splashscreen, je vais te proposer un petit exercice : Installe l'extension Web Developer et ensuite, sur la barre, tu vas dans Image > Désactiver les images > Toutes les images.
Qu'est-ce qui se passe alors ? Tu perds beaucoup d'information, car tu as inséré ta bannière et autres images porteuses d'information comme images de fond, sans avoir quoi que ce soit pour les remplacer ! Ces images doivent toujours être insérées avec la balise <img /> et avoir un attribut alt="" correctement rempli pour que des textes puissent prendre le relais même si ces images ne pouvaient pas être vues ni chargées (non-voyants utilisant un lecteur d'écran, images bloquées au boulot, moteurs de recherche, serveur qui déconne).
Je te donne ce lien à lire : http://www.alsacreations.com/astuce/lire/62-balise-ltimggt-ou-feuille-de-style-css.html
Car dans la situation actuelle, ta bannière est en fond alors qu'elle aurait dû être insérées avec <img />, alors que dans le cas des boutons "Accueil" et "Contact", ils utilisent bien la balise <img /> mais n'a aucun texte alternatif défini !
Maintenant, je passe à d'autres points :
- Dans ton formulaire, je ne vois aucun <label>, alors que ceux-ci sont importants pour l'accessibilité ! Si un non-voyant avec son lecteur d'écran passait, comment pourrait-il s'assurer qu'il remplit correctement les champs s'il y a absence de <label> pour pouvoir les lier aux champs ?
- Je ne vois aucune utilisation des titres, je ne vois que quelques <p> et à part de ça, je ne vois que des <div>, des <span> et des <br> pas toujours écrits correctements (je vois des </br> à certaines places alors qu'on doit écrire <br />). Pour mieux comprendre, je te propose un autre exercice : Sous Mozilla Firefox, va dans Affichage > Style > Aucun style et dis-moi si tu arrives à distinguer tes titres, tes menus et tes paragraphes. Sûrement que non, car la structure de ta page manque de sémantique, et c'est bien souvent là le problème des kits graphiques, ceux-ci ne suivent pas toujours les bonnes pratiques.
- Je vois du code PHP visible dans le code HTML alors que normalement c'est supposé de ne pas s'afficher puisque c'est le serveur qui lit le code (contrairement au Javascript qui est lu par le navigateur) et retourne le code HTML résultant. Du fait de ce problème de traitement, tu as une faille de sécurité énorme puisque je viens de découvrir tes identifiants MySQL et je serais donc capable de pirater ton site en me connectant à phpmyadmin si j'en avais envie. Je remarque aussi que même si t'essaies d'éviter les injections SQL, de façon assez bourrine je trouve, tu ne vérifies pas assez tes données, comme par exemple l'adresse e-mail, car qu'est-ce qui te dit que le visiteur ne voudra pas mettre quelquechose qui n'a pas du tout le format d'une adresse email, comme une simple série de chiffres ou une adresse URL ou une série de caractères bizarres ? Je te recommande donc de t'informer sur le principe du Never Trust User Input.
Bref, pour conclure : Une grosse faille de sécurité à corriger au plus vite, et des gros points à améliorer au niveau de l'accessibilité.
Je te recommande donc de la lecture :
http://www.alsacreations.com/tutoriels/
http://www.siteduzero.com (pas seulement les cours mis en avant, mais aussi les cours des membres)
Bonjour, merci pour ces problème je vais essayer de réparer ces erreurs au plus vite.
En ce qui concerne le splashscreen j'ai mis le <label> et je vais essayer d'être plus explicite sur cette page.
Pour les balise <img src="" alt="" />, mes images sont stocker sur ma page design et donc impossible de transférer sur ma page html/php.
Ensuite pour les balise <br/> je vais essayer de tous les remplacer mais ... sa va prendre du temps
.
Et pour finir, pour ma sécurité de mes donnée sur ma BDD je vais essayer de trouver le problème sur internet, mais je sais pas comment vous avez put trouver sur mon site cette faille pourtant en allant sur code source de la page et voir le javascript (sur web developer) je n'est rien trouver la page est vide sur mon fichier config.
Cordialement
Modifié par bibi_6919 (05 Jan 2011 - 17:42)
En ce qui concerne le splashscreen j'ai mis le <label> et je vais essayer d'être plus explicite sur cette page.
Pour les balise <img src="" alt="" />, mes images sont stocker sur ma page design et donc impossible de transférer sur ma page html/php.
Ensuite pour les balise <br/> je vais essayer de tous les remplacer mais ... sa va prendre du temps
.Et pour finir, pour ma sécurité de mes donnée sur ma BDD je vais essayer de trouver le problème sur internet, mais je sais pas comment vous avez put trouver sur mon site cette faille pourtant en allant sur code source de la page et voir le javascript (sur web developer) je n'est rien trouver la page est vide sur mon fichier config.
Cordialement
Modifié par bibi_6919 (05 Jan 2011 - 17:42)