Bonjour,

Certains d'entre vous connaissent déjà le site, mais peu ont eu l'occasion de tester le nouveau design et les nouvelles fonctionalités... Smiley cligne
Alors voilà : MpokNews est un forum de discussions sur l'actualité en général.

La particularité est que les discussions ont comme sujet soit une news issue de l'aggrégateur, soit un article original.

Par rapport au design "sombre" initial (qui n'avait pas plu), j'ai écouté les remarques diverses et changé radicalement : design "clair" et "simple" (ce qui permet un rendu quasi-identique sur les différents navigateurs).

Le projet est finalisé à 99% (reste quelques détails au niveau css ou liens, plus une part rédaction dans la section Aide, ainsi que quelques "plus", du genre la page 404).
Au niveau du code, j'ai essayé d'appliquer tout ce que j'ai appris sur alsacreations, mais je peux avoir "loupé" certains points dans quelques pages.. (watch me out).
Salut,

Je me permet une remarque d'ordre esthétique, mais aussi ergonomique (les deux étant souvent étroitement liés) la taille du bandeau d'en tête et le logo, sa couleur et ce qu'il représente... Pour le bandeau il me parrait un peu trop haut pour un site ayant par nature beacoup de contenu, je le diviserai bien par deux et le logo du coup me parrait sombre et je ne vois pas de rapport direct avec le sujet, en fait il collerai mieux a un site fantastique, RPG ou hacking éventuellement... c'est mon avis et je partage... Smiley rolleyes
Merci pour vos avis, je tâcherais d'en tenir compte pour un éventuel futur re-design (pas pour tout de suite, le dev étant clos depuis hier soir... Smiley cligne ).

Quelque précisions tout de même :

- taille du bandeau : pas convaincu... La taille actuelle suffit à peine à contenir les deux formulaires (celui d'inscription et celui de recherche). Ceci dit, on pourrait envisager de les afficher l'un à côté de l'autre plutôt que l'un en dessous de l'autre, donc à réfléchir...

- logo : "sombre" oui, c'est parce qu'il a été fait à "l'ancienne époque" où le design était quasiment à l'inverse de l'actuel : fond noir, textes blancs (en gros, la couleur principale étant le bleu). Il était alors probablement mieux "intégré" au reste...
Mais lors du re-design j'ai conservé le logo lui-même (juste changé le fond du bandeau) parce que d'une part j'avais passé presque un mois entier à le réaliser (pixel par pixel sur certaines parties) et que j'en étais assez satisfait, d'autre part parce qu'il était devenu l'identité du site.
Enfin, le rapport avec le sujet c'est la forme "oeil" : gardez un oeil sur l'actualité...

- design sobre : oui, c'est évident, mais c'est voulu.. Le précédent design comportait des arrondis, des dégradés de bleu, des blocs de couleurs différentes, etc...
Il n'avait pas plu (parmi mes testeurs, et ici-même), et avait en plus l'inconvénient d'avoir certains problèmes (pas très graves mais visibles) sur certaines configurations/navigateurs.
C'est donc volontairement que j'ai "simplifié" la chose, du coup le site s'affiche à l'identique sur FF, IE7, IE6, IE5.5, Opera, etc... (j'ai quand même trouvé certains pbms avec quelques configurations, uniquement sur le bandeau, mais peu importants). Et les différentes couleurs (bleu, rouge, etc..) sont utilisées pour différencier les catégories (voir la page "dernières actualités", par exemple).

Enfin, l'expérience acquise sur alsacreations pendant la première année de développement m'a également amené sur cette voie : plus le design est sobre et le code clair (évidemment valide), et moins on a de problèmes avec les différents navigateurs (même avec IE 5.5).
L'accent a donc clairement été mis sur le code (xhtml et php) et les fonctionnalités, la partie "design" pure est passée au second plan, et c'est encore plus vrai avec le re-design, avec l'abandon des menus ou des boites arrondi(e)s.

J'ai tenté d'appliquer au maximum tous les conseils récoltés sur ce forum :
- validation W3C (et c'est pas toujours facile, puisque je suis dépendant, sur certaines pages, de ce que m'envoient les éditeurs).
- code html le plus sémantique possible (en y ajoutant une indentation personnelle, je préfère les espaces aux tabs).
- accessibilité (principalement dérivée du point précédent).
- css conditionnels pour régler les éventuels petits pbms IE 6 et IE 5.5 (en poussant jusqu'au pixel près, ce qui, je sais, n'était pas nécessaire Smiley confused )
- css print.
- optimisation des requêtes sql pour la rapidité.
- clarté du code php (mais ça c'est pour moi..).
- plus quelques techniques générales : url-rewriting (avec une structuration cohérente), meta description dynamique, et "tags clouds" dynamiques.

Bref, je suis plus "codeur" que "designer"... Smiley biggrin

[Edit : j'oubliais, à part le code, c'est aussi le contenu (original, je ne parle pas des flux rss de news, mais des articles) qui est mis en avant. Les articles publiés (pas encore assez nombreux, je l'avoue, mais c'est parce que le dev prenait beaucoup de temps) font l'objet d'un traitement particulièrement soigné (voir page "Blog" pour la liste des articles). Par exemple, en ce qui concerne les derniers SuperBowl (les 5 derniers au moins), ce qui est devenu ma spécialité, je ne crois pas (honnêtement) qu'il existe de meilleure référence (en français)... ]
Modifié par Mpok (08 Feb 2009 - 04:16)
Yop,

Je n'ai pas lu les messages précédent, par manque de temps et surtout pour éviter d'orienter ma vision fasse à ton site Smiley smile


¤ Le header est beaucoup trop haut et prend donc énormément de place sur la page. Pour une question d'ergomie il est important que l'utilisateur puisse voir (en affichant la page et sans commencer à scroller) des choses importantes et/ou intéressantes.
Hors ici le header prend 1/3 de la fenètre, puis la publicité et les sous-menus prennent 1/3, il reste ensuite 1/3 de ton contenu en sachant que celui-ci est divisé par deux (colonne de gauche et de droite)...
[La taille idéale pour un header est de 150 pixels]


¤ Les couleurs, le placement des sous menus rend le tout trés illisible et le menu principal (qui ce situe au dessus du header).

[Tu pourrais réussir à mieux organiser le tout en enlevant les sous menus qui je dois dire... on du mal à être clairement défini dans leur utilité...]


¤ Dans ton header tu as deux imposants formulaire.

[Tu pourrais simplement mettre la barre de recherche (seulement la barre) dans ta barre de navigation (en enlevant quelques liens...), enlever le message qui informe que nous ne sommes pas connecter pour coller le plus à droite possible le formulaire d'identification...]


Après pour le reste faudrait voir une fois que le haut est modifier... Smiley cligne

++