it-swarm-eu.dev

OK / Abbrechen links / rechts?

Sollte OK Schaltfläche links von Cancel Knopf oder umgekehrt?

Gibt es Studien, die eine der beiden Lösungen vorschlagen?

349
Art

Wie bei allem: Benutzertest! Zum Glück springt Usability-Held Jakob Nielsen hier in seinem Alertbox-Artikel über OK/Abbrechen-Schaltflächen :

Sollte die Schaltfläche OK vor oder nach der Schaltfläche Abbrechen stehen? Das Befolgen von Plattformkonventionen ist wichtiger als das Suboptimieren eines einzelnen Dialogfelds.

Kostya war genau richtig, wenn es darum ging, die Einhaltung der Plattformrichtlinien zu empfehlen. Aber was ist mit webbasierten Plattformen?

Wenn Sie eine webbasierte Anwendung entwerfen, ist die Entscheidung schwieriger, aber Sie sollten sich wahrscheinlich für die Plattform entscheiden, die von den meisten Benutzern bevorzugt wird. In Ihren Serverprotokollen wird der Prozentsatz der Windows- und Mac-Benutzer für Ihre spezifische Website oder Ihr Intranet angezeigt. Natürlich hat Windows im Allgemeinen viel mehr Benutzer. Wenn Sie also nicht die Mühe haben, die Protokolle zu überprüfen, lautet die Richtlinie, die für die meisten Situationen gilt, zuerst OK und zuletzt Abbrechen.

Er erwähnt auch zwei zusätzliche wichtige Richtlinien, die Sie beim Erstellen von OK/Abbrechen-Schaltflächen berücksichtigen könnten:

  • Es ist oft besser, eine Schaltfläche zu benennen, um zu erklären, was sie tut, als ein generisches Etikett zu verwenden (wie "OK"). Ein explizites Etikett dient als "Just-in-Time-Hilfe" und gibt den Benutzern mehr Vertrauen bei der Auswahl der richtigen Aktion.
  • Machen Sie die am häufigsten ausgewählte Schaltfläche zur Standardeinstellung und markieren Sie sie (außer wenn ihre Aktion besonders gefährlich ist; in diesen Fällen möchten Sie, dass Benutzer die Schaltfläche explizit auswählen, anstatt sie versehentlich durch Drücken der Eingabetaste zu aktivieren).
202
Rahul

Die Antwort finden Sie in den Richtlinien für die Benutzeroberfläche des von Ihnen verwendeten Systems.

Für Windows

Präsentieren Sie die Commit-Schaltflächen in der folgenden Reihenfolge:

  • OK/[Mach es]/Ja
  • [Tu es nicht]/Nein
  • Stornieren
  • Bewerben (falls vorhanden)
  • Hilfe (falls vorhanden)

Abbrechen befindet sich also immer rechts neben der Schaltfläche OK.

Für MacOS

Eine Schaltfläche, die eine Aktion auslöst, befindet sich am weitesten rechts. Die Schaltfläche Abbrechen befindet sich links von dieser Schaltfläche.

Für MacOS-Benutzer befindet sich Abbrechen also links neben der Schaltfläche OK.

Für Android

Die abweisende Aktion eines Dialogs befindet sich immer links. Abweisende Aktionen kehren zum vorherigen Status des Benutzers zurück.

Die positiven Maßnahmen sind auf der rechten Seite. Bestätigende Aktionen setzen den Fortschritt in Richtung des Benutzerziels fort, das den Dialog ausgelöst hat.

Für Android befindet sich Abbrechen links neben der Schaltfläche OK.

Für andere Systeme siehe Richtlinien.

142
Kostya

Denken Sie an die Metapher "Lesen". Westler lesen von links nach rechts, unser Gehirn ist so konditioniert, dass es von links nach rechts fließt. CANCEL ist im Grunde ein Schritt zurück (links) und OK/SUBMIT/YES/Etc. Sind ein Schritt vorwärts (rechts).

64
GoodShovel

Es scheint, dass die Windows OK/Cancel-Konvention eine Menge Gehirnkonditionierung für Benutzer bewirkt hat. Usability-Tests würden also sicherlich mit vielen Leuten herauskommen auf der Suche nach ein OK-Button links, Abbrechen rechts.

