it-swarm.com.de

Was ist die richtige Benutzeroberfläche zum Anzeigen von Aktionen, die sich auf einen Link beziehen, ohne ihn zu behindern?

Ich möchte dem Benutzer erlauben, Statistiken anzuzeigen oder Links zu Links auf einer Website hinzuzufügen, aber das ist ein sehr seltener Anwendungsfall, da die meisten Benutzer niemals mit den Links interagieren würden, außer nur auf sie zu klicken, um zu ihrem Ziel zu gelangen. Was ist eine unauffällige Möglichkeit, die Aktionen zu präsentieren, ohne den primären Anwendungsfall abzulenken?

Beispiel:

Angenommen, ich habe auf einer Seite einen Link zum UX-Stack-Austausch. Die meisten Benutzer würden auf den Link klicken, um zu http://ux.stackexchange.com zu gelangen, aber ich möchte auch Benutzern das Gehen erlauben to http://mydomain.com/link/1/ um Statistiken und Tags anzuzeigen, die dem Link zugeordnet sind, oder klicken Sie auf http://mydomain.com/link/1/edit um dem Link Tags hinzuzufügen. 1 repräsentiert die eindeutige ID für diesen Link in der Datenbank. Ich kümmere mich derzeit darum, indem ich zwei kleine Symbole unter dem Link beim Schweben anzeige, aber ich habe mich gefragt, ob es einen eleganteren Weg gibt, dies zu tun.

3
shinzui

Am Ende habe ich eine kontextsensitive Tastenkombination implementiert, mit der Hauptbenutzer sie drücken können, wenn sie mit der Maus über den Link fahren, um das Menü aufzurufen. Ich mag die Lösung, da sie die linklastigen Seiten nicht überladen und Power-Usern die einfache Interaktion mit den Links ermöglicht.

1
shinzui

Ich schlage vor, Sie integrieren die Interaktion und einen modifizierten Stil einer geteilten Schaltfläche. Entfernen Sie die Schaltflächenaspekte des visuellen Designs, damit der Link normal angezeigt wird. Der Link (linke Seite des Split) geht zum href. Das Pulldown (rechte Seite des Split) wird beim Hover des Links angezeigt. Beim Bewegen wird es dunkler und beim Klicken wird ein kleines Menü mit Optionen angezeigt. Mouseout eines dieser Elemente und sie verschwinden.

enter image description here

Die Optionen können Links oder möglicherweise Symbole oder Symbole und Links sein. Ich war zu faul, um in diesem Beispiel Symbole zu erstellen.

4
Itumac

Wie wäre es mit einem kleinen (Bleistift?) Symbol neben dem Link? Wenn Sie darauf klicken, wird ein Inline-Popup mit Ihren 2 Aktionen angezeigt (Statistiken und Tags anzeigen, Tags hinzufügen). Dies würde es auch Touchscreen-freundlicher machen.

Wenn diese Aktionen nur für Site-Editoren und Betreuer gelten, würde ich das Symbol vor anderen Benutzertypen ausblenden.

1
Calvin Chong

wenn Sie der Meinung sind, dass die beiden kleinen Symbole unter dem Link die primäre Verwendung ablenken, ist dies möglicherweise hilfreich. Wenn der Benutzer den Cursor länger als ein Intervall (z. B. 5 Sekunden) auf den Link hängt, wird dies nur angezeigt kleines Symbol für eine andere Verwendung.

0
zinking

Ich denke, Sie machen das Richtige mit Ihrer aktuellen Benutzeroberfläche. Wenn Sie Platz haben, um zusätzliche Symbole oder Informationen im Layout zu betrachten, ist dies die weniger aufdringliche Methode. Das Schweben wird zu einer sehr verbreiteten Praxis, aber um Vertrautheit zu schaffen, ist es besser, es zu verstärken, indem Sie es in verschiedenen Teilen der Seite verwenden. Auf diese Weise wird das Schweben zum Äquivalent von "Weitere Aktionen/Informationen anzeigen" und wird für den Benutzer natürlich. Es ist keine schlechte Praxis, immer ein Symbol anzuzeigen (zum Beispiel zum Bearbeiten), aber es ist weniger subtil. Und da dieses Verhalten eher eine spezifische Verwendung ist, sehe ich nicht die Notwendigkeit, es immer präsent zu haben.

0
Yisela

Haben Sie einen Tooltipp in Betracht gezogen, mit dem der Benutzer interagieren kann, um die Links einzufügen? Die einzige Einschränkung wäre, dass Sie die Verwendung so einfach wie möglich gestalten sollten. Machen Sie es dem Benutzer nicht zur Herausforderung, den Cursor vom Link zum Tooltip zu bewegen, ohne dass der Tooltip deaktiviert wird und verschwindet!

Beispiel unten: Der obere Status ist die Verknüpfung des unteren Status mit dem Tooltip

Example tooltip

0
TJH