it-swarm.com.de

Bezeichnen einer Registerkarte als "nicht gespeichert" in einer Webanwendung

Ich habe eine Webanwendung, bei der eine ihrer Seiten Registerkarten verwendet, um die Seite in "mundgerechte" Abschnitte zu unterteilen. Der Inhalt in jeder Registerkarte hat keine Beziehung zu Inhalten in einer anderen Registerkarte und kann als unabhängig voneinander betrachtet werden:

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Das Problem ist, dass Benutzer über Registerkarten wechseln können (was in Ordnung ist). Wenn sie jedoch eine Änderung an einer Registerkarte vornehmen und diese noch nicht gespeichert haben, möchte ich einen Hinweis darauf haben, dass der Inhalt dieser Registerkarte nicht gespeichert wurde .

In herkömmlichen Desktop-Apps wird die Registerkarte normalerweise mit einem Sternchen gekennzeichnet:

mockup

bmml Quelle herunterladen

Anfangs dachte ich darüber nach, ein kleines Symbol zu platzieren: enter image description here neben der Registerkartenbezeichnung:

mockup

bmml Quelle herunterladen

Mit dem Sternchen ist es meiner Meinung nach zu einfach, den Indikator zu übersehen, und Benutzer sind möglicherweise nicht mit dem Paradigma "Sternchen zeigt nicht gespeichert an" vertraut, wenn es um Webanwendungen geht.

Mit dem Symbol scheint es dem Benutzer zu sagen, dass es ein Problem mit dieser Registerkarte gibt, anstatt dass sich die Registerkarte in einem nicht gespeicherten Zustand befindet.

Wie kann ein Tab in einer Webanwendung am besten als nicht gespeichert gekennzeichnet werden? Gibt es außer den oben angegebenen Modellen noch andere Möglichkeiten? Gibt es Beispiele/Studien, die die effektivsten Wege aufzeigen?

12
F21

Ich würde zwei Aspekte berücksichtigen. Erstens können Sie den Titel der Registerkarte fett machen, was darauf hinweist, dass etwas anders ist. Außerdem wird die Schaltfläche Speichern nur aktiviert, wenn etwas gespeichert werden soll. Solange die Änderungen vorgenommen werden, sobald Sie eine Änderung vornehmen, werden die Benutzer sie wahrscheinlich ausarbeiten.

Eine andere Möglichkeit wäre, den Titel in Klammern zu setzen. Sie könnten am Ende sogar "(nicht gespeichert) hinzufügen, aber ich denke, das würde zu viel Aufmerksamkeit auf die Orte lenken, an denen Sie Ihre Arbeit bereits abgeschlossen haben, und nicht auf die, auf die Sie sich konzentrieren müssen.

3

Was ist, wenn Sie sich keine Gedanken über den Status "Speichern" auf einer einzelnen Registerkartenebene gemacht haben? Platzieren Sie die Schaltfläche Speichern/Senden außerhalb des Tabset und lassen Sie Benutzer das gesamte Tabset so speichern, als wäre es eine Seite, anstatt dass Benutzer auf jeder Seite speichern müssen Tab?

8
Daniel Genser

Es scheint mir, dass Sie versuchen, den besten Punkt zwischen zu wählen erläuterung für Erstanwender zu prägnanz So können erfahrene Benutzer 1) sich nicht bevormundet fühlen und 2) den begrenzten Platz effizient nutzen.

Symbole

Ihre Symbolidee würde die Aufmerksamkeit auf sich ziehen, um den Mauszeiger des Benutzers zu bewegen. An diesem Punkt lösen Sie die Neugier des Anfängers mit einem Tooltip. JedochEs leidet darunter, dass die Aufmerksamkeit von den Kernaktivitäten auf ein möglicherweise geringfügiges Problem gelenkt wird, und es besteht die Gefahr, dass es kitschig erscheint (ich kann mir vorstellen, dass fast jedes Symbol grell aussehen würde, wenn es auf allen Registerkarten wiederholt wird).

Sternchen

Das Sternchen ist insofern ein besserer Ansatz, als es viel mehr Platz spart und nicht unnötig auffällig ist. Sofern Sie nicht der Meinung sind, dass das Speichern von Registerkarten ein wichtiger Bestandteil der Benutzererfahrung beim Surfen für alle Benutzer ist, würde ich empfehlen, Sternchen mit einem Tooltip zu kombinieren, damit jeder Neuling ihre Bedeutung kennenlernen kann.

Verwendung von Farbe

Ändern Sie anstelle von Symbolen möglicherweise die Farbe nicht gespeicherter Registerkarten in einen subtilen Rot- oder Rosaton, um auf einen Bedarf an Aufmerksamkeit hinzuweisen. Verwenden Sie dies nicht alleine, da es für die Barrierefreiheit nicht gut ist (danke @dnbrv).

Automatisch speichern

Speichern Sie die Arbeit eines Benutzers jedes Mal, wenn er die Registerkarte wechselt oder alle paar Sekunden. Dies erhöht zwar die Serverlast, ist jedoch die beste Lösung für die Benutzererfahrung.

5
sscirrus

Ich mag Konventionen, daher funktioniert es am besten, ein Sternchen in Verbindung mit einer Warnmeldung zu setzen, die einen Benutzer warnt, wenn er versucht, sich mit einem nicht gespeicherten Tab von der Webseite zu entfernen.

Aber wenn Sie mehr Vorwarnung wünschen, dann nahm ich an, dass eine kleine Nachricht oben mehr Aufmerksamkeit bekommen würde. Es kann angezeigt werden, wenn eines oder mehrere dieser Ereignisse auftreten: 1. Registerkarte "Benutzeränderungen" 2. System erkennt Änderungen 3. Benutzer versucht, die übergeordnete Seite zu verlassen, ohne sie zu speichern.

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

5
Jung Lee