Demande d'avis design La guerre des consoles

Bonjour à tous,

J'aimerai l'avis de mon design, je suis assez mauvais en graphisme mais je fais ce que je peux .
Il est censé etre finale, mais je demande votre avis afin d'apporter eventuellement des ultimes retouches.

Il est assez bleu, j'aime bien, mais j'ai peur que ca déplaise aux visiteurs.

http://guerredesconsoles.free.fr/inadvance/test/consoles/index.html

Le header ne sera pas celui là (c'est celui de mon ancien site), c'est juste un exemple d'intégration.
Design certifié xhtml 1.0 strict par w3c


Je suis ouvert aux conseils
Merci d'avance
Modifié par Bartimeus (29 Oct 2007 - 11:26)

Bonsoir,
je ne suis pas pro, mais je vais te dire ce que je pense à premiere vue:
Effectivement il y a trop de bleu. Du texte bleu sur fond bleu, n'est pas l'idéal.
Autre probleme de taille (c'est le cas de le dire); je navigue avec une police à 15px.
Ta barre de navigation est illisible, je n'ai pas eu le temps de voir ton code source, mais j'ai l'impression que tu t'es trompé. Pour pouvoir lire ta barre, j'ai du me mettre à 20px, ce qui a agrandi totalement le reste.
Ta barre de navigation doit être beaucoup plus lisible.

Joue sur les contrastes; rend tes textes plus lisibles.

En ce qui concerne le graphisme, je ne suis pas spécialiste donc je ne me proposerai pas trop.

Courage et bonne continuation



je viens de m'apercevoir que ton (ta) favicon est en rouge, mais qu'aucune couleur rouge n'apparait sur ton site...
[/edit]
Modifié par oualad (28 Oct 2007 - 22:05)

Bonsoir,

Merci de tes conseils, j'avais remarqué que la police était un peu petite mais je pensais à ce point, j'ai apporté des modifications mais je ne peux pas uploader mon ftp ne marche pas pour l'instant.

Concernant les couleurs, je conviens qu'il y a beaucoup de bleu, mais je n'ai aucune idée des modifications à apporter, aurai tu des propositions à faire ?

Il y a aura dans les articles, pas mal d'images et de couleurs, ce qui j'espere me rattrapera un peu sur les couleurs, mais je suppose que ça ne suffira pas.

Pour le favicon c'est bizarre, je n'en ai pas.
Modifié par Bartimeus (28 Oct 2007 - 22:48)

juste vite fait : le favicon c'est le favicon par défaut des sites hébergés sur free (ce qui explique aussi ton petit souci de ftp). Tu peux le changer en en mettant un a toi.

Pour ce qui est de ton design, c'est un peu petiot je trouve niveau visibilité c'est un peu dur avec le bleu sur bleu en +.
Essaye déja d'augmenter le conteraste typo/fonds

Voilà j'ai apporté quelques modifications, est ce que vos problemes de lisibilité sont réglés ?

Pour le favicon je tacherai d'en mettre un demain.
Sinon j'ai mis une image, comme entete du bloc central , pour voir un peu comment l'integration d'une couleur vive peut rendre.

Pour les contrastes, dois je rester dans les bleus ? et simplement accentuer les bleus ? ou dois je changer ?

J'avoue que niveau couleur je ne sais vraiment pas quoi faire

Bartimeus a écrit :

Concernant les couleurs, je conviens qu'il y a beaucoup de bleu, mais je n'ai aucune idée des modifications à apporter, aurai tu des propositions à faire ?

Tu peux prendre le parti de n'utiliser qu'une seule teinte mais cela exige une bonne maîtrise des contrastes.

Il faudrait introduire un jeu de couleurs complémentaires du bleu (orange) par petites touches et ouvrir des zones de blancs pour rythmer et dynamiser l'ensemble. Le blanc en fond de ton bloc de contenu serait préférable.
Désaturer le fond jusqu'à obtenir un gris bleuté ou appliquer éventuellement un gris brun dérivé d'un des oranges.
Modifié par Hermann (29 Oct 2007 - 00:07)

Merci de ton avis, j'ai essayé le coup du orange, c'est vrai que ca dynamise pas mal, je vais essayer d'en mettre, j'avais pensé au rouge mais c'est peut etre un trop aggressif.

Pour le fond, je prefere garder du bleu, disons qu'une autre couleur je ne trouve pas cela bien.

Pour la police, est ce que vous voyez bien? plus gros ca va faire moche.

Une autre question, l'entete avec le M en rouge de mario, comment vous le trouvez ? à la bonne place ? mal placé ? moche ? pas mal ?

Car soit je pars sur une base d'entete coloré different à chaque page, soit je reste sur un dégradé.

Bonjour,
Au fait, je pense, que ce qui te manque est la couleur blanc...
C'est peut-être une habitude que j'ai, mais je trouve que le blanc espace et aère un peu une page.
Avis personnel, bien entendu...

Salut,

Ça pique les yeux et ça manque de contraste.

Ton site n'est pas valide.

Bon courage

Salut,

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

Voilà c'est fait, ah oui pour la validité, c'est parce que j'ai rajouté vite fait le header et j'ai oublié le alt , sinon c'est bien valide ^^

Pour le blanc je suis bien d'accord, mais je ne vois pas où je peux en rajouter autre part que pour le fond =/

Bartimeus a écrit :
Pour la police, est ce que vous voyez bien? plus gros ca va faire moche.

Tu peux l'augmenter un peu si tu veux, et dans ce cas pour équilibrer il faudra peut-être augmenter un peu la hauteur de ligne (line-height).

Bartimeus a écrit :
Une autre question, l'entete avec le M en rouge de mario, comment vous le trouvez ? à la bonne place ? mal placé ? moche ? pas mal ?

Pas transcendant mais plutôt sympathique et bien intégré.

Sinon, une proposition d'amélioration pour le positionnement des images vignettes dans le menu horizontal:

ul#menu_horizontal a img {style.css (line 298)
border: none;
padding-right: .5em;
vertical-align:-25%;
}

Ensuite, tu as un problème avec ton menu vertical, qui ne respecte pas la bonne pratique suivante: Le survol ou l'activation des hyperliens ne modifie pas la mise en page.

Lorsque je passe sur certains items de ce menu, le texte repoussé sur la droite ne tient plus en largeur et passe sur deux lignes.

Si tu veux conserver l'effet de déclage par une vignette lors du survol, une solution serait de ménager un espace à droite. Lors du survol du lien, tu augmentes le padding de gauche de 20px. Il nous faut donc au moins 20px de réservés à droite:

.sbinav ul a {
	padding-left: 10px;
	padding-right: 25px;
}
.sbinav ul a:hover {
	padding-left: 30px;
	padding-right: 5px;
}

Et voilà, la largeur disponible pour le contenu reste la même dans les deux cas.
Au passage: pense aux espaces insécables avant tes points d'interrogation dans le menu, ou bien prend le parti de toujours écrire les signes de ponctuation sans espaces avant.
Modifié par Florent V. (29 Oct 2007 - 14:21)

Merci beaucoup florent, j'ai apporté une partie des modifications.
Pour le Point d'interrogation, je ne savais pas merci

Je vais aussi apporter des petites modifs esthetiques, comme la majuscule en début de paragraphe ect ....

Je vais essayer d'apporter des contrastes, de mettre du blanc.
Si vous avez d'autres idées, je prends note

Rebonjour,

J'ai fais un header, puis je avoir votre avis?

http://guerredesconsoles.free.fr/inadvance/test/consoles/images/header.jpg

Je suis assez nul en graphisme

J'ai pas encore modifié le design, j'y travaille

J'ai supprimé le site sur le ftp, car je viens de voir que google venait de m'indexait , c'est assez facheux
Modifié par Bartimeus (29 Oct 2007 - 19:48)

J'aime mieux, mais le texte n'est pas fort visible. Si ça parle d'armes, de guerres, ton texte n'est-il pas trop gentil???
Autre chose:
Etes-vous prêts... ("-" entre 'êtes' et 'vous')

oualad a écrit :
J'aime mieux, mais le texte n'est pas fort visible. Si ça parle d'armes, de guerres, ton texte n'est-il pas trop gentil???

Oui c'est un peu ça, pas assez virile comme typo
Une des solutions possibles consiste à faire le choix d'une typo bâton (Arial...) avec une graisse épaisse (extra-bold/black), sans italic.
Supprimes tous les effets superflus (ombres portée...), aggrandis le texte et mets le en rouge orangé. Puis "Etes-vous prêts...)" en bleu marine, le noir passe pas très bien. Voilà une solution comme une autre

Merci beaucoup