remarques sur le nouveau thème graphique de la 3.1 #3281

J'ai noté quelques points que je trouve problématiques avec le nouveau thème graphique de la 3.1.
Il ne s'agit pas de questions cosmétiques (les goûts les couleurs tout ça), mais de problèmes de lisibilité.
Essentiellement, Certains textes sont pénibles à lire à cause d'un manque de contraste avec la couleur de fond, ou quand celle-ci est trop saturée.
L'effet est plus ou moins présent en fonction de la couleur choisie dans les préférences, en tout cas il saute au yeux avec la couleur verte par défaut.

Tout est noté dans l'image en pièce-jointe, mais reprenons ici.

D'abord les points les plus problématiques, visibles sur la page d'un article :

bandeau supérieur (nom, langue etc.) : contraste un peu faiblard entre le texte et la couleur du fond
header des formulaires latéraux («logo de l'article» par ex.) : texte blanc sur fond clair très pénible à lire.
boutons des formulaires latéraux : idem, contraste trop faible, texte peu lisible.

D'autres points moins importants, mais génants :

la couleur de la bordure et des boutons des formulaires latéraux attire beaucoup l'attention, quasiment plus que la boîte info.
pas de marge entre le texte de l'article et le dernier formulaire de «afficher_milieu».
bon, l'ombre portée autour de la fiche, c'est subjectif, mais je trouve ça très moche.

Voilà pour les « bugs ».

Allez j'en profite pour donner mon impression sur ce nouveau thème. Soyons brutalement honnête : en l'état, je le trouve inférieur à celui de la 3.0.
Il y a bien un point que j'aime beaucoup : les textes éditoriaux en serif bien lisible et distinct du reste de l'interface. Mais en général, je trouve les couleurs trop « acidulées » et mal balancées.
D'une façon générale, je pense qu'il faudrait se diriger vers un thème plus « flat » : moins de dégradés, moins de bordures, pas d'ombres portées, et des couleurs plus sobres.

Hop, merci pour les retours, j'ai lié le ticket à celui que j'avais créé à ce sujet il y a quelques temps.

Je suis entièrement d'accord avec ce ticket et préfère nettement le 3.0 et un design flat.

Le design actuel est très maniéré. Il manque le lisibilité, de hiérarchie de l'information. Tous les effets (ombres portées, arrondis,...) sont difficiles à gérer de manière globale et entrainent des micro-anomalies un peu partout.

En plus, cela complique encore la tâche d'explication: pourquoi le design intérieure est si différente du design public.

Je serais pour revenir à 3.0.

voici une esquisse encore plus "flat"

le menu passe en gris, seul l’élément activé est allumé
on renforce les constrastes partout
les icônes sont au maximum en 2D

Oups, je n'avais pas vu l'anomalie #3077.

Ci-joint, un diff proposant quelques corrections, et une image pour comparer avant/après.
Ce sont des corrections somme toute mineures qui concernent 3 fichiers : theme.css.html, bando.css.html et forms.css.html.
L'idée est surtout de revoir les soucis de contrastes, plus quelques détails que j'ai évoqués avant.

formulaires latéraux (fiche d'un objet) : couleurs neutres (bordures et fond), boutons plus lisibles.
fiche d'un objet : pas d'ombre portée, remplacée par une simple bordure.
marge entre le contenu éditorial d'un objet et les formulaires de date etc.
bandeaux identité et outils : couleur de fond identique.

Ton avant / après à un ptit problème tcharlss car chez moi «avant» n'a pas tout à faite cette tête pour le bandeau du haut, mais peut importe.

Ces petites retouches me semblent bienvenues.
Erational, je ne pense pas qu'on puisse changer les petites icones du bandeau pour la 3.1 : il y aurait trop d'icones à modifier (c'est tout un thème d'icone cohérent à faire).

L'idée d'avoir peut être tout le temps le bandeau en gris en haut est peut être à creuser. Le truc, c'est qu'en dehors de l'accueil, on ne peut pas vraiment distinguer en css dans quelle partie on est (edition, configuration…) pour mettre en valeur cette icone là précisément, comme tu as fait avec l'accueil sur ta proposition erational.

voir #3323

voir #3077 (LES CONTRASTES ON A COMPRIS)

Tu t'es trompé cedric, les MAJUSCULES c'est pour #3323 :p

Autre point à fixer, les intertitres sont plutôt petits, du coup, si on colle un texte en gras sur une seule ligne en dessous d'un intertitre, on pourrait presque croire que le texte en gras est plus important que l'intertitre (voir capture ci-jointe).

Bon, je pense qu'on peut fermer le ticket maintenant. S'il reste des points à traiter, signalez les dans tickets dédiés (un par point à traiter svp).
Statut changé à Fermé

Ha mais non pardon, je pensais qu'on avait intégré les propositions alors que non... J'ouvre de nouveau, mais il serait bien de s'occuper de ce ticket un jour... (parce que là ça commence à dater ^^).

Pour tenter d'avancer, quelques remarques à propos des propositions de tcharlss :

formulaires latéraux (fiche d'un objet) : couleurs neutres (bordures et fond), boutons plus lisibles.

Perso je n'avais même pas remarqué le problème car j'utilise toujours le gris dans le privé. Ça a failli être la couleur par défaut pour la 3.1, mais Arnaud nous a "gentiment" fait remarquer que le gris n'est pas une couleur... Du coup, je ne suis pas certain que ta proposition lui fera plaisir, par contre ça le fera certainement réagir :p

Pour les boutons plus lisibles, je crois bien qu'on a augmenté le contraste de ce côté, ça semble bon de mon côté à ce jour.

fiche d'un objet : pas d'ombre portée, remplacée par une simple bordure.

Perso avec ou sans je m'en cogne un peu, mais je trouve plus en accord avec le reste du thème de ne pas utiliser d'ombre portée. Je crois bien que c'est la seule présente dans tout le privé, elle fait un peu tâche du coup. +1 donc :)

marge entre le contenu éditorial d'un objet et les formulaires de date etc.

Ce point semble aussi réglé maintenant.

bandeaux identité et outils : couleur de fond identique.

J'ai un gros doute sur ce point, en effet, si on utilise la "non couleur" gris (^^) et qu'on applique le gris clair du premier bandeau au second (#f4f4f4), la séparation visuelle entre la zone haute et la zone de contenu est beaucoup moins perceptible.

D'autres avis ?
Statut changé à En cours

Je crois que les principaux points liés ont été réglés : maintenant tout est bien lisible.
Le reste, ce sont des détails subjectifs pas très importants (ombre portée, couleur de fond bandeaux identité et outils).
Pour ma part ce ticket peut être fermé, ça me va très bien.

Super, merci pour le retour, il me semble qu'il ne restait que le point "fiche d'un objet : pas d'ombre portée, remplacée par une simple bordure" à traiter, n'hésite pas à un créer un ticket spécifique pour celui-ci, en attendant je ferme ce ticket :)
Statut changé à Fermé