Welche Farbkombination würde für diese drei Tasten am besten funktionieren:
Sollen alle die gleiche Farbe behalten?
Dies sind meine Optionen:
Bild der ganzen Seite
Die Go - Taste sollte größer sein und den höchsten Kontrast von allen haben , da sie die primäre ist.
Die Schaltfläche „ Löschen “ ist in Ordnung, da es sich um eine sekundäre Aktion handelt , die neutral sein sollte .
Für mich hat der Switch- Button sowohl in Größe als auch Kontrast zu viel Präsenz . Ich würde es zwischen den Origin-Destination-Dropdowns positionieren, wo es "von selbst" mehr Sinn macht.
Hier zwei ähnliche Lösungen, die für mich viel sauberer sind und für diesen speziellen Zweck eine bessere Benutzerfreundlichkeit bieten (ich persönlich würde die erste wählen ):
Wenn die Schaltfläche „Löschen“ nur diese beiden Felder (von/bis) löscht, scheint dies nicht erforderlich zu sein, da die Benutzer sowieso auf jedes Dropdown klicken und die Auswahl treffen müssen, und dies ändert sich nicht, wenn Sie eine Schaltfläche „Löschen“ hinzufügen .
Wenn dies der Fall ist, empfehle ich, es zu entfernen, damit Sie eine sauberere Benutzeroberfläche erhalten und verhindern, dass Benutzer eine Aktion ausführen, die keinen Mehrwert für sie bringt (und außerdem unbeabsichtigt entfernen, was sie ausgewählt haben).
Eine Lösung besteht darin, Ihre Schaltfläche visuell nach Priorität zu trennen.
Sie haben normalerweise primäre Schaltfläche(n), sekundäre Schaltfläche(n) und manchmal tertiäre Schaltfläche(n) und/oder nicht bevorzugte Aktionsschaltflächen.
Für Primär und Sekundär schlage ich normalerweise Ihre bevorzugte Branding-Farbe (rein subjektiv) in zwei Kontraststufen vor. Hoher Kontrast für primär, etwas weniger Kontrast für sekundär.
Tertiäre Schaltflächen versuche ich normalerweise zu vermeiden und verwende stattdessen ein völlig anderes visuelles Element, z. B. einen Link.
Angesichts Ihres Beispiels und der Interpretation des Kontexts nach bestem Wissen und Gewissen würde ich Folgendes vorschlagen:
Das ist nur ein wirklich schnelles Beispiel, und Sie müssten bestätigen, dass der Kontrast den Zugänglichkeitsrichtlinien entspricht und nicht deaktiviert aussieht (was bei mir irgendwie der Fall ist, also muss es optimiert werden), aber hoffentlich bringt es den Punkt auf den Punkt.
UPDATE: Ich habe gerade bemerkt, als ich dies gepostet habe, dass dies das Muster ist, das StackExchange beim Erstellen eines neuen Posts verwendet. Die SAVE-Schaltfläche ist primär, CANCEL ist tertiär und wird eher als Link als als Schaltfläche angezeigt.
Kontrastreiche (z. B. schwarz-weiße) Farben sind immer am besten, was die orange Option irgendwie eliminiert. Und wenn Sie dem Mix ein bisschen Marketing hinzufügen, welches Farbschema wird für den Rest Ihrer Seite in Bezug auf Schaltflächen und Anwendungen verwendet? Aber wenn ich mich entscheiden müsste: Go: grün; Schalter...: marineblau; Klar: schwarz-weiß. Denken Sie daran, dass die Farbe auch mit der Präferenz zusammenhängt.
(Off-Topic: Sie könnten die lange Beschriftung zum Umschalten durch eine mit Symbolen beschriftete Schaltfläche zwischen den beiden Feldern eliminieren.)
Ich würde sagen, ändern Sie den Kontrast eines ähnlichen Farbtons, um Betonung zu zeigen . Wieso den? ( 1 von 12 Männern ist farbenblind und 1 von 200 Frauen ist auch farbenblind
Sie möchten Benutzer auch zum beabsichtigten Pfad durch das System führen, daher würde ich die Schaltfläche "Los" dunkler machen. Sie könnten alle Schaltflächen scannen und bearbeiten oder sie könnten etwas wie eine dunklere Farbe oder eine größere Größe haben, um sie zur beabsichtigten oder zu 80% häufigsten Wahl zu locken, so dass sie zuerst dort hinschauen und sagen, ja, das ist es, was ihnen Zeit spart.
Dieser Artikel sagt, dass man den wichtigsten Button so aussehen lassen sollte
Siehe ihr Beispiel unten
Sieht nicht so gut aus wie das Bild unten (Meiner Meinung nach)
In diesem Artikel wird auch erwähnt , Schaltflächen in einer vernünftigen Reihenfolge anzuordnen . Meiner Meinung nach würde ich also die Go-Taste rechts platzieren, weil englischsprachige Benutzer von links nach rechts (also schauen sie natürlich nach rechts nach Endzeichen). Ich würde es für arabische Benutzer auf die linke Seite setzen. So würde ich es für einen englischen Markt arrangieren.
Ein letztes Thema in diesem Artikel ist Machen Sie es schwieriger, destruktive Schaltflächen zu finden . In Ihrem Szenario würde ich Ihre Bestellung so ändern, wenn Sie auf „Los“ klicken und versehentlich links daneben liegen, würden Sie möglicherweise den Versandort ändern, anstatt die Aktion zu zerstören. Sie können die destruktive Aufgabe auch bestätigen, wenn Sie es für notwendig halten (dh sind Sie sicher?).
Danny Varod
DA01