Das ändert aber nichts an dem grundlegendsten Instinkt von jemandem, der ohne Vorkonditionierung mit dem System interagiert. Mein Grundinstinkt besagt, dass sich die Schaltfläche OK/Genehmigung/Vorwärts bewegen, unabhängig davon, welche Farbe oder Größe Sie darauf anwenden, am rechten Rand des Dialogfelds befinden muss.

Betrachten Sie dieses Dialogfeld ohne Beschriftungen oder Farbmarkierungen:

enter image description here

Wo würdest du klicken? Ich würde auf die Schaltfläche am rechten Rand klicken, wenn ich das Formular senden möchte. Der Grund ist, dass ich vor Windows auf folgende Weise in meinen Instinkt konditioniert wurde:

  • Die englische Sprache fließt von links nach rechts.
  • Die Browsernavigation funktioniert Zurück (links) und Vorwärts (rechts). enter image description here
  • Alte 2D-Spiele wie Dangerous Dave bewegen den Charakter nach rechts, wenn sie weiter voranschreiten.

enter image description here

  • Die Zahlen in der Zahlenreihe nehmen nach rechts zu und nach links ab.

  • Die Atomgewichte im Periodensystem nehmen rechts zu.

  • Die Uhr tickt nach rechts.

  • Der Kalender erhöht die Daten rechts.

Ich denke, die Windows-Plattform hat mit OK/Cancel ein Anti-Pattern erstellt, das jetzt so weit verbreitet ist, dass es Usability-Studien validiert. Wenn Sie jedoch die oben genannten Faktoren berücksichtigen, halte ich es für gerechtfertigt und eine vertretbare Position, den primären Knopf rechts zu halten.

EDIT: Ein weiterer zu berücksichtigender Faktor ist die Konsistenz. Wenn Sie zusätzliche Schaltflächen in Ihren Dialogfeldern erwarten, hilft die primäre Schaltfläche am rechten Rand dabei, mit der Platzierung konsistent zu bleiben. Ein visuelles Beispiel würde dies deutlich machen:

enter image description here

39
Adnan Khan

Für Benutzer, deren Sprache von links nach rechts gelesen wird, würde ich empfehlen, die Schaltfläche OK links zu platzieren, da diese Benutzer dem ersten, was sie sehen, eine größere Bedeutung beimessen würden.

Dies würde es dieser Untergruppe von Benutzern ermöglichen, ihre Aufgabe so schnell wie möglich zu erledigen.

17
Ryan Shripat

IMHO spielt es keine Rolle, wo Sie die Schaltfläche "OK" platzieren: nach links oder rechts. Es spielt keine Rolle, welche Art von Benutzern Ihre Website besuchen (mit hebräischer oder arabischer Sprache). Es spielt keine Rolle, welche Art von Software sie verwenden. Die Statistiken sagen uns, dass 55% der Benutzer die Schaltfläche "OK" von rechts sehen möchten, aber wenn wir sie rechts platzieren, sind die anderen 45% der Benutzer unzufrieden.

Die beste Lösung besteht darin, die Schaltfläche "OK" hervorzuheben (stärker hervorzuheben als "Abbrechen"), und alle Benutzer geben die Schaltfläche "OK" einfach als wichtigere und primärere Schaltfläche an.

Google und andere Unternehmen verwenden diesen Ansatz in ihrer Software.

enter image description here

16
webvitaly

Luke Wroblewski schrieb ein Buch über Webformulare (Webformulardesign: Ausfüllen der Lücken) und behandelte auch einige Prinzipien wie: "Primäre und sekundäre Aktionen" (http: // www.lukew.com/resources/articles/psactions.asp) ), "Oben, rechts oder links ausgerichtete Formularbeschriftungen" (http: // www.lukew.com/ff/entry.asp?504) oder "Pfad zur Fertigstellung" usw. (Sie können auch http : //www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php )

IMO: Je nachdem, welche Etikettenplatzierung Sie haben (vorzugsweise vertikal) und welche Regeln von links nach rechts + von oben nach unten gelten, sollten Sie zuerst eine primäre Aktion (OK) und dann eine sekundäre (+) ausführen, um einen guten Weg zur Fertigstellung zu finden + Abbrechen)

