it-swarm.com.de

Sollte "Ja, lösche es" rot oder grün sein?

Beim Entwerfen einer Schnittstelle für ein CMS (Content Management System) bin ich auf ein Paradox gestoßen und bin etwas verwirrt darüber, was zu tun und warum es zu tun.

Kontext

Vor dem Löschen eines Albums wird der Benutzer aufgefordert, die Aktion zu bestätigen.

Grün "Ja"

First option

Rot "Ja"

Second option

Welche Option ist für den Benutzer intuitiver?

787
Diéssica

Beide Wege scheinen ein falsch positives Paradigma zu sein. Dies kann einfacher sein und muss den Benutzer nicht zwingen, Zeit damit zu verbringen, die Zuordnung von Farbe zu Etikett zu verstehen.

Machen Sie einfach die Schaltfläche "Löschen" deutlicher. Machen Sie die Schaltfläche "Abbrechen" weniger hervorgehoben. In Bezug auf die Beschriftung innerhalb der Schaltflächen muss nicht viel Kontext in die im Wesentlichen einfachen Aktionen (Nein/Ja? Oder Abbrechen/Löschen) eingefügt werden, da dies mehr Verarbeitung seitens des Benutzers erfordert.

enter image description here

Benutzer verknüpfen normalerweise eine Aktion wie "Entfernen" oder "Löschen" mit Rot. Und bieten Sie wie immer eine Möglichkeit, die Aktion abzubrechen.

1358
jnmnrd

Ich bin mir nicht sicher, ob Sie nur in Rot und Grün denken sollten. Rot war in der Regel mit Gefahr verbunden und geht möglicherweise auf das Mittelalter zurück (Zitieren erforderlich). Eine schnelle Google Bildsuche für "Löschen" ergibt fast ausschließlich rote Bilder.

Für mich (und für Bootstrap ) bedeutet Grün Erfolg, Rot bedeutet Gefahr.

(Bootstrap buttons

Da das Löschen eine gefährliche Aktion ist, würde ich empfehlen, die Löschtaste rot zu halten. Sind Sie auf die Verwendung von Grün/Rot beschränkt? Wenn ja, würde ich empfehlen, Ihr zweites Bild zu verwenden. US-Ampeln zeigen mir an, dass Grün "Weiter" bedeutet. Mit dieser Begründung könnte man sagen, dass ein grüner "Nein, behalte es" -Button "Nein, behalte es und fahre fort" und ein rotes "Ja, lösche es" bedeutet "Ja, lösche es, obwohl es gefährlich ist". Wie auch immer, ich würde in Betracht ziehen, die Schaltfläche "Nein, behalte sie" blau zu machen, da es sich um eine ziemlich standardmäßige Aktionsfarbe handelt (zum Beispiel ist es die Standardfarbe für nicht gestaltete Links).

Bearbeiten : Ich denke @ JNMNRD hat die beste Antwort darauf. Hier ist das Bild von @ JNMNRD ohne Worte. Können Sie erkennen, welche Schaltfläche Löschen bedeutet?

Delete

321
circuitry

Wenn Sie dies aus einem etwas anderen Blickwinkel betrachten, können Sie nach Möglichkeit die Bestätigung vollständig entfernen und stattdessen zu einem "Do/Undo" -Prozess wechseln.

Diese Methode wird häufig in allen Google-Diensten verwendet:

enter image description here

Es hat den Vorteil, dass es kulturell neutral und effizienter für den Benutzer ist (ein Klick statt zwei zum Löschen).

Nachteil ist, dass es sich um eine vorübergehende Verbindung handelt und diese überschrieben wird, wenn eine andere Aktion ausgeführt wird - beispielsweise wenn eine andere E-Mail als Spam gemeldet wird. Es wird auch verworfen, sobald Sie sich abmelden, den Fokus verlieren oder aktualisieren.

Um diese Nachteile zu vermeiden, können Sie in Betracht ziehen, eine Art Papierkorbfunktionalität in die Website aufzunehmen, ähnlich wie dies SharePoint tut.

221
Graham Wager

Bei allem Respekt denke ich, dass jede Antwort bisher die Marke etwas verfehlt hat.

Zunächst basierend auf dem Abschnitt Kontext Ihrer Frage ...

Kontext

Vor dem Löschen eines Albums wird der Benutzer aufgefordert, die Aktion zu bestätigen.

... wir können daraus schließen, dass dies kein Erfolg oder Fehler ist. modal, sondern es ist eine Bestätigung modal, die ein impliziert ) Warnung oder Vorsicht Farbe wie gelb , nicht grün oder rot , als Erfolg und Fehler Farben implizieren jeweils. Und da es ein Bestätigungsmodal ist, sollte sich der Wortlaut wahrscheinlich in etwas ändern wie:

