Votre avis

Bonjour à vous !

Je voulais votre avis sur ce site : la largeur "imposée" de 950px en largeur pose-t-elle réellement un problème sachant que selon nos statistiques (en moyenne) seulement 2% des gens qui naviguent sur l'ancien site le font avec une résolution inférieure à 1024x768 ?

Sinon, le design vous plait ? Ne manquerait-il pas un peu de couleur (même si cela doit rester sobre et sérieux)...

Merci d'avance pour votre avis !

swissboy
Modifié par swissboy (16 Jul 2008 - 16:11)

Hello,

Merci de bien vouloir afficher le nom de ton site dans le titre du sujet, comme cela est demandé dans le message d'annonce de ce forum : "A lire avant de poster : Ergonomie, Design et demandes de critiques", sinon 99% des sujets de ce salon auraient le même titre évasif

Vraiment personne n'a d'avis ?

Bonjour Swissboy,
il faut parfois être patient mais il est vrai que les réponses ne fusent pas en ce moment

Globalement ça a l'air propre et sérieux donc c'est déjà positif à ce niveau là.

Quelques remarques:

> les couleurs grise et rouge ne sont pas très appropriées: l'ambiance générale est un peu froide, médicale (caractère d'urgence et sanguin du rouge vif et neutralité, indifférence émotionnelle du gris).
La référence aux couleurs du drapeau suisse ou au rouge de l'emblême du logo devrait rester anecdotique ou très discrète, tu dois aussi penser à la psychologie et au symboles des couleurs...
Le caractère d'entraide pourrait par exemple se traduire par des couleurs chaleureuses et non pas agressives comme le rouge.

> La barre de nav. n'est pas suffisamment accessible visuellement et au clic, le déplacement moyen du curseur pour y accéder est trop important, surtout sur les grand écrans. D'autre part sa position n'est pas très conventionnelle.
Il est préférable de le placer sous la zone identitaire (le logo...).

> La baseline doit se place sous le nom du logo et non en dessus.
L'espace vertical alloué à la zone identitaire est un peu top important.

> La taille des textes html est trop petite même pour quelqu'un ayant une vue relativement bonne.
Etant donné que la longueur de tes lignes (texte de contenu de section en bas) est assez longue, il faut que tu augmentes un peu l'interlignage.

> Un certain nombre d'information dont le nom du logo sont inaccessible une fois les images désactivées > ne pas se reposer sur un background CSS pour rendre un contenu accessible, CSS est une surcouche optionnelle.
> Même remarque lorsqu'on désactive CSS.
> Attention à la logique d'odre d'apparition des blocs d'informations une fois CSS désactivé.

> Attention à la logique de structuration, tu ne peux pas avoir simultanément un h1 "news" et "Les dernières news" alors que ce dernier est un sous-ensemble de news.

Bon courage
Modifié par Hermann (16 Jul 2008 - 18:05)

Salut Hermann !

Merci beaucoup pour ta réponse.
J'ai déjà effectué quelques changements selon tes bons conseils.

1. La barre de navigation a été déplacée sous la bannière.

2. J'ai augmenté la taille du texte et l'interlignage du contenu (uniquement)

3. J'ai essayé au mieux de respecter la logique pour les titres <h1> (pour le titre du site), <h2> (pour les sous menu et les "accès rapides") etc.

J'avoue avoir laissé le titre de chaque article en <h1> (car j'ai développé un module en PHP qui fonctionne comme ça ) et recommencé l'attribution des titres depuis <h1> lors des articles... pas top. Je ferai mieux la prochaine fois !

4. J'avais remarqué ce problème d'ordre d'apparition des blocs lors de la désactivation du CSS, aurais-tu une piste pour que le contenu apparaisse directement après la barre de navigation ? J'imagine qu'il faut simplement que ces infos se suivent dans le code HTML... enfin "simplement" .

Ça m'a l'air assez compliqué de pouvoir avec la même disposition en CSS si on empile les blocs d'après l'affichage non CSS qu'on voudrait avoir, du moins je ne sais pas comment remettre les blocs en place pour qu'ils aient le même aspect que maintenant...

5. Concernant le logo qui n'a pas réellement de texte alternatif, j'en suis conscient. Lors de la désactivation des images, on se retrouve avec un site sans réel titre textuel... même si lors de la désactivation du CSS, un titre <h1> apparaît au sommet.