BEARBEITEN: Platzierung von Etiketten in Formularen, von Caroline Jarrett, 2010 http://www.formsthatwork.com/files/Articles/labels-on-forms-for-uxlx-2010.pdf

15

Ich denke, jeder hatte einen guten Punkt gegeben, aber es gibt noch einen wichtigen Punkt, der hier erwähnt werden muss.

Schaltflächen wie OK/Senden/Speichern usw. werden als positive Aktionsschaltflächen bezeichnet. Ebenso werden Schaltflächen wie Abbrechen/Zurücksetzen usw. als negative Aktionsschaltflächen bezeichnet.

Um die Frage zu beantworten, haben die meisten von ihnen einige gute Punkte mitgebracht, aber hier ist eine andere Wahrnehmung, die darin besteht, dass Benutzertests einer Anwendung normalerweise die meisten Probleme entscheiden. Schließlich sind alle erstellten Anwendungen nur für Benutzer bestimmt.

Es wurden einige Augenmomenttests und Hitzetests an Benutzern durchgeführt, die je nach Verfügbarkeit des Labors durchgeführt wurden. Das beste Szenario ist, dass die meisten Benutzer die Webanwendung oder eine andere Anwendung von links nach rechts und von der oberen Ecke aus betrachten und nach unten scrollen, um wichtige Hotspots aufzunehmen und im Allgemeinen nach links unten zu enden Es ist immer gut, die positive Aktionstaste links und die negative Aktionstaste rechts zu halten.

Um nicht zu leugnen, dass es sich um Forschungsergebnisse handelt, die auf wenigen Benutzern basieren, ist es nicht erforderlich, dass dies immer gut funktioniert, aber meistens.

Ein weiterer wichtiger Punkt ist, dass zwischen positiven und negativen Aktionsschaltflächen mehr Platz sein sollte, damit Benutzer etwas mehr Zeit benötigen, um zu negativen Schaltflächen zu gelangen, und ihnen somit ausreichend Zeit zum Nachdenken und Reagieren geben.

Ich habe versucht, Punktepaare zu erklären, die auf meinen Erfahrungen und auf Forschungsarbeiten beruhen.

Kommentieren Sie, damit ich auch mehr erfahren kann.

Grüße Deepak Bajaj

9
Deepak Bajaj

Viele Anwendungen haben sich verschoben, um unterschiedliche Stile für die Schaltflächen OK und Abbrechen zu verwenden. Eine übliche Benutzeroberfläche besteht darin, die Schaltfläche OK, aber eine herkömmliche Schaltfläche zu haben, während die Schaltfläche Abbrechen eine Verknüpfungsschaltfläche ist. Dies ergibt eine sehr klare visuelle Unterscheidung zwischen den beiden, und obwohl der Benutzer auf OK klickt, hebt die visuelle Unterscheidung den Unterschied hervor und hilft dem Benutzer, die tatsächlich gewünschte auszuwählen.

Ich habe dies sowohl in Web- als auch in Desktop-Anwendungen gesehen.

7
Sam

Nur um die Argumentation zu klären:

Es wird als "korrekter" angesehen, die Hauptschaltfläche (OK) genau in der Ecke des Dialogfelds zu platzieren, da sie leichter zu treffen ist (es gab in der Vergangenheit mehrere Fragen/Diskussionen dazu).

Dies hängt jedoch auch davon ab, an was die Benutzer gewöhnt sind. Wenn Sie eine Site oder Anwendung für Windows-Benutzer erstellen, sollten Sie die Windows-Standards befolgen.

Stellen Sie sicher, dass "Enter" auf der Tastatur korrekt mit OK verknüpft ist - viele Leute werden das auch verwenden.

5
Dan Barak

Beeindruckend! So viele Antworten, die links oder rechts argumentieren.

Ich habe dies selbst getestet und festgestellt, dass sie statistisch nicht schlüssig sind.

Die beste Antwort, die ich gefunden habe, war, dass es nicht wirklich wichtig ist, in welche Reihenfolge sie gehen, solange die primäre Aktion klar markiert ist - ich benutze immer eine bunte Schaltfläche für [Mach es]/go/submit/etc und nur einen kleineren Text Schaltfläche für [Nicht tun]/Abbrechen/Löschen/etc.