Bitte bestätigen Sie das Löschen dieses Albums:

Um die Benutzerfreundlichkeit des Bestätigungsmodals zu fördern, können Sie ermutigen die Schaltfläche Bestätigen Sie , um sie etwas besser hervorzuheben. Und für diejenigen, die Farbenblindheit oder Leseprobleme haben , ich setze normalerweise ein Symbol passend zu dem, was bestätigt wird. In diesem Fall scheint ein Mülleimer zu passen.

Wenn Sie all das zusammenzählen, sehen Sie hier ein Beispiel dafür, was Sie erhalten:

confirmation modal


Update basierend auf Kommentaren zum Wortlaut der Buttons ...

Ich habe schon seit einiger Zeit über den Wortlaut nachgedacht. Die Kommentare tendieren dazu, Delete anstelle von Confirm , aber ich denke, es gibt etwas Besseres. Da das Symbol ein Mülleimer ist und wir über sprechen ein Album loswerden , ich denke, der Wortlaut sollte übereinstimmen dass stattdessen.

Also habe ich darüber nachgedacht und mir Keep und ausgedacht. Papierkorb stattdessen. Beide stimmen mit der Frage überein, ob das Album gelöscht oder die Aktion abgebrochen werden soll, ganz zu schweigen davon, dass die Farben für farbenblinde Benutzer immer noch funktionieren. Die ermutigte Festung macht deutlich, was die Standardaktion ist, und zusammen ergeben die Wörter 100 % klar, welche Aktion man bestätigt.

updated confirmation modal

132
Code Maverick

Benutzer überlegen eher zweimal, bevor sie auf etwas Rotes klicken. Für welche der beiden Optionen möchten Sie, dass sie zweimal überlegen, bevor Sie auf klicken?
Welche der beiden Optionen löst möglicherweise irreversibelere Ereignisse aus?

Quelle: http://en.wikipedia.org/wiki/Red#Warning_and_danger

43
Rolf

Nachdem ich Ihre Fragen und die aktuellen Antworten durchgelesen hatte, habe ich ein wenig recherchiert und festgestellt, dass es Hinweise darauf gibt, dass die Präferenz für die Farbe Rot beim Menschen wie bei anderen nichtmenschlichen Primaten davon abhängt, ob der Kontext freundlich oder feindselig ist ( Maier et al., 2009 und Folgestudien).

Wie in der Zusammenfassung zusammengefasst (Schwerpunkt Mine):

Drei Experimente wurden zur Farbpräferenz unter Verwendung eines spontanen Auswahlparadigmas mit Säuglingsteilnehmern durchgeführt.

Experiment 1 zeigte, dass die Teilnehmer in einer freundlichen Laborumgebung Rot gegenüber Grün bevorzugen.

Experiment 2 zeigte, dass die Präferenz der Teilnehmer für Rot mit dem Kontext variiert, in dem die Farbe präsentiert wird: Rot wird in einem gastfreundlichen Kontext (nach einem glücklichen Gesicht) bevorzugt, aber nicht in einem feindlichen Kontext ( nach einem wütenden Gesicht). Das entgegengesetzte Muster wurde für die Kontrollfarbe Grün gefunden.

In Experiment 3 wurde dieselbe Kontextmanipulation verwendet, jedoch wurde eine zweite Kontrollfarbe, Grau, hinzugefügt, um klar zu untersuchen, ob der Kontext nur die Präferenz für Rot beeinflusst. Wie vorhergesagt, wurde bei einer zweiten alternativen Wahl eine kontextabhängige Präferenz für Rot, aber nicht für Grün oder Grau gefunden. Diese Ergebnisse stellen den ersten Beweis für Kontextmoderation in der Literatur zu Farbpräferenzen dar.

(PsycINFO-Datenbankeintrag (c) 2012 APA, alle Rechte vorbehalten)

Man fragt sich, ob der Kontext dieser Aktion - etwas zu löschen - ausreichen würde, um es in ein "feindliches" Gebiet zu bringen. Meine Intuition ist, dass es wäre, wenn das Löschen versehentlich wäre (Benutzer klickt auf "Löschen", erkennt, dass er es nicht vorhatte und eine letzte Chance erhält, seine Arbeit zu speichern), und möglicherweise immer noch, selbst wenn dies der Fall ist waren absichtlich (Benutzer frustriert darüber, eine weitere Hürde auf dem Weg zum Ziel überwinden zu müssen?).

