Natouille, French
@Natouille@mastodon.tetaneutral.net avatar

du jour : tronquer les textes ? Mauvaise idée.

Alors que le numérique offre (contrairement au papier) la possibilité de rendre les contenants élastiques, une tendance a émergé depuis des années, à savoir : faire des contenants visuellement parfaits en premier et tenter de faire rentrer les contenus au chausse-pied.

Bilan : les textes (ce sont souvent le textes) sont réduits à éléments devant s'adapter à leur environnement mal conçu.
Et ça peut donner des trucs... hmmm ⬇️

1/n

Natouille,
@Natouille@mastodon.tetaneutral.net avatar
Phipe,
@Phipe@diaspodon.fr avatar

deleted_by_author

  • Loading...
  • Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @Phipe tu sais le pire ? C'est que Indeed a une armée d'ux designers en interne. On se demande ce qu'ils foutent

    Aedius,
    @Aedius@lavraievie.social avatar

    @Natouille @Phipe
    ils sont là d'abord pour vendre de l'espace publicitaire, puis éventuellement pour que le site soi utilisable, non ?

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @Aedius @Phipe je ne pense pas, ils ont un modèle payant des annonces entreprises

    Aedius,
    @Aedius@lavraievie.social avatar

    @Natouille @Phipe

    C'est juste triste alors :(

    lordphoenix,
    @lordphoenix@social.targaryen.house avatar

    @Natouille @Phipe Je me demande si ça ne viendrait pas d’un problème de traduction. En anglais l’ordre des mots n’étant pas le même tu ne crées pas forcément le même risque d’incompréhension.
    (Souvenir de «Update manger» et «synaptic package manger» qui se transformait en «gestionnaire de…» dans gnome.)

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @lordphoenix @Phipe oui mais quand tu fais un produit à audience internationale, tu penses à la traduction et donc, tu vérifies

    lordphoenix,
    @lordphoenix@social.targaryen.house avatar

    @Natouille @Phipe Ouais alors pour ça il faudrait que l’industrie informatique abandonne ses biais d’occidentaux anglophone hein…
    Et on pourrait en dire autant du milieu du logiciel libre.

    Neea,

    @Natouille @Phipe ils s'arrachent les cheveux à en devenir chauves parce que quoi qu'ils proposent et expliquent les chef leur imposent ce qu'ils veulent, probablement

    dimitri,
    @dimitri@framapiaf.org avatar

    @Phipe @Natouille
    Ça c'est à force de faire des sondages bidons avec comme 4e réponse « La réponse D ».
    Ça laisse des séquelles 😂

    GoOz,
    @GoOz@mamot.fr avatar

    @Natouille C'est magique ! ◔_◔

    f4grx,
    @f4grx@chaos.social avatar

    @Natouille mouhahaha

    piwi,
    @piwi@framapiaf.org avatar
    Ro_G,
    @Ro_G@framapiaf.org avatar

    @Natouille 🤣 🤣

    nicopar,
    @nicopar@mstdn.fr avatar

    @Natouille 🤣🤣

    lucas3d,
    @lucas3d@mastodon.social avatar

    @Natouille @urbanbike C’est le cas de certains sondage sur iPhone avec #ivory. #icecube gère mieux cela.

    melunaka,
    @melunaka@eldritch.cafe avatar

    @Natouille C’est d’autant plus frappant dans le 2e cas, où le texte est à priori connu d’avance et donc la disposition de la page devrait prendre ça en compte…

    Mais en général, pour les contenus dont la taille n’est pas connue à l’avance, je ne comprends pas pourquoi les sites pourraient pas faire soit un fondu vers la couleur de fond (plutôt que le … qui est un caractère qui peut exister dans un texte), ou alors de couper à l’espace précédent le dépassement de la limite de caractères.

    Techniquement, c’est très accessible de faire quelque chose de mieux que genre gesticule l’entièreté de ce à quoi on nous a habitué

    tuxmain,

    @melunaka @Natouille Si c'est bien fait, le "..." vient du CSS text-overflow: ellipsis. Ça tronque bêtement mais au moins on peut sélectionner le texte qui n'est pas affiché (avec triple clic, maj+flèches ou lecteur d'écran).
    Mais on peut changer "..." pour un autre caractère et rien n'empêche d'ajouter un fondu.
    Cela dit, nulle raison de penser qu'ils font ça bien, et une troncature côté serveur est aussi simple à faire.

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @tuxmain @melunaka mon propos n'est pas de discuter des astuces techniques pour tronquer au mieux mais du réel besoin de tronquer. Globalement, cette coupe est contrainte par la conception de l'interface alors que le texte complet pourrait être affiché.
    Si contraintes il doit y avoir, elles doivent se situer en amont lors de la saisie des contenus avec des champs limitant la longueur. Il faut prévoir des règles de gestion edito

    melunaka,
    @melunaka@eldritch.cafe avatar

    @Natouille @tuxmain jsp dans le cadre de la prévisu d’un message instantané, d’un e-mail ou d’un post de réseau social (cas 1 et 3), ça fait sens de pas toujours afficher entièrement un texte… à moins que j’aie mal compris

    zotof,
    @zotof@piaille.fr avatar

    @Natouille j’avais raison de me méfier de Florent…

    tellington,
    @tellington@eldritch.cafe avatar

    @Natouille j'ai mis un certain temps à comprendre quel était le problème dans le premier exemple, je croyais que ça parlait réellement de mensonge lol

    zipppipp,

    @Natouille j'ai l'impression que ça montre aussi beaucoup le drame qu'est le web anglo-centré.
    Parce que le truc des compétences là, ça a du être pensé par des anglais, où ils écrivent "Management Skills" ou "Relationship Management Skills".
    Et combien de fois je vois des UX foireuses juste parce qu'elles ont été pensé en Anglais et ça prennait moins de place...

    KToche,
    @KToche@mamot.fr avatar

    @Natouille haha ! J'avais également vu celle-ci passer et l'avais mise de côté

    gruik,
    @gruik@piaille.fr avatar

    @KToche @Natouille ouvreeez vos gros cons

    ParadisFraise,

    @KToche @Natouille

    J'espère qu'ils ne vont pas louper les agriculteurs qui ont 2, 4, 6 parfois 8 systèmes d'arrosage automatique en marche sur un seul champ du matin au soir, le tout pompé forcément directement dans la nappe phréatique sans payer un centime.

    louischance,

    @Natouille je pense aussi que pour indeed ça a été conçu pour la langue anglaise et qu'ils n'ont pas modifié l'interface pour les autres langues aux mots plus longs (compétences >> skills).

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar


    Concernant la capture écran de Indeed, vous êtes nombreux à me dire que l'interface est prévue pour la langue anglaise.

    Oui c'est vrai, c'est l'explication, mais, Indeed est un poids lourd du marché, un méta moteur de recherche d'emploi présent dans plus de 50 pays (y compris en Antarctique 😲).

    "C'est le seul métamoteur de recherche d'emploi présent sur 7 continents"

    Alors quand on a une telle aura et qu'on souhaite garder sa place de leader, on soigne ses internationalisations.

    cgx,
    @cgx@mastodon.cgx.me avatar

    @Natouille C'est vrai, on y voit beaucoup de pingouins et de manchots

    Nico3333fr,
    @Nico3333fr@mastodon.social avatar

    @Natouille je vais pas mentir, c'est parfois un vrai challenge de gérer les contenus qui débordent, surtout générés par les users et en L10N (j'en ai encore fixé un y a une heure).

    Même si j'utilise assez fréquemment l'ellipse (c'est pratique, pas cher et ça marche bien), là l'exemple que tu montres pourrait s'en passer àmha.

    Qq coups de flex et autoriser les boutons à grandir... ça peut passer dans certains cas.

    1/2

    Aznorth,
    @Aznorth@framapiaf.org avatar

    @Natouille
    Encore un autre exemple que je viens de voir passer : https://fosstodon.org/@r000t/110972147933932576

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @Aznorth excellent !!

    bohwaz,
    @bohwaz@mamot.fr avatar

    @Natouille Je ne sais plus quel site web mais quand tu clique sur le menu, absolument toutes les options sont tronquées à 6 caractères, ce qui fait que tu as une liste d'options qui ne veulent rien dire tant que tu n'a pas cliqué dessus... L'enfer.

    TofuTheSquirrel,
    @TofuTheSquirrel@piaille.fr avatar

    @Natouille ma haine de cette pratique grandit chaque jour. D'ailleurs c'esy aussi un problème d'accessibilité puisqu'en agrandissant les texte on en fait apparaitre d'autres et on rends les existantes encore plus pénibles.

    x0r,
    @x0r@mamot.fr avatar

    @Natouille Dans le même genre j'avais déjà vu Internet Explorer (oui ça date) tronquer le titre du site https://www.60millions-mag.com/ dans le titre de la fenêtre : ça donnait « Le site du magazine 60 millions de cons - Microsoft Internet Explorer ».

    piwi,
    @piwi@framapiaf.org avatar
    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @piwi oui je l'ai en stock

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar
    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar


    Je pourrais en ajouter d'autres 😁

    Alors, posez-vous la question : si vous faites le choix de tronquer du texte ou de faire des contenants strictes, quels sont vos arguments ? Comment pouvez-vous justifier vos choix ?

    Mon conseil : Pensez à récupérer un maximum de vrais contenus (contexte et métier) pour travailler dessus avant de penser à vos interfaces

    4/4

    outadoc,
    @outadoc@mastodon.social avatar

    @Natouille Je crois que les pires ce sont de très loin les sites d'actualités qui se retrouvent avec des articles au titre tronqué dans Google News. Pas de points de suspension. Juste tronqués. 😭

    Air,
    @Air@framapiaf.org avatar

    @Natouille tu penses que c'est le même problème ici ? C'est totalement illisible.

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @Air là, c'est un site qui n'a pas pensé sa version mobile

    Air,
    @Air@framapiaf.org avatar

    @Natouille c'est ballot.

    Natouille,
    @Natouille@mastodon.tetaneutral.net avatar

    @Air si ça a été fait par une personne pas très experte, c'est pas étonnant

    Air,
    @Air@framapiaf.org avatar

    @Natouille ils se tirent une balle dans le pied.

    Norore,
    @Norore@social.zdx.fr avatar

    @Natouille /me se prépare à prendre plein de notes

  • All
  • Subscribed
  • Moderated
  • Favorites
  • random
  • DreamBathrooms
  • ngwrru68w68
  • cubers
  • magazineikmin
  • thenastyranch
  • rosin
  • khanakhh
  • InstantRegret
  • Youngstown
  • slotface
  • Durango
  • kavyap
  • mdbf
  • tacticalgear
  • JUstTest
  • osvaldo12
  • normalnudes
  • tester
  • cisconetworking
  • everett
  • GTA5RPClips
  • ethstaker
  • anitta
  • Leos
  • provamag3
  • modclub
  • megavids
  • lostlight
  • All magazines