[Amateur] Plats²

Bonjour,

J'ai créé un blog (dotclear) culinaire : il n'aura qu'une très faible diffusion, mais j'en ai profité pour essayer de bien faire les choses. Le site est en ligne depuis décembre mais j'ai refait l'interface cette semaine.

J'aimerais vos avis sur les différents aspects de mon travail: puisque je suis amatrice, il y a très certainement des erreurs et des oublis que vous m'aiderez à corriger.

Quelques précisions :
- Le html passe la validation, le css non à cause des coins arrondis - c'est un choix.

- COmme j'utilise dotclear, même si les sources de mon côté sont bien indentées, le résultat n'est pas top. Désolée.

- Je tenais à présenter deux colonnes d'articles côte à côte, d'abord pour mettre en avant l'aspect collaboratif, et surtout par ce que visuellement, c'était une envie qui me trottait dans la tête depuis quelques années. En conséquence, j'ai besoin d'exploiter un maximum de largeur d'écran, d'où le choix de la simplicité, les menus en dessous ( les boites de menus côte à côte sont aussi une forme que j'affectionne ) et la largeur élastique.

- J'ai fait des efforts pour simplifier au maximum la structure des <div>. Dans les pages de post, il en reste d'excédentaires au niveau des commentaires: j'ai l'intention de les modifier, mais le code de base étant de dotclear, je ne m'y suis pas encore trop mise.

- J'ai dessiné deux bannières, appelées aléatoirement : reloadez pour la deuxième

- Je n'ai pas encore cherché à adapter le site pour IE ou les petits écrans - je n'ai pas encore non plus testé sur de nombreux navigateurs. De même, la page "print.css" n'est pas au point. J'attends que tout soit fixé.Il me faut encore refaire tout le travail pour les très petits écrans et téléphones : dans ce cas les deux colonnes ne seront plus flottantes mais alignées l'une sous l'autre.

- Deux choses m'ont posé de très gros problèmes: la taille des polices, réglée en pourcentages, du coup d'un ordi à l'autre je n'arrive pas à juger ce qui convient.. Les couleurs ont aussi tendance à changer beaucoup d'un ordinateur à l'autre, et j'ai très peur de les voir toutes devenues fluo en changeant de poste.


Dans l'ensemble, toutes vos remarques m'intéressent, même si je n'aurai pas le temps de tout appliquer très vite: je fais ça sur mon temps libre, et je viens d'y passer une semaine, ce qui ne fait pas du tout du bien à mon mémoire de master !


http://www.Plats2.net

Je vous remercie par avance.
Modifié par Yate (18 Apr 2011 - 15:21)

C'est un peu bizarre le fond du menu avec la fumée.
Le champs du moteur en haut à droite semble trop caché.
Le logo est un peu trop simple peut-être.

Pour le menu, pour l'instant je n'ai pas de solution idéale - je ne peux pas retirer le fond sans nuire à la lisibilité avec l'autre bannière - et d'autres sont à venir. J'aime bien comme ça mais tu es le second à me dire l'inverse, et je commence à me poser des questions. J'ai tenté de laisser les liens toujours coloré, mais je trouve que ça fait bariolé.

Pour le champ de recherche, en général je cherche instinctivement en haut à gauche, je l'ai donc plaçé là. Etait-il trop petit ? Je l'ai un peu agrandi.

Pour le logo, je note. Je ne suis pas sure de vouloir faire plus complexe : il s'agit plus d'un titre que d'un logo et avec les dessins de la bannière je ne voudrais pas en faire trop. Je n'ai pas trop envie non plus d'un biseau ou autres effets de textes que je trouve un peu cheap. Si j'ai une idée, je m'y mettrai - c'est vrai que le côté droit de l'écran est plus habillé que le gauche, ce qui n'est pas forcément idéal.

Après second regard sur un autre écran,les couleurs étaient catastrophiques. J'ai essayé avec des couleurs web-safe et en réduisant le nombre de couleurs différentes, en espérant améliorer les choses.
Modifié par Yate (18 Apr 2011 - 15:22)

Bonsoir,

J'ai fait un gros effort d'amélioration pour épurer l'ensemble et régler les problèmes pointés: marges sur les côtés ( on perd un peu de largeur, mais on gagne en clarté et j'ai tenté d'utiliser les media query pour diminuer les marges sur petit écran ), champ de recherche au niveau des raccourcis d'accessibilité, lien pour le rss de l'autre côté, menu plus bas que les images de bannière, etc. Je devrais vraiment y passer moins de temps, mais vous savez combien c'est accrochant.
Si vous avez des conseils pour finaliser d'un point de vue graphique et pour améliorer le code, je suis preneuse.

j'avais fait le print.css mais maintenant il est un peu périmé, j'y jetterai à nouveau un coup d'oeil plus tard.

Bonjour,

j'ai quelques remarques sur l'ergonomie. Premièrement je trouve que le petit menu d'accès rapide en haut est inutile. Quand je l'ai vu pour la première fois il m'a plus embrouillé qu'aidé.
Ensuite la box des derniers commentaires, on peut s'en passer.
Puis, tu pourrais regrouper plusieurs catégories dans une option de menu. PAr exemple mettre un lien auteurs dans le menu, qui renverrait vers unepage vous présentant.
Concernant "qui sommes-nous" et "nous contacter", je les verrai mieux en lien en haut de la page, en remplacement du petit menu superflu.

J'espère que mes suggestions te seront utiles

Bon courage

Les images ne semblent pas être professionnelles peut-être est-ce normal.
Le moteur de recherche devrait être plus grand pour une utilisation plus facile.
L'image avec le chaudron ne se différencie pas assez avec le fond du site.

"Les images ne semblent pas être professionnelles", que veux-tu dire par là ? Ce n'est pas un site à vocation commerciale, et aucune photographie ni aucun des dessins n'est sous-traité par un professionnel. Si tu parles des photos de recettes, en effet, ce sont des vraies photos de plats, faites chez nous, pas des photos en studio. Si tu veux dire que les dessins te déplaisent, je veux bien que tu détailles pour que je puisse m'améliorer. Je n'ai pas dessiné depuis longtemps, et je me rend compte que j'ai une grande marge de progrès sur ces images !

Pour le chaudron, si tu penses aux contours de la peau, en effet, je vais repasser sous inkscape et y mettre un contour plus sombre, ca devrait améliorer les choses. Pour les bulles qui s'échappent du chaudron, la proximité avec le fond est plutôt voulue.

Le moteur de recherche commence à être vraiment grand - en tout cas en largeur. J'ai peur que plus commence à être ridicule. En hauteur je vois mal pourquoi l'agrandir, mais je peux surement ajouter quelques pixels.

Mistraldor : désolée, ton pseudo ressemble à celui de Madrileno, et je n'avais pas vu ton message.

Je ne suis pas sure que le petit menu d'accès rapide soit inutile pour ceux qui naviguent au clavier, je l'ai mis justement pour cette raison - j'ai lu plusieurs fois sur alsacréations que c'était une bonne pratique, et j'étais plutôt convaincue : les choses ont-elles changées ?

Par contre, en effet, je peux intégrer "qui sommes nous" et "contact" dans ce menu.
En revanche, ce menu ne renverra pas vers une page différente.

Les liens "Yate" et "Grad", qui renvoient vers les pages des deux auteurs, contiennent déjà une description. Je n'ai pas de raisons de les mettre ailleurs (et surement pas dans le menu d'accessibilité pour la page courante ) , ils sont à leur place dans la navigation par catégories

