[amateur] USMV Tennis de table

Bonjour,
je suis le créateur du site d'une association sportive et j'aimerai avoir quelques critiques (particulièrement au niveau design parce que c'est vraiment pas mon fort). Je vous remercie d'avance !

Cordialement.

http://martresdeveyre-tt.com

Salut,

Préalablement, il faut que je te prévienne que je ne suis qu'un amateur à peine débutant et que je serais bien infoutu de créer un site comme le tien (que je trouve carrément bien, peut-être un peu tristounet pour une association). Prends donc mes remarques pour ce qu'elles sont (essentiellement un exercice pour moi même) et attends le réveil des cadors d'alsacréations pour des conseils plus avisés...

En vrac :
- tu déclare du XHTML strict mais tu prends beaucoup de libertés dans le code
- pourquoi utiliser des styles en ligne alors que tu fais appel à des feuilles de style externe ?
- il n'y a pas de titre (texte) dans ton en-tête. Même si c'est peu probable que l'on arrive par hasard sur ton site, ce serait bien (et pas compliqué) que tu annonce la couleur...
- pourquoi avoir utiliser le même titre (balise <title>) pour toutes les pages ?
- le débordement de l'écrit sur les photos de fond, même si elles sont en noir et blanc et transparence, ne facilite pas la lisibilité (dans les news)
- "Anniversaire" serait plus juste avec un "s" (et "Juin" plus élégant que "Jun", je trouve _ mais là je pinaille vraiment !)
- dans la rubrique "derniers messages" de la page d'accueil, tu utilise la balise <u>. D'une part, je ne crois pas que ce soit une balise XHTML, il faudrait plutôt utiliser la règle CSS

text-decoration=underline

D'autre part cela créé une confusion car on croit qu'il s'agit d'un lien mais on a beau cliquer... Sans doute d'ailleurs serait-il mieux que cela soient réellement des liens vers les sujets concernés dans le forum !

- ton menu me cause soucis :
* problèmes d'accessibilité : il est précédé dans le flux par d'autres élements qui en plus sont des liens vers des animations flash sans alternatives... (ces éléments étant positionnés en absolu, tu peux très facilement les placer ailleurs dans le flux afin que l'on accède directement au menu principal) - sinon, prévoir des liens d'évitement ?
* la visibilité et l'utilisation des sous-menus ne sont pas évidentes, d'autant plus que l'on ne change pas de page lorsque l'on clique sur un des onglets principaux qui inclut un sous-menu (si l'on ne voit pas ce dernier, on a l'impression que l'on a rien fait)
* on ne sait pas où l'on se trouve dans ton site : il faudrait peut-être un fil d'ariane (comme dans ton forum) et surtout une mise en exergue de l'onglet de la page sur laquelle on se trouve

- il faudrait une alternative texte aux animations flash (si une seule info devrait être accessible, ce serait bien la soirée couscous !)

Voilà donc quelques premières réflexions hétéroclites.

Fraternellement

PS : allez l'USMV

Salut,

Merci pour toutes ces remarques qui sont très justes. J'ai déjà commencé à les mettre en œuvres.

J'avoue qu'il peut m'arriver d'être un gros flemmard c'est pour ça que je fais du CSS en ligne des fois pour tester "à la va vite" et que je ne prends pas le temps de revenir dessus pour rendre le code plus propre... Mais je vais m'y mettre !

Pareil pour les titres...

En revanche je n'ai pas bien compris ta dernière remarque sur les animations flash.

En tout cas merci encore pour ces commentaires !

Cordialement.

Un visiteur de ton site peut ne pas lire les animations flash. C'est particulièrement vrai pour les utilisateurs de lecteurs d'écran (pas seulement). Ce n'est pas très problématique lorsqu'il s'agit uniquement de "décoration" (comme les amusants pongistes de ta page d'accueil) mais cela l'est lorsqu'il s'agit d'informations (comme l'invitation à la soirée couscous !). Il est donc fondamental de prévoir un texte alternatif à l'animation (l'équivalent en fait de l'attribut alt pour les images).

Et sinon niveau purement design ? Quelqu'un a un avis ? Moche ? Bof ? Agréable ?

N'hésitez pas à être dur !

Cordialement.

Au niveau de la bannière les transitions entres les photos sont trop visibles. Faudrait les rendre plus douces et virer quelques photos.
Gaffes aussi au détourage des pongistes, assez grossiers

De manière générale, il ya trop d'éléments animés sur la page, et pas forcément mis au bon endroit.

et enfin, je trouve qu'il ya un gros probleme de structure et de positionnement des blocs.
par ex: resultats mis en plein milieu de la page.

et même avis concernant les propriétés css qui doivent se trouver dans les feuilles de style

Bonne continuation
Modifié par h_wiz (13 Jun 2010 - 00:07)

Bonjour,

Le design est plutôt agréable et professionnel, mais a clairement été réalisé pour ton écran. Certains éléments ne sont plus au bon endroit sur très grand écran (ici 22" wide 1600px (et c'est loin d'être ce qui se fait de plus grand)).

Les deux blocs gris "Tournois d'été" et "Soirée club" ne sont pas du tout intégré au design, j'ai d'ailleurs pensé à de la pub (et du coup mon regard s'en est automatiquement détourné) à première vue (hormis dans le cadre d'une analyse poussée, tu auras rarement le droit à une deuxième chance dans des cas pareil).

Les éléments du site ne sont pas alignés suivant une grille, ce qui créé une impression de désordre, il faut revoir cela.

Du point de vue code, il y a clairement un problème : 134 erreurs c'est beaucoup trop.

* 6 fichiers CSS c'est beaucoup trop, il faut les regrouper.

* Il est préférable d'inclure les scritps en fin de document, afin de permettre au contenu de la page de se charger avant son comportement.

* Il te manque les meta Content-Language et Description.

* Tu n'as absolument aucun hiérarchie des titres...

* Si JavaScript est désactivé, ton menu ne fonctionne partiellement plus. Il faut te renseigner sur le JS non intrusif.

* L'utilisation de tableaux de mise en page n'est pas du tout nécessaire.

Merci pour toutes ces infos, ça va vraiment me faire avancer !

Cordialement.

Bonjour,

Suite à quelques critiques de certains membres de mon assoc, j'ai revu assez largement le design, en tenant compte des remarques qui m'ont été faites ici. J'avoue être assez content de moi ... Qu'en pensez-vous ?

Laurie-Anne, en ce qui concerne les scripts js, je ne peux pas les inclure ailleurs puisque mon "compte à rebours" l'utilise au chargement de la page. De plus, j'ai vu par-ci par-là que les scripts inclus dans <head></head> étaient mis en cache, donc c'est intéressant si on s'en sert dans la plus part des pages, non ?

Sinon j'ai un petit soucis, sous ie8 je n'ai pas le même affiche en local que sur internet, bizarre non ? J'ai bien vidé le cache donc ça vient pas de là...
Les utilisateurs de ie8 peuvent-ils me dire si le logo w3c (tout en bas) est bien dans le footer, ou s'il est dessous ? Cela fait parti des différences visibles.


Merci d'avance !
Modifié par swarley (21 Jun 2010 - 23:24)

Bonsoir,

Personne n'a relevé de problème d'affichage alors ?

Salutation. Il n'y a pas de problème sous IE8 : Le logo du W3C est bien dans le footer.

Je ne saurais m'attarder sur l'ensemble du site mais je choisi deux secteurs qui à mon avis reste très important. Le « club » d'une part et « équipes » d'autre part. D'ailleurs les propositions que je te donne pourront se généralisé sur l'ensemble du site.

- D'abord la typographie : Comme il s'agit d'un site d'information je choisirais une police adapter pour ce genre : sans serif par exemple conçu spécialement pour la lecture en ligne.

- Dans la rubrique « club » et « équipes » il y a beaucoup d'espaces entre les images et les textes. Ce sont en fait des secteurs tout désigner pour des chargements de données XML. Ces éléments me paraissent assez stable, donc pour durée dans le temps et ne risque pas de changer régulièrement comme les news et les articles.

Je n'ai pas vérifier ton code source ( Je ne le fais que très rarement - sauf exception ).

- Je repenserais ces 2 secteurs pour mieux utiliser l'espace disponible. Les textes et les images sur « Le club » sont beaucoup trop espacer, malheureusement. Un aspect plus compact, lors de l'intégration de données, en utilisant le CSS serait de bon goût.

- Un code PHP peu redimensionner tes images à une même dimension, ce qui facilite la mise en page de tes données images et textes. Dans l'ensemble ton site est de bon goût, il ne s'agit ici que de re-penser l'espace utile en CSS et le code logique en PHP. Si tes images était de même format ou tout au plus de deux formats distinct l'une de l'autre, tu serais mieux disposer à réfléchir la puissance de CSS et de diviser ta page en colonne si besoin il y a évidemment.

- Le code PHP que je te parlais est une zone administrative pouvant uploader des images. Lorsque la validation est fait le script PHP redimensionne l'image au format souhaiter et le place dans un répertoire prévu à cette fin. Un autre script a pour objet de cibler le répertoire en question et affiche les résultats à l'écran. Ce qui facilite le travail, automatisant l'ensemble des opérations à effectuer. On peut donc ajouter ou soustraire des images en ne manipulant que le répertoire images ou un fichier XML, stockeur des données à charger.

- Dernier point - est le rapport entre les images et les textes. Du point de vu esthétique de présentation c'est un peu moche. Du côté de la page de téléchargement du calendrier, tu pourras utilisé la partie de droite afin d'informer sur le colis à télécharger. Taille du paquet, son contenu et son rôle etc.

++ zardoz.
Modifié par zardoz (22 Jun 2010 - 01:14)

swarley a écrit :
De plus, j'ai vu par-ci par-là que les scripts inclus dans <head></head> étaient mis en cache, donc c'est intéressant si on s'en sert dans la plus part des pages, non ?

Effectivement, ils sont mis en cache s'ils se trouvent dans le head... Ils sont également mis en cache s'il se trouvent ailleurs. La seule condition étant qu'ils soient dans un fichier externe.