[Intermédiaire] Brightmarks

Bonjour,

Je viens d'accepter une commande de webdesign pour un site assez connu de la communauté du Site du Zéro. Puisque j'ai remarqué quelques points à améliorer dès le départ, j'ai discuté avec le webmaster, et d'un commun accord avec lui, je viens ici soumettre son site à vos yeux avisés, question de déjà connaître les points à améliorer avant de plancher sur le design en question dont j'ai déjà quelques idées en tête, notamment me baser sur les couleurs du logo pour la palette.

Le site en question est Brightmarks, un projet communautaire fondé par des jeunes étudiants pour permettre aux étudiants de gérer leurs notes en ligne pour un meilleur suivi, et aussi pour permettre l'entraide scolaire.

Puisque certaines parties ne sont pas visibles aux non-inscrits, j'ai créé un compte-test dont voici les identifiants : IshimaruTest + test00

Vous pouvez toujours tester l'inscription également.

Merci d'avance !

Ishimaru

Salut,
Je réserve mon jugement quand le design sera fini.
Juste une remarque quand même, le cadre d'intro prend toute la largeur. Je me retrouve avec une phrase de 1680 px de long. C'est beaucoup trop long.

Il faudrait réduire le bloc et le centrer ou réduire le bloc et remonter "Derniers messages du forum".

Voilà.
Modifié par David-Dante (22 Nov 2010 - 09:27)

David-Dante a écrit :
Salut,
Je réserve mon jugement quand le design sera fini.
Juste une remarque quand même, le cadre d'intro prend toute la largeur. Je me retrouve avec une phrase de 1680 px de long. C'est beaucoup trop long.

Il faudrait réduire le bloc et le centrer ou réduire le bloc et remonter "Derniers messages du forum".

Voilà.

En effet, pour la largeur, je n'ai qu'un écran de 1280 de large, mais je m'en doutais un peu que ça allait être super long sur les écrans larges, et je pensais d'ailleurs à l'idée de faire un design à largeur fixe de 1000px pour justement éviter ce problème de longueur démesurée des lignes.

Si d'autres alsanautes ont d'autres choses à dire sur l'ergonomie et le code, ne vous gênez pas !

Toujours personne d'autres ?

Bonjour,

Visuellement :
* Le logo mal détouré, sous IE6, ça passerait (et encore, il y a moyen de mieux détourer) mais sous IE8, ce n'est pas acceptable.

* Les textes sont vraiment minuscules.

* Les lignes deviennent vite trop longues sur grande résolution (pour une fois que je suis en full screen ^^; ) il faut leur donner une longueur max.

* Pourquoi "Actualité" et "Sondage" ne sont pas au même niveau que le lien "Accueil" ?

* Le message "Vous n'avez pas accès à ceci" avec redirection avant d'avoir pu lire est trash... Proposer le formulaire de login, plutôt, serait une bonne idée.

* Les images porteuses de contenu doivent être placée dans le code HTML. Le texte en display none n'apporte pas un mieux en terme d'accessibilité

Dans l'ensemble, c'est quand même assez terne, surtout pour un site destiné aux jeunes adultes.

Merci pour les retours Laurie-Anne. Je vais transmettre ça au webmaster pour qu'il puisse savoir les améliorations côté développement.

De mon côté, j'avais déjà remarqué plusieurs points que tu as remarqué, notamment le logo mal détouré, l'utilisation du display:none; et les couleurs ternes. Je compte de toutes façons refaire le logo avec Inkscape (pour pouvoir faire une copie en .png), fixer la largeur à 1000px et utiliser des couleurs plus vibrantes en me basant sur celles du logo. Donc tant qu'à trouver des points à améliorer, autant avoir les avis d'ici.

Par contre, pour ce qui est de la taille des textes, j'ai été plutôt surprise car ce sont des tailles relatives qui sont utilisées et je sais que IE peut zoomer sur les tailles relatives, et je n'ai pas trop de problèmes sur mon écran 1280*1024 avec Firefox 3.6 sous Linux. C'est peut-être justement le font-size:76%; sur le body qui fait ça, puisque chez moi, j'ai plutôt tendance à commencer avec un font-size:100%; sur le body (pour corriger le bug de l'unité EM sous IE) pour ensuite passer aux EM dans les blocs contenus dans body.

Juste une question : As-tu testé avec le compte-test ?
Modifié par IshimaruChiaki (07 Dec 2010 - 19:30)

Ce n'est pas parce que l'on peut zoomer que les polices doivent être de base minuscules.

Mais c'est quoi ton écran ? Car comme j'ai dit, c'est un 19" régulier avec 1280*1024 comme résolution, et les configs de base d'Ubuntu me permettent de rester sur cette résolution sans avoir à bidouiller dans les tailles de texte. En comparaison, sous Win, je reste en 1024*768 car les polices sont plus petites. Or, si j'augmente la résolution des polices, c'est mal géré par certaines applications, même celles utilisant l'API Win32, et c'est gênant pour le développement parce qu'en EM, c'est grossi sous IE, mais pas sous FF, tandis que les unités en pt sont grossis sur les deux, mais dans ce cas, c'est des tailles fixes donc pas zoomables sous IE6/7

Même avec mon problème de vision, je n'ai pas trop de mal à lire ces textes.

...peut-être que justement ça fait trop longtemps que je n'ai pas booté Win aussi...

Je trouve aussi les polices un poil trop petites. Ecran 1680*1200, firefox, Win7.

En fait, ça donne du 12,16px, ce qui devrait à priori être ok, sauf que ça dépend de la police utilisée. La tienne est trop serrée, et n'est pas assez "droite" pour que ça donne un bon rendu. (désolée je ne connais pas les termes techniques de typographie). Une police comme Verdana, par exemple, serait beaucoup plus lisible dans cette taille.

IshimaruChiaki a écrit :
je n'ai pas trop de mal à lire ces textes.

"Pas trop de mal", ce n'est pas le bon but à atteindre

Bonjour,

Quelques remarques en vrac concernant la page d'accueil :

* L'animation sur le favicon me "perturbe",

* Prévoir un effet au survol et au focus des liens qui ne passe pas uniquement par un changement de couleur de police de caractère (un soulignement par exemple),

* Les liens de continuation type "suite" sont non-compréhensibles hors contexte, il faut leur affecter un attribut 'title' dont l'intitulé doit être explicite (titre de la page de destination du lien),

* le lien "Accueil" en haut de page est encapsulé dans une liste non-ordonnée alors qu'il est seul, il faut le sortir de la liste à puce et éventuellement le mettre dans une balise <p>. L'idéal, comme dit plus haut serait certainement qu'il rejoigne ces petits camarades : "Actualités" et "Sondages",

* Il y a un problème (trou) dans la hiérarchie des titres de section. On passe directement de <h1> à <h3>.

* Les <p class="titre"> doivent être remplacés par des <hn>,

* Certaines différences de contrastes de couleurs entre le premier plan et le second plan ne sont pas suffisants (texte vert sur fond blanc - textes bleus sur fond marron - etc.)

Bon week-end.

Ok merci, je vais transmettre le tout à SdT, déjà que je l'avais fait il y a quelques jours après que Laurie-Anne soit passée.