28
Jessica Yang

Was ist der bestehende Standard im Rest Ihrer Anwendung? Verwenden Sie rote Schaltflächen, um "Ich möchte diese Aktion ausführen" anzuzeigen, und grüne, um "Diese Aktion abbrechen" anzuzeigen? Oder ist es umgekehrt?

Wenn es so ziemlich jede Software ist, die ich je gesehen habe, dann ist mein Geld grün für "mach weiter und mach es" und rot für "abbrechen! Abbrechen!".

Während "rot" für "Warnung" ein fairer Punkt ist, ist sein Platz vor Erreichen dieses Stadiums - machen Sie den ursprünglichen "Löschen" -Button rot. Sie fragen hier jedoch nach der Bestätigungsphase, in der immer "Weiter" und "Abbrechen" konsistent behandelt werden soll, unabhängig davon, wie der Vorgang fortgesetzt oder abgebrochen wird. Wenn Rot normalerweise "Abbrechen", aber manchmal "Weiter" ist, führen Sie nur zu Verwirrung bei den Benutzern.

18
Dave Sherohman

Sie können einen primären und einen sekundären Aufruf zum Handeln festlegen.

Beispiel von LinkedIn:

example

Dies bietet eine einzelne und offensichtliche Bestätigungsaktion , die der Benutzer ausführen kann, ohne die störende Sorge um Zugänglichkeit, kulturelle Vorurteile und Entscheidungsverwirrung, die durch die Aufteilung der Optionen entstehen kann Farbe allein.

Auch wie es im obigen Beispiel geschrieben ist, ist sehr klar. Wie die Frage umformuliert werden kann, lässt keine Unklarheit:

Möchtest du dieses Album wirklich löschen? JA/Abbrechen

Denken Sie auch an den Benutzerfluss. Es ist keine gute Praxis, eine absolute Aktion ohne Ausfallsicherheit bereitzustellen.

rückgängig machen

Quelle: Was sind einige Alternativen zum Satz "Möchten Sie wirklich XYZ" in Bestätigungsdialogen?

Hier ist auch eine andere Möglichkeit, die Möglichkeit zum Löschen bereitzustellen:

example

Benutzer können in Bestätigungsfenstern Fehler machen. Wenn der Benutzer etwas Wichtiges löschen möchte, das er niemals zurückbekommt, ist es wichtig, dass Sie sicherstellen, dass die Benutzer absolut sicher sind, bevor sie fortfahren. Anstatt den Benutzern eine Bestätigungsschaltfläche zu geben, die sie versehentlich drücken könnten, geben Sie ihnen ein Textfeld und bitten Sie sie, das Wort "Löschen" zur Bestätigung einzugeben. Wenn der Benutzer "Löschen" in das Textfeld eingibt, besteht kein Zweifel daran, dass er löschen möchte. Es erfolgt kein versehentliches Drücken der Löschtaste. Es gibt kein Bedauern, wenn der Benutzer löscht, da das Bestätigungstextfeld sicherstellt, was er tun wird, bevor er es tut.

Quelle: http://uxmovement.com/buttons/how-to-make-sure-users-dont-accidentally-delete/

17
Pdxd

Meine Lösung zum Löschen von Dingen ist eine Schaltfläche mit einem Papierkorbsymbol, das ein kleines Popover öffnet. Ich denke, das ist eine gute Lösung, weil:

  • kein störender Dialog, jeder hasst Bestätigungsdialoge!
  • bestätigung ist erforderlich. Keine versehentlichen Klicks
  • benutzer muss nur zwei Wörter lesen, keine nervige Frage
  • die rote Farbe zeigt an, dass es wirklich gelöscht wurde. Sie können es durch Hinzufügen von "irreversibel" zum Löschen aktivieren
  • Minimum an Maus- und Augenbewegungen
  • minimum an Platzverschwendung
  • kein Kontextwechsel

screenshot## Heading ##

13
daniel

Grün wird normalerweise in Schnittstellen und Orten verwendet, um "go", "continue" oder "yes" zu kennzeichnen. In Ihrem Fall ist dies genau das, was der Benutzer versucht. Sie setzen ihre vergangene Aktion fort (die darin bestand, auf die Schaltfläche Löschen zu klicken). Rot wird als Stopp angesehen, wie "Stopp, ich habe meine Meinung geändert!"

In Ihrem Fall würde ich mich an das halten, was Benutzer gewohnt sind: Grün für Fortfahren und Rot für Abbrechen.