Sehr ähnlich wie die Schaltflächen "Antwort veröffentlichen" und "Verwerfen" am unteren Rand eines Antwortformulars hier auf UX StackExchange!

4
Andrew Martin

Sie finden eine interessante Meinung hier ; Anthony T. schlägt vor, die Schaltfläche "OK" rechts neben "Abbrechen" zu platzieren:

Mit der Schaltfläche "OK" auf der rechten Seite sind die visuellen Fixierungen geringer und fließen in eine Richtung [...]

Vergleichen Sie dies mit der primären Aktion rechts im Dialogfeld und der sekundären Aktion links im Dialogfeld. Benutzer beginnen mit ihren Augen auf die sekundäre Aktion und bewegen ihre Augen auf die primäre Aktion, um auf die Schaltfläche zu klicken. Dadurch werden insgesamt zwei visuelle Fixierungen in einer Richtung erstellt, sodass Benutzer einen schnelleren visuellen Fluss erhalten. Benutzer fixieren jede Schaltfläche nur einmal und enden auf der primären Aktionsschaltfläche. Wenn Sie die primäre Aktion nach links setzen, wird dies für Benutzer möglicherweise einfacher zu erreichen. Wenn Sie jedoch die Geschwindigkeit in Bezug auf die mentalen Prozesse und visuellen Fixierungen des Benutzers betrachten, ist das Platzieren der primären Aktion rechts in einem Dialogfeld tatsächlich schneller.

4

Bei ASP.NET-Webanwendungen habe ich, nachdem ich viel Aspirin für die Behandlung von Problemen mit Standardschaltflächen verwendet habe (was auch immer ausgelöst wird, wenn die Eingabetaste gedrückt wird), einfach meine Standardschaltfläche links platziert, sodass sie im Markup an erster Stelle steht.

Verschiedene Browser behandeln mehrere Senden-Schaltflächen unterschiedlich, wenn die Eingabetaste gedrückt wird (insbesondere, wenn sich der Cursor zum Zeitpunkt der Eingabetaste in einem Textfeld befindet). Einige Browser verwenden nur die erste Schaltfläche im Markup, um das Formular zu senden. Dies ist möglicherweise nicht das, was Sie möchten (insbesondere, wenn Sie anschließend etwas auf der Serverseite tun müssen).

Wenn Sie kein benutzerdefiniertes Javascript verwenden, um Standardschaltflächenszenarien zu verarbeiten, und sich auf das Standardverhalten des Webbrowsers verlassen, sollten Sie die Standardschaltfläche wahrscheinlich links platzieren.

4
Adam Toth

Wenn möglich, würde ich vorschlagen, die Abbrechen-Schaltfläche ganz wegzulassen, um Ihr Dilema zu lösen. - Es ist manchmal unnötig und wird oft versehentlich aktiviert.

Von http://www.nngroup.com/articles/reset-and-cancel-buttons/ :

Die meisten Webformulare hätten die Benutzerfreundlichkeit verbessert, wenn die Schaltfläche Zurücksetzen entfernt worden wäre. Schaltflächen zum Abbrechen sind im Web häufig auch von geringem Wert .

Bieten Sie eine Schaltfläche Abbrechen an, wenn Benutzer befürchten, sich zu etwas verpflichtet zu haben, das sie vermeiden möchten. Ein expliziter Weg zum Abbrechen bietet ein zusätzliches Sicherheitsgefühl, das nicht durch einfaches Verlassen erreicht wird.

Abbrechen ist hauptsächlich nützlich für mehrstufige Dialoge, in denen der Benutzer eine oder mehrere Seiten mit Aktionen überschritten hat. Zu diesem Zeitpunkt werden diese Aktionen durch Drücken der Schaltfläche Zurück nicht rückgängig gemacht. Es ist besser, wenn der Benutzer auf Abbrechen klickt.

4
Adam George

Letztendlich (insbesondere nach dem Lesen aller obigen Antworten) sehe ich, dass diese Diskussion auf Plattformkonvention und "objektive" Benutzerfreundlichkeit hinausläuft. Was ich unter "objektiv" verstehe, ist, wie nützlich etwas für Benutzer wäre, die mit keiner Betriebssystemkonvention vertraut sind. Genauer:

