web-dev-qa-db-fra.com

Tronquer les étiquettes de texte longues - Meilleures pratiques?

Je me demandais s'il y avait des études sur les étiquettes tronquées, au cas où elles deviendraient trop longues et que les mises en page ne pourraient pas y remédier? Cela déroute-t-il les utilisateurs si une étiquette est tronquée avec un caractère points de suspension au milieu d'une étiquette comme ceci:

  • LabelBeginning ... LabelEnd

    ou

  • LabelBeginning (...) LabelEnd

Si je compare différentes directives de style de texte, il existe différentes approches. Apple par exemple tronque les longues étiquettes avec des points de suspension au milieu d'une étiquette, ce qui, selon moi, est une excellente solution car je pense que cela reflète la façon dont les gens numérisent et identifient une étiquette (début et fin).

"Un caractère points de suspension peut également indiquer qu'il y a plus de texte qu'il n'y a de place à afficher dans un titre de document ou un élément de liste. Si, par exemple, le nom d'un élément est trop long pour tenir dans un menu ou une zone de liste, vous devez insérer un point de suspension au milieu du nom, en préservant le début et la fin du nom. Cela garantit que les parties du nom les plus susceptibles d'être uniques sont toujours visibles. "

Microsoft suggère d'éviter de tronquer les étiquettes dans la mesure du possible, mais n'entre pas dans les détails sur la façon d'implémenter une ellipse dans les longues étiquettes.

"Ellipses signifie incomplétude. Utilisez les ellipses dans le texte de l'interface utilisateur comme suit:

Commandes. Indique qu'une commande a besoin d'informations supplémentaires. N'utilisez pas de points de suspension chaque fois qu'une action affiche une autre fenêtre, uniquement lorsque des informations supplémentaires sont requises. Les commandes dont le verbe implicite est d'afficher une autre fenêtre ne prennent pas de points de suspension, tels que Avancé, Aide, Options, Propriétés ou Paramètres.

Données. Indiquez que le texte est tronqué.

Étiquettes. Indiquez qu'une tâche est en cours (par exemple, "Recherche ...").

Astuce: Le texte tronqué dans une fenêtre ou une page avec un espace inutilisé indique une mauvaise disposition ou une taille de fenêtre par défaut trop petite. Recherchez des mises en page et des tailles de fenêtre par défaut qui éliminent ou réduisent la quantité de texte tronqué. "

13
spunkypixels

Résumé: cela dépend, mais par défaut à 'abcdef ...' sur 'abc ... def'

Je choisirais la méthode selon que le texte à la fin ou au milieu de la chaîne est plus susceptible de différencier l'élément. Cela dépendrait du domaine (donc je ne pense pas que des études isolées de contextes particuliers seraient utiles).

Sur un site Web de propriété, par exemple, une chaîne d'adresse se terminera généralement par "Route" ou "Rue". Ainsi, la forme "abc ... def" ne sera pas très utile car les caractères finaux seront presque toujours "oad" ou "eet", ni l'un ni l'autre n'aidera l'utilisateur.

Si la réponse n'est pas claire, je choisirais par défaut le formulaire 'abcdef ...' plutôt que 'abc ... def'. C'est parce que je soupçonne fortement que les mots partiels seront plus faciles à deviner à partir des caractères initiaux que des caractères finaux. 'Openi ...' est beaucoup plus reconnaissable que '... ening', par exemple. En effet, de nombreux mots anglais ont des suffixes et des motifs de fin non uniques.

6
Jimmy Breck-McKye

L'utilisation d'Ellipsis présente un inconvénient, car l'Ellipsis lui-même prend de l'espace qui aurait pu être utilisé pour afficher davantage d'informations réellement utiles à la place. Surtout si vous utilisez les points de suspension à chaque extrémité, vous pourriez envisager une alternative à l'espace gaspillant trois points: en effaçant le texte sur les derniers caractères. Le texte reste lisible, mais l'effacement donne une indication qu'il y a plus de texte à avoir.

Par exemple:

example of using a fade effect instead of Ellipsis

( source de l'image)

Bien sûr, il vaut toujours mieux ne pas avoir à le faire sur les étiquettes, donc par tous les moyens: essayez de l'éviter, mais si vous êtes vraiment coincé entre un rocher et un endroit dur, cela pourrait être une solution.

3
André

Il existe une règle non écrite, qui semble plutôt être gravée dans le marbre, à propos de ne pas casser les étiquettes.
.
.
. être un cryptique pour un locuteur en langue étrangère.
Ajuster les étiquettes afin d'assurer la cohérence du design, c'est mettre la forme avant le contenu.
Laisse la cruelle règle du concepteur sur les envies de clarté de l'utilisateur.

2
Juan Lanus

Là où il y a un réel besoin de tronquer une étiquette, où placer les ellipses dépend des données. La valeur par défaut est normalement à la fin, mais pour certaines données, il est préférable de voir une partie du début et de la fin. Mais ce dernier prend plus de place car vous devez afficher suffisamment de caractères au début et à la fin. Pour d'autres données, les nombres par exemple, afficher les ellipses au début est préférable - si les derniers chiffres sont les plus significatifs. Cependant, vous devez concevoir pour essayer d'éviter cela, comme mentionné dans d'autres articles.

2
Paul

La nécessité de tronquer une étiquette est en quelque sorte un échec en soi, mais je sais que malgré nos meilleurs efforts, nous sommes coincés dans des situations inévitables.

Une possibilité consiste à utiliser des elipses à la fin de l'espace disponible, mais à en faire une chose semblable à un bouton (pas un bouton gris standard, mais quelque chose qui est évidemment cliquable mais se fond mieux avec le texte auquel il est attaché). Lorsque vous cliquez dessus, le "bouton" se développe dans le texte restant, qui a également ce style de "bouton". Lorsque vous cliquez sur le bouton "texte" développé, il se replie en bouton ellipses.

Au début, j'ai pensé faire un survol pour afficher le texte intégral, mais cela ne fonctionnera pas sur les appareils tactiles.

0
obelia