Discussion :

[Neckara]

Bonjour,

Je suis actuellement en train de tenter de créer un petit site (testé avec un firefox récent).

Malheureusement, j'ai eu plusieurs retours : "triste à mourir", "pas très beau", "couleurs pas superbes", "boutons pas top", etc.

Je ne suis pas très calé en "design" et de l'autre côté, les utilisateurs sont tout de même assez exigeant


On m'a déjà dit de m'inspirer de site déjà existant et très connu mais je ne vois pas trop ce qui cloche avec le mien (je dois avoir des goûts tout pourris aussi ).

Je n'utilise pas de CMS comme Drupal car :

• c'est très lourd et j'ai besoin de quelque chose de relativement léger pour mon petit serveur ;
• dès qu'on veut modifier certaines choses en profondeur, cela prend un temps fou et très souvent on se perd ;
• c'est pas marrant, on a plus grand chose à coder

En revanche, j'ai utilisé un site spécialisé pour trouver les couleurs (dont je ne me souviens pas l'url).

Est-ce que vous auriez quelques conseils, quelques retours précis ou quelques petites "règles" de design ?
Comment faites-vous pour créer un site "beau" et pour savoir s'il est "beau" ?

EDIT : Autres conseils reçus sur le chat :

• agrandir le menu
• rendre le fond plus "vivant"

css/index.css.save pour voir le fichier css original.

[Invité]

Bonjour,
je confirme, les couleurs sont...
jaune devant, marron derrière ! Sans oublier le "caca d'oie" bien présent...
Ca ne t'évoque rien ? (ceci dit sans aucune méchanceté, évidemment)

..., j'ai utilisé un site spécialisé pour trouver les couleurs (dont je ne me souviens pas l'url)...

Tant mieux ! Il faut l'oublier à tout prix !

[LIST][*]kuler.adobe color-wheel[*]colorschemedesigner[*]code-couleur[*]wikipedia - Couleurs du Web

[Neckara]

Là ce qui est présent, c'est le design "conseillé" par un membre du chat.

La première version correspond au css css/index.css.save.

Là j'essaye une autre structure ici.
Merci pour les liens, c'était bien colorsheme que j'utilisais.

[Invité]

Cela dit, on ne s'improvise pas designer.
Et les gouts et les couleurs...

Le meilleur conseil à te donner est que tu regardes d'autres sites sur le web, et que tu t'inspires de ceux qui te plaisent.

Pour les fonds, on peut aussi utiliser des images, des textures,...

[Neckara]

Cela dit, on ne s'improvise pas designer.

Je sais que je ne pourrais pas faire aussi bien que des professionnels mais j'espère arriver à faire un site pas trop "repoussant" .

Pour les fonds, on peut aussi utiliser des images, des textures,...

Oui, je pensais le faire pour la deuxième version pour le fond et l'espèce d'arche. Mais la création d'image, ce n'est pas trop dans mes cordes.

Est-ce que vous pensez que le site (version 2) est pas trop "horrible" pour le moment ?

[rodolphebrd]

Salut,

c'est pas très top comme design et je rejoins l'avis de Jérome.

Je verrais quelque chose plutôt comme ça http://codepen.io/anon/pen/gnubL

[Neckara]

Merci pour votre réponse.

Donc en ce qui concerne la structure même ce n'est pas trop "mauvais" ?
Ce sont surtout les couleurs qui font défauts ?
Personnellement, je n'aime pas trop les couleurs que vous proposez mais après les goûts et les couleurs...

[rodolphebrd]

Donc en ce qui concerne la structure même ce n'est pas trop "mauvais" ?

La structure est basique et il faut songer à une version responsive, je pense.

[Neckara]

Pour une version responsive, il faudrait que j'adapte la structure en fonction du terminal utilisé.

Donc il faut :

• une structure pour grands écrans (je pense que la version actuelle suffit ?
• une structure pour mobiles (là il faudrait changer complètement le CSS je suppose)
• une structure pour ?

Pour cela je peux tenter de :

• changer les valeurs absolues en %, même si je met à la fin des images, ces dernières pourront être redimensionnées ( ceci permettrait de supporter plus de résolution ) ;
• créer un css spécial pour les mobiles (?) car juste mettre des % ne suiffera pas et que la navigation style "ordinateur" n'est pas très évident sur un mobile je suppose.

Vous avez des conseils à ce niveau-là ?

[rodolphebrd]

Pour les versions pour écrans plus petit je verrais une approche avec des points de rupture comme par exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
@media only screen and (max-width: 900px) {
    #left, #right, #top, #corner-left, #corner-right { display:none; }
}

http://codepen.io/anon/pen/hLkzi

• "Valeurs en %" : OUI
• "CSS pour mobile" : OUI et compiler avec la CSS principale.

car juste mettre des % ne suiffera pas et que la navigation style "ordinateur" n'est pas très évident sur un mobile je suppose.

Hin ?

[Neckara]

Je ne suis jamais allé sur internet via mobile mais il me semble que certains sites ne sont pas très pratiques car il y a trop d'éléments, des liens trop petits à cliquer etc. pour une navigation sur internet via mobile.

[rodolphebrd]

Ah ok c'est de design adaptatif dont il s'agit.
Alors oui il est à prendre en compte.