OK rechts
Dieses Muster gewinnt zweifellos im objektiven Usability-Argument, wenn Benutzer nicht an die weniger verwendbare Windows-Konvention gebunden sind (siehe Artikel ). Wie in dem Artikel erläutert, ist das OK auf der rechten Seite mit unserer Konvention zum Lesen von links nach rechts und einem effizienteren Aufgabenfluss ein besseres Eckziel, auch die Tatsache, dass wir Zeitleisten als von links nach rechts verlaufend betrachten (daher) Ein 'Zurück'/'Abbrechen' auf der rechten Seite ist sinnvoll, da es sich um ein Zeitmuster handelt.

OK links
Windows-Konvention

Es ist eine unglückliche Realität, aber schlecht gestaltete Muster (wie z. B. OK auf der linken Seite) können zu einer Konvention werden, und Benutzer werden sie erwarten. Der Versuch, etwas anderes zu tun, auch wenn es objektiv ein brauchbareres Muster ist, führt zu einer schlechten Benutzerfreundlichkeit. Ein klassisches Beispiel ist das metrische vs. imperiale Messsystem - das metrische System bietet alles, was die Benutzerfreundlichkeit, die einfache Umrechnung von Einheiten usw. betrifft. Aber wenn Sie Kleinstadtamerikaner dazu zwingen, in Metern und Zentimetern zu denken, wenn sie an Zoll/Fuß gewöhnt sind, erhalten Sie eine schlechte Benutzerfreundlichkeit und sehr frustrierte Benutzer. Ich denke, die Lektion besteht darin, sehr hart zu arbeiten, um sicherzustellen, dass wir niemals schlechte Konventionen einführen!

Persönlich, wenn ich für das Web entwerfe, setze ich den OK-Knopf links und bestehe darauf, meine Größe in Zentimetern und mein Gewicht in Kilogramm anzugeben, selbst wenn ich mit imperialistischen Leuten spreche. Es ist wirklich ein Zermürbungskrieg, aber langsam wird das imperiale System absterben, und hoffentlich wird auch die Konvention "OK auf der linken Seite" der Fenster :)

3
M.A.X

Ich würde mit "Ok" auf der rechten Seite gehen. Wegen der westlichen Leserichtung, die von links nach rechts geht. Und "Abbrechen" würde Sie nicht weiterbringen, "Ok" jedoch.

Aber ein ganz anderer Ansatz. Verwenden Sie nicht "Ok" und schreiben Sie auf die Schaltflächen, was sie tun. Zum Beispiel erfordert "Speichern" oder "Nicht speichern" nicht, dass der Benutzer den Beschreibungstext liest. Spart Zeit und verhindert Eingabefehler.

2
erikrojo

Lol Ich kann nicht anders als über viele dieser Antworten zu lachen. Es scheint ein Fall zu sein, in dem man den Wald vor lauter Bäumen nicht sieht. Wie bei jedem UX-Problem hängt es grundsätzlich davon ab, wie das Formular aufgebaut ist. Beispiel: Beschriftungen oben, Felder unten oder Beschriftungen links daneben. Schauen Sie sich die gesamte Seite an und wie die Augen eines Benutzers über das Formular fließen. Gibt es eine klare Sichtlinie zum letzten "Senden" -Button?

Wie bereits in einem früheren Beitrag erwähnt, enthält das Luke Wroblewski-Buch über Webformulare Webformular-Design: Das Ausfüllen der Lücken einige der besten Ratschläge für die Erstellung von Webformularen sowie ein großartiges Paradigma von Formularen aus Anwendersicht - Formulare sind Mittel zum Zweck und werden aufgrund des beabsichtigten Endergebnisses toleriert (dh etwas kaufen, ein Konto erstellen, um Zugriff auf irgendwo zu erhalten usw.). Benutzertest, AB Test ja natürlich wenn du kannst. Das ultimative Ziel ist, je einfacher Ihr Formular ist, desto besser auszufüllen.

2
mike