Que penserais-tu de mettre une image dans la bannière en display:none, qui contiendrait un alt apparaissant si on venait à désactiver les images ? (si c'est possible)

6. Que veux-tu dire par :

a écrit :
le logo comporte plusieurs baseline (œuvre suisse...) dont 2 qui ne sont pas compréhensibles.

Tu veux parler du contenu du div <titre> que j'ai fait disparaître ?

7. Au niveau des couleurs je vais regarder, c'est vrai que c'est un peu froid ! Et pour la bannière, je vais la retravailler tout de suite pour en réduire un peu la hauteur.

Merci d'avance !
swissboy

Bonjour,
c'est mieux

swissboy a écrit :

J'imagine qu'il faut simplement que ces infos se suivent dans le code HTML... enfin "simplement" .

Exact, mais en l'état ça me parait plutôt correct (j'avais vu le footer au dessus d'un bloc il me semble)

swissboy a écrit :

Que penserais-tu de mettre une image dans la bannière en display:none, qui contiendrait un alt apparaissant si on venait à désactiver les images ? (si c'est possible)

Mauvaise idée car inaccessible CSS activée et image désactivée et d'autre part le display:none est inteprété par certain lecteur d'écran,
mieux vaut passer dans ce cas par un positionnement absolue en dehors de l'ecran.
La solution la plus accessible consiste avec mettre une image en HTML avec le alt adéquate tout simplement.

swissboy a écrit :

6. Que veux-tu dire par :
le logo comporte plusieurs baseline (œuvre suisse...) dont 2 qui ne sont pas compréhensibles.

Les 2 baseline en langue étrangères.

Autres remarques:

> tu devrais mettre en place des liens d'accés direct (voir le tuto correpondant ici-même) essentiellement pour les utilisateur en accés clavier.

> La cible étant a priori très large, fluidifier la largeur d'affichage pour rendre
le contenu au moins accessible sur du 800X600. (Un max-width de fixe avec solution alternative pour IE6 > voir la FAQ et c'est tout)
Il faudra passer toutes (ou presque) les largeur en %.
D'autre part certains utilisateur naviguent avec une barre latérale, ce qui réduit la largeur utile. Si tu ne sais pas faire, voir design fluide

> Le texte de bienvenue ne présente pas suffisamment d'accidents visuels (mise en exergue...).
Lorsque la première page est consultée, l'utilisateur scanne le plus souvent
la page rapidement, ce qui nécessite de mettre en place des points d'accroche visuel sur les
textes longs et plus généralement les texte à lire.
Modifié par Hermann (15 Jul 2008 - 12:42)

Re !

Encore merci Hermann !
C'est sympa de prendre du temps pour moi !
Je ne suis pas pro donc absolument toutes les critiques sont bonnes à prendre !

Je vais suivre ton idée et mettre la bannière en <img> directement, avec un alt. Le div titre n'aurait donc plus sa raison d'être (bien qu'il contienne un <h1>). Penses-tu que je devrais quand même le laisser ?

edit : erf, mes citations passent par dessus ce background, ça va être chaud de mettre la bannière en img !

Pour le logo, il s'agit du logo officiel de l'association, présente sur tous les visuels, les bus de transport, etc. Que faudrait-il changer selon toi ?

Concernant les touches d'accès rapide, as-tu essayé l'accès avec la touche 0 ? Ce mode de navigation est déjà en place avec pour accès 1, 2, 3, etc. pour le menu principal et a, b, c, d, etc. pour les rubriques

Seuls 2% des utilisateurs surfent dans une résolution inférieure à 1024 de largeur, c'est pourquoi j'ai fait ce choix. Un site à design fluide impliquerait de revoir mon design, en particulier la bannière que est actuellement fixe. Mais c'est vrai que d'habitude soit je fixe mes sites en 750px de large, soit je rends le design fluide. Tant pis ...

Pour le texte d'accueil tu as entièrement raison. Je vais donc mettre quelques sous-titre, peut-être des images, pour aérer !

A plus !
swissboy
Modifié par swissboy (15 Jul 2008 - 13:34)

swissboy a écrit :

Pour le logo, il s'agit du logo officiel de l'association, présente sur tous les visuels, les bus de transport, etc. Que faudrait-il changer selon toi ?

Oublies ma remarque, 3 baselines c'est pas très habituelle en France parcequ'on a qu'une langue officielle, mais c'est plus logique en Suisse
Je pense qu'il faudrait descendre si c'est possible la baseline française au dessous du nom du logo.

swissboy a écrit :

Concernant les touches d'accès rapide, as-tu essayé l'accès avec la touche 0 ? Ce mode de navigation est déjà en place avec pour accès 1, 2, 3, etc. pour le menu principal et a, b, c, d, etc. pour les rubriques

D'une part je te déconseille d'utiliser les lettres et d'autre part les raccourcis clavier provoquent des conflis avec certains raccourcis issus d'applications de tout type.
Puis il faut savoir que la mise en place des raccourcis clavier fait seulement parti des critères d'accessibilité de niveau Or/Priorité 3 (WCAG). Bref ne pas trop compter dessus pour améliorer l'accessibilité.
Il est plus utile de veiller à une bonne logique de structuration des titres
et des contenus divers.
Modifié par Hermann (15 Jul 2008 - 18:15)

Ok, je vais voir ce que je peux faire alors !
Encore merci et à une prochaine !

swissboy