it-swarm.com.de

Entwerfen eines Statusindikators "Online / Offline" und Beispiele für vorhandene mit bewährten Verfahren

Ich versuche, ein Online-/Offline-Benutzeroberflächenelement in meine Anwendung (Web-App) zu integrieren. Ich habe einige Probleme damit, es mit den anderen Benutzeroberflächenelementen abzugleichen, und frage mich, was Sie hier davon halten - und in der besten Praxis könnte ich jedes vorhandene empfehlen Status Komponenten der Online-/Offline-Benutzeroberfläche.

State 1: default status online
State 2: on click change to online/offline

enter image description here

Wenn Sie auf das Auf und Ab klicken, wird nur ein Popup mit den beiden Optionen Rot für Offline und Grün für Online angezeigt.

  • Ich suche nach anderen Möglichkeiten zum Ändern und Anzeigen von Online/Offline, um eine bessere Vorstellung davon zu bekommen, welche anderen Optionen ich möglicherweise habe
6
Rubytastic

Ich möchte Ihre Aufmerksamkeit auf ein Problem mit der Barrierefreiheit bei der Verwendung von Farben lenken. Zitieren WCAG 2. :

1.4.1 Verwendung von Farbe: Farbe wird nicht als einziges visuelles Mittel verwendet, um Informationen zu übermitteln, eine Aktion anzuzeigen, eine Antwort auszulösen oder ein visuelles Element zu unterscheiden. (Stufe A)

Ich würde daher vorschlagen, eine Kombination aus Farbe und Bildmaterial zu verwenden, z. B. wie dies bei diesen Adium-Chat-Statussymbolen der Fall ist (oder zumindest in diesem Sinne). Also vielleicht ein Kreis mit einem eingeschriebenen Kreuz für Offline.

Die Verstärkung visueller Informationen ist sowieso fast nie eine schlechte Sache.

BEARBEITEN: Inline-Beispiel von der obigen Website: Adium chat status icons

13
msanford

Ich denke, dass der farbige Punkt ein guter, erkennbarer Statusindikator ist, aber ich würde vorschlagen, den Offline-Indikator in einen grauen oder dunklen Punkt anstatt in einen roten zu ändern. In Anwendungen wie gchat (und anderen IM-Schnittstellen) bedeutet ein roter Punkt nur nicht verfügbar, nicht offline.

3
DorkRawk