Ich mag einige der Seiten, auf denen es KEINE Schaltfläche (visuell) für negative Aktionen gibt, nur einen Link. Auf diese Weise muss ich keine Zeit damit verschwenden, Knöpfe zu betrachten. Ich weiß mehr als, dass der Knopf dies tut. Und wenn ich weiß, dass ich nicht tun möchte, was die Seiten von mir verlangen, nehme ich mir etwas Zeit, um zu sehen, wie es am besten wäre, weiterzumachen (suchen Sie nach der Schaltfläche zum Schließen, zum Abbrechen der Schaltfläche).

also statt:

[NOOOOO!] [KLICK MICH! KLICK MICH!]

da würde sein:

Nein danke! [Ja, bitte!]

Auf diese Weise ist es nicht wirklich wichtig, wo Sie Ihren Knopf positionieren, es gibt visuell nur einen und ist daher leicht zu finden.

1
fallenboy

In meinen Apps verwende ich visuelle Farben, um den Zweck der Aktionsschaltfläche hervorzuheben. Dann egal ob links oder rechts. Ich persönlich bevorzuge es, den "OK" -Button rechts zu haben (weil ich Rechtshänder und/oder OSX-Benutzer bin - und eigentlich ist dies ein Link ..)

  • großer grüner Knopf zur Validierung
  • großer roter Knopf zum Löschen
  • (groß oder nicht) graue Taste zum Abbrechen
1
Marc D

Für mich wäre das die logische Reihenfolge:

<LeftRight>

<PreviousNext>

<BackForward>

<BackDone

Do nothingDo it

CancelOK

Außer OK sollte durch die eigentliche Aktion wie ersetzt werden SaveDeleteAcceptExit oder Send.

Wenn ich Leute treffe, die für das Putten streiten OK links bitte ich sie immer zu platzieren Left vs. RightPrevious vs. Next, und Back vs. Forwardund lassen Sie sie streiten, warum sie sie in diese Reihenfolge bringen, bevor sie streiten, warum OK sollte auf der linken Seite sein.

1
Ole Tange

Verwenden Sie in der Reihenfolge der Priorität die erste verfügbare Lösung:

  • plattformrichtlinien
  • anfang bis Ende (wobei der Anfang für westliche Sprachen normalerweise links bleibt, jedoch unterschiedlich sein kann, z. B. beginnt Arabisch rechts und endet links)
  • die Art und Weise, wie Ihr Benutzer es am meisten erwartet

Bei Bildschirmleseprogrammen und ähnlichen Tools für Barrierefreiheit kann die Hauptaktion am Anfang (in westlichen Kulturen verbleiben) solchen Benutzern mit besonderen Bedürfnissen viel Zeit sparen!

1
straya

Natürlich gibt es viele Argumente für und gegen beide Seiten.

Ich würde es aber so ausdrücken. "Glauben Sie, dass eine negativ-positive Platzierung die beste ist? Nein oder Ja?"

Der Punkt ist, dass "Ja oder Nein" beim Sprechen besser fließt, was wahrscheinlich erklärt, warum Microsoft die Reihenfolge der positiv-negativen Schaltflächen gewählt hat.

Auf der ANDEREN Seite wird der negativ-positive Fluss häufig in Rhetorik und Debatten verwendet, um dem positiven Argument Gewicht zu verleihen und es im Kopf einer Person frisch zu halten. "Wollen Sie sehen, wie Ihre Kinder unter der gegnerischen Partei leiden? Oder möchten Sie für unsere Partei stimmen und Ihre Zukunft sichern?" Und so weiter.

0
Seth Jeffery

Unter der Annahme, dass die Entscheidung getroffen werden muss, ob die positive Aktion links oder rechts verfügbar sein soll, und unter Berücksichtigung der Tendenz, bestimmte Betriebssysteme oder physische Geräte (Bücher), abstrakte Konstrukte (Ablauf des Assistentenformulars) usw. zu verwenden, die Verhaltenswissenschaft scheint darauf hinzudeuten, dass die Option ganz links als erste Wahl häufiger gewählt wird.

Dies bedeutet, dass eine positive Aktion (OK oder explizite Aktionsbezeichnung) links bevorzugt werden sollte, wenn keine anderen Faktoren berücksichtigt werden.

Quelle: Zählen nur Menschen von links nach rechts?

0
too