← Retour aux issues

Améliorer la visibilité des liens dans "Voir ou compléter ce lieu sur OpenStreetMap"

publié le , mis à jour
Avatar Codeberg de esmenardesmenard

Le contraste est très faible, on ne vois pas que c'est des liens avant de passer la souris dessus. image

  1. Avatar Codeberg de pmiossecpmiossec

    Je rebondie sur cette issue car j'avais parlé d'ouvrir une discussion sur le sujet des liens. Donc pour aller un peu plus loin, je pense qu'il faut uniformiser le style des liens car juste sur la fiche, on a 3 styles différents.

    image

    On pourrait soit juste garder la couleur bleu associée au liens, soit jouer sur les style. Une proposition: image

  2. Avatar Codeberg de etienneJretienneJr

    Très bonne idée de lancer la discussion ici. Je suis d'accord qu'il faut harmoniser, en trouvant un visuel compréhensible. Je trouve aussi que le style bleu souligné est un peu old school ! Et comme on propose beaucoup de liens, il faut un visuel léger pour ne pas alourdir l'interface. Et donc je trouve ta proposition de souligné/pointillé parfaitement adaptée ! On garderait donc :

    • le souligné/pointillé (avec texte noir) pour tous les liens vers des sites externes
    • les boutons bleus pour les actions dans l'app @laem qu'en penses tu ?
  3. Avatar Codeberg de laemlaem

    J'aime bien l'idée en général, mais pas fan du sous-lignage fin comme ça. Ça me fait trop penser à des notes de bas de page. Je me demande si un bleu plus foncé que l'actuel, sans soulignement, ne pourrait pas suffire. CF aussi mon travail sur sombre-ui où je vais redéfinir pas mal de couleurs. Je n'exclus pas de modifier le bleu principal d'ailleurs.

    En utilisant oklch(), on va pouvoir définir une gamme de couleur qui pourra ensuite s'adapter à une couleur principale changeante. https://piccalil.li/blog/a-pragmatic-guide-to-modern-css-colours-part-two

    Ça représente une belle opportunité pour raviver l'idée d'adapter la couleur des fiches lieu en fonction du type de lieu et ainsi de démarquer largement des autres interfaces :)

    image


✏️ Participer à la discussion