10
Mike

Warum müssen sie zwei verschiedene Farben haben? Es scheint, dass dies die Dinge aufgrund kultureller Unterschiede und anderer Probleme, die angesprochen wurden, komplizierter macht (obwohl ich nicht sicher bin, was das Publikum für diese Anwendung oder Website ist. Vielleicht also zum größten Teil kulturelle Unterschiede, sind irrelevant, wenn es sich um eine sehr spezifische Benutzerbasis für eine Anwendung handelt).

Wie bereits erwähnt, sollten Sie die primäre Aktionstaste stärker hervorheben und die Schaltfläche Abbrechen weniger hervorheben. Wenn Sie beispielsweise in iTunes eine Musikdatei löschen, enthält das Eingabeaufforderungsfenster eine graue Schaltfläche für die Schaltfläche "Abbrechen" und die primäre Aktionsschaltfläche ist blau. Die Farbe ist nicht nur blau, sondern pulsiert auch, um die Aufmerksamkeit darauf zu lenken.

In Ihrem ersten Beispiel wirken die Schaltflächenbeschriftungen auch wortreich. Sie fragen sie bereits: "Möchten Sie dieses Album wirklich löschen?" Warum beschriften Sie die Schaltflächen nicht einfach mit "Nein" und "Ja" oder "Abbrechen" und "Löschen"?

9
Dmacatude

Grün sollte immer positiv sein und sich auf die Option "Ja, mach weiter" beziehen, also sollte es grün sein. Die Tatsache, dass Sie etwas löschen, anstatt es zu erstellen, ist unerheblich.

Rot ist es gewohnt, "Nein, ich habe es mir anders überlegt" oder "Nein, ich möchte nicht, dass du das tust", was auch immer "das" ist.

7
Dave Murray

Schaltflächen werden zum Senden/Senden von Informationen oder zum Ergreifen von Maßnahmen verwendet, nicht zum Auffordern von Untätigkeit. Die einzige Schaltfläche sollte eine sein, die durch den Fluss verläuft. Jede andere Aktion sollte durch einen Link dargestellt werden. In diesem Zusammenhang würde ich die Verwendung einer Schaltflächenfarbe befürworten, die an keiner anderen Stelle auf der Website verwendet wird oder die nur den schwerwiegendsten Aktionen vorbehalten ist. Ich nehme an, das wäre rot. Der Punkt besteht darin, den Benutzer aus einem passiven mentalen Zustand des Klickens auf Schaltflächen der Farbe X in Position Y (grün, unten rechts) zu zwingen und ihn dazu zu bringen, explizit zu fragen: "Was wird dies tun?"

7
Matt Langan

Verwenden Sie für eine solche Aktion keine Farbe. Beide Aktionen sind gleich wichtig. Möglicherweise hat der Benutzer versehentlich auf "Löschen" geklickt, oder der Benutzer möchte das Album wirklich "löschen".

Farbe ist in einem solchen Szenario eine unnötige Ablenkung und hilft nicht im Kontext.

Lassen Sie den Text auf den Schaltflächenbeschriftungen die Aktionen bestätigen: "Abbrechen" und "Album löschen"

4
Sumi

@JNMNRD hat die beste Lösung.

Normalerweise sollte die Aktion, die Benutzer ausführen sollen, rechts platziert werden. Da dies eine Bestätigungsmeldung ist, sollte die Löschaktion rechts platziert werden.

Indem Sie den verschiedenen Aktionen zwei Farben zuweisen, geben Sie ihnen in gewisser Weise dieselbe Hierarchie. Wenn Benutzer bereits eine zu löschende Aktion ausgeführt haben und dies nur eine Bestätigung ist, sollten Aktionen nicht miteinander konkurrieren. Dies sollte nur zu Validierungszwecken funktionieren.

Aus diesem Grund ist es am nützlichsten, die Option "Abbrechen" neutral zu lassen, da Ihr Benutzer die Anweisung liest und sich sofort auf die Schaltfläche "Löschen" konzentriert. Wenn er es jedoch bereut, hat er dennoch die Möglichkeit, den Vorgang abzubrechen.

1

Tatsächlich mag ich die Benutzererfahrung von Github beim Löschen eines Projekts sehr. Die Farbe der Typografie wird zusammen mit dem Rand in Rot geändert, was deutlich darauf hinweist, dass eine Gefahr besteht.

(enter image description here

Github zeigt ein Popup an, um sicherzustellen, dass der Benutzer das Projekt oder Repository wirklich löschen möchte.

(enter image description here

0
Pir Abdul