Quant aux liens des derniers commentaires, c'est un choix.

Yate a écrit :
Si tu parles des photos de recettes, en effet, ce sont des vraies photos de plats, faites chez nous, pas des photos en studio.

Ok, donc c'est normal.

Le nouveau header est moins bien que l'ancien, c'était plus sympa avec la cuisinière.

Il n'y a pas de nouveau header. Comme je le disais dans le premier post, il y a deux images ( à terme, beaucoup plus ) affichées aléatoirement.

Ok alors celui avec la chef cuisinière est mieux.

:) Chacun préfère celui qu'il veut. ( d'ailleurs la plupart des gens me disent préférer le pompier. )

Bonjour,

Yate a écrit :
Quelques précisions :
- Le html passe la validation, le css non à cause des coins arrondis - c'est un choix.

c'est le validateur CSS qui a un problème (ou les responsables de celui-ci qui sont un peu bornés) mais les préfixes -webkit, moz, ms et o et autres sont la bonne manière tout à fait valide d'introduire des fonctionnalités CSS encore à l'état de brouillon (enfin pas encore à l'état de Recommandation).

Ok, je note !
D'ailleurs ca va m'inciter à faire un peu plus gaffe à la propreté du css, par ce que je n'ai pas été très rigoureuse lors des dernières retouches.

Je trouve que le choix de la couleur du background n'est pas judicieux pour un site parlant de cuisine, c'est un vert qui tourne trop vers le gris.

-> J'exagère mais il pourrait presque faire penser à du vomi, ou à du moisi...

ça se passe au niveau du subconscient...
Le choix des couleurs a toujours de l'importance

Bonne continuation

Il n'est pas vet mais beige, as-tu vérifié les réglages de ton écran ?

eeeecc : autant de rouge que de vert !

(après des essais, sachant que pour ces raisons de compatibilité j'ai décidé d'éviter les couleurs qui ne sont pas web smart, en augmentant le rouge: ffeecc, on tourne vraiment au rose. en diminuant le vert: eeddcc, c'est pareil.