Sind Schwebezustände notwendig?

Ich stimme mit „Ja“! Richtig, Hover -Ereignisse sollten nicht abhängig sein, da Touch-Geräte so beliebt sind. Jon scheint jedoch nach visuellen Hover-Zuständen auf Schaltflächen zu fragen, was etwas anders ist.

Visuelle Schwebezustände bieten „Klickbarkeit“ . Sie sollten nicht auf etwas klicken müssen, um dies herauszufinden Wenn es sich um eine Schaltfläche handelt. Benutzer auf Laptops und Desktops erwarten, dass „anklickbare“ Dinge beim Schweben reagieren, und eine Schaltfläche „aufleuchten“ ist ein nützlicher Hinweis.

Stellen Sie sich das als eine Form von progressive Verbesserung . Dies ist nützlich für diejenigen, die es verwenden können es und harmlos für diejenigen, die nicht können!

Kommentare

• Tatsächlich würde ich ‚ so weit gehen, dies auf einem Desktop zu sagen In der Browserumgebung könnte der Benutzer fast denken, dass etwas nicht stimmt, wenn sich nur der Cursor ändert – wir haben uns so daran gewöhnt, Änderungen zu schweben.
• Das war mein stärkstes Argument / mein stärkster Gedanke. Wir ‚ haben uns so daran gewöhnt, dass es ‚ seltsam wäre, es nicht zu haben.
• Guter Punkt auf progressive Verbesserung. Ich ‚ würde jedoch noch eine weitere Sache zu "You shouldn't have to click something to find out if it's a button." hinzufügen; Sie sollten ‚ nicht über etwas schweben müssen, um herauszufinden, ob es sich um eine ‚ -Schaltfläche handelt.
• Ich würde auch sagen, dass das Hinzufügen von visuellen Schwebezuständen auf Schaltflächen dem Benutzer positives Feedback für seine Aktion oder das Gefühl einer mentalen Auszeichnung gibt.
• Von Windows 7, das sich stark auf Schwebezustände stützte und häufig verwendete Konturen oder Bedienfelder, um Schaltflächen anzuzeigen, für Windows 8, das häufig weder in der “ Metro “ Stilschnittstelle, ich ‚ fand Win 8 manchmal unglaublich frustrierend zu verwenden. Möglicherweise möchte MS, dass Designer für Win 8 codieren, aber IMX ist es ‚ eindeutig falsch, dies zu tun.

Ich versuche, Schwebezustände im Design so weit wie möglich zu vermeiden. Der Hauptgrund dafür ist, dass sie auf Touch-Geräten bedeutungslos sind.

Dies scheint zwar nicht zutreffend zu sein, wenn Sie nicht für Mobilgeräte entwerfen, aber viele Benutzer verwenden ihre Tablets oder andere Touch-Geräte, um dies zu tun Durchsuchen Sie dieselben Websites oder verwenden Sie dieselben Anwendungen, die Sie normalerweise nur auf einem Computer mit einer Maus verwenden würden.

Indem Sie sich selbst einschränken Um keine Hover-Ereignisse zu verwenden, verbessern Sie nicht nur die Erfahrung, unabhängig davon, welches Gerät Sie verwenden, sondern machen es auch einfacher, später eine berührungsspezifische native Anwendung zu erstellen.

Kommentare

• Schwebezustände sind auf mobilen Websites weiterhin nützlich. Das CSS :hover wird beim Anzeigen auf einem mobilen Gerät effektiv als :active behandelt. Dies gibt eine visuelle Rückmeldung, dass der Finger des Benutzers ‚ das Ziel getroffen hat. Dieses Feedback ist aufgrund der Parallaxe bei mobilen Designs viel nützlicher. Wenn Ihre Sichtlinie von der senkrechten Linie zum Bildschirm abweicht, steigt die Wahrscheinlichkeit, dass Sie falsch tippen.
• @ JoJo-Schwebezustände sind auf Mobilgeräten nicht ‚ erkennbar und Tippen entspricht dem Klicken auf einen Computer.
• John, meiner Erfahrung nach glaube ich, dass das Anzeigen von Websites, die ich ‚ für den Desktop auf Mobilgeräten entwickelt habe JoJo sagt zu Recht, dass der Schwebezustand [manchmal] als aktiver Zustand fungiert. Ich sage manchmal, weil es ‚ ein wenig pingelig ist und ‚ nicht immer angezeigt wird.
• @Jon I ‚ Ich diskutiere nicht darüber, wie es übersetzt wird. Ich ‚ diskutiere darüber, wie es sinnvoll ist, zu übersetzen. Wie wählen Sie aus, wenn der Schwebeflug aktiv wird? Doppeltippen? Es bricht das gesamte Touch-Paradigma.
• @JoJo nicht immer, ich ‚ glaube nicht, dass Chrome unter Android den Schwebezustand überhaupt auslöst, und Safari ‚ Der Schwebezustand ist oft unangenehm

Mit dem Auftauchen von Touch ist eine wichtige Möglichkeit, mit Software zu interagieren. Ich würde sagen, dass schwebebasierte Interaktionen jetzt auf „schön, Verbesserungen zu haben“ verwiesen werden, aber niemals eine Voraussetzung für die Interaktion mit der Software sein sollten.

Ich dupliziere häufig den Status: hover für: focus, da dies eine nützliche Methode ist, um den Fokus für einen Benutzer anzuzeigen, der nur über die Tastatur verfügt (was erforderlich ist, um WCAG2 zu erfüllen ). Es zeigt an, dass ein Element in irgendeiner Weise interaktiv ist, ohne dass ein Klickereignis erforderlich ist, das eine Aktion auslöst, die der Benutzer noch nicht initiiert hat. Sie können nur für: Fokus ohne: Schweben stylen, aber meiner Meinung nach ist die Absicht der beiden Aktionen dieselbe und sollte, wo immer dies praktikabel ist, den gleichen visuellen Effekt haben.

Ich stimme auch aus Sams Sicht zu, dass Schwebezustände als progressive Verbesserung . Ich möchte das nur ein bisschen klarstellen.

Aus der Sicht von mobile first haben Schwebezustände keinen wirklichen Zweck für Server. Daher sollte sich die Benutzeroberfläche besser klickbares Verhalten für klickbare Objekte ohne Schwebezustand leisten (dh Schaltflächen sollten aussehen wie Schaltflächen).

Wenn Sie diesen Begriff auf einem mobilen Gerät unterstützen können, wird dieser Begriff auch auf Desktop- / Laptop-Geräten unterstützt, sogar bevor Schwebezustände eingeführt werden.

Wenn Sie einen Schwebezustand auf Geräten einfügen, die Hover unterstützen – Laptops, Desktops usw. -, wird die bereits vorhandene Wahrnehmung des Benutzers bestätigt, dass ein bestimmtes UI-Element tatsächlich anklickbar ist.

Um es noch einmal zusammenzufassen:

1. Erstellen Sie UI-Elemente, auf die geklickt werden kann, sodass sie für jedes Gerät ein klickbares Verhalten bieten.
2. Verwenden Sie Hover-Status auf Geräten, die das Hovering unterstützen Unterstützen Sie ferner die Vorstellung, dass ein Element anklickbar ist.

+1, um die progressive Verbesserung zu erwähnen.

Ich würde empfehlen, Schwebezustände zu verwenden, wenn sie einen Nutzen bieten, der die Benutzeroberfläche verbessert, aber sie sollten niemals benötigt werden , um eine Aufgabe abzuschließen.

Verwenden Sie sie beispielsweise auf einer Produktlistenseite, um beim Bewegen des Mauszeigers über das Bild ein paar Informationen zum Artikel bereitzustellen, bevor der Benutzer darüber navigiert. Diese Informationen sollten dann auch auf der Produktseite selbst verfügbar sein lenkt nicht von der Erfahrung des Touchscreen-Benutzers, fügt jedoch einige zusätzliche Nützlichkeit für diejenigen hinzu, die sehen. 🙂

Nur weil Sie sowohl für Desktop als auch für Mobilgeräte entwerfen, heißt das nicht, dass die Designs die sein sollten gleich. Interaktionen, an die mobile Benutzer möglicherweise gewöhnt sind, sind für Desktop-Benutzer möglicherweise nicht ersichtlich.

Zum Beispiel weiße Karten mit einem Caret auf der rechten Seite. Für mobile Benutzer ist dies offensichtlich etwas, auf das Sie tippen können. Für Desktop-Benutzer nicht so viel (insbesondere wenn die Karte auf dem Desktop breiter ist), aber wenn sie schweben und einen Schwebezustand sehen, ist es plötzlich offensichtlich, dass sie anklickbar ist.

Besonders jetzt diese Animation Ein Schwebezustand ist eine grundlegende Animation, die Benutzern Feedback gibt, dass sie das tun, was sie beabsichtigt haben.

Das Nicht-Verwenden eines Schwebezustands für den Desktop ist faul und macht die Leute traurig.

Ich glaube nicht, dass :hover Zustände wesentlich sind; UI-Elemente auf dem Desktop sind für immer ohne sie zurechtgekommen, und Objekte, die eindeutig so gestaltet sind, dass sie das Klicken ermöglichen (wie die Schaltfläche „Antwort posten“ hier auf UX.SE), lassen sich nach meiner eigenen Erfahrung problemlos testen. Das heißt nicht, dass es nicht hilfreich ist. nur, dass es nicht wesentlich ist.

Ich halte jedoch :focus und insbesondere :active für wesentlich; Letzteres wird insbesondere auf viel zu vielen Websites ignoriert. Ein eindeutiger aktiver Status hilft dem Benutzer zu erkennen, dass der Schaltflächenklick sofort registriert wurde (, was äußerst wichtig ist, damit Benutzer das Gefühl haben, dass sie es sind manipulieren direkt ein Objekt in der Benutzeroberfläche ). Systemsteuerelemente wie Schaltflächen und Menüs haben diesen Status ebenfalls erwartet, was das Vergessen noch unverzeihlicher macht.

Ich würde vorschlagen, dass Schwebezustände ein positives Feedback zu der Erwartung des Benutzers geben, dass das betreffende Element interaktiv ist, wodurch das Potenzial für negativere Gefühle von Zweifel und Mehrdeutigkeit beseitigt wird

Designs liefern eine Reihe von Hinweisen darauf, dass ein Element interaktiv ist – Form, Größe, Position, Farbe, Unterstreichung usw. Unterschiedliche Benutzer benötigen unterschiedliche Hinweise s und möglicherweise die kumulative Wirkung einer anderen Anzahl von Hinweisen, um das Element wahrzunehmen (und sich sicher zu fühlen), ist interaktiv. Das Ändern eines Elements beim Schweben ist eine Gelegenheit, mehr Hinweise zu liefern.

Die meisten (wenn nicht alle) Browser liefern standardmäßig Hinweise zum Hover, indem sie den Cursor auf einen Zeiger ändern. Natürlich haben wir die Kontrolle darüber und könnten den Schwebezustand entfernen, indem wir diesen Effekt entfernen. Aber ich stelle mir für die meisten von uns vor (nehmen Sie sich einen Moment Zeit, um es sich vorzustellen), dass dies erhebliche Zweifel an unserer Browser-Erfahrung aufkommen lassen würde. Browser (und dann Designer) haben einen solchen Präzedenzfall für zusätzliche Cues beim Hover festgelegt, dass das Nicht-Liefern von Cues einen erheblichen Widerspruch zu zuvor wahrgenommenen Cues darstellt, dass das Element interaktiv ist.

Entfernen der Standardeinstellungen des Browsers Der Hinweis ist daher ein nützliches Beispiel für den Wert des Schwebezustands. Für mich stellt sich daher nicht die Frage, ob visuelle Hinweise auf Interaktivität beim Schweben wertvoll sind, sondern welche und wie viele Hinweise optimal sind.

Es gibt einige nützliche vertraute Präzedenzfälle, aber die Antwort auf diese Frage hängt von der Anwendung und der Zielgruppe ab.

Ich würde vorschlagen Bewegen Sie den Mauszeiger, wenn die Schaltfläche kein Symbol enthält. Wenn sich zu diesem Zeitpunkt ein farbiges Symbol auf der Schaltfläche befindet, ist es nicht unbedingt erforderlich, der Schaltfläche den Schwebezustand zuzuweisen. Beispiel: Melden Sie sich mit der Google-Schaltfläche an.

Hovers sind ein Muss für alle Websites, die online eine gute Antwort wünschen. Ich habe einige Websites verwendet, die Ich habe den Schwebestatus auf meinem Laptop aufgegeben und es war sehr frustrierend.Jeder gute Designer weiß, dass die Leute im Internet in Eile sind, um zu finden, was sie wollen, und wenn ein Button Ihnen nicht sagt, ob es einer ist oder nicht, und Sie ihn in einem neuen Tab öffnen müssen, um das herauszufinden – das ist ein großer Fehler!

Richtig, Schweben ist für Mobilgeräte nicht erforderlich. Sie können sie jedoch jederzeit für Mobilgeräte deaktivieren. Vergessen wir außerdem nicht, dass die Schaltflächen für Handys viel größer sein müssen als die für Online. Und werden sie nicht trotzdem auf zwei verschiedenen Stylesheets erstellt?

Kommentare

• Bei Websites, bei denen der Cursorstil auf eine Hand (oder ein gleichwertiges Element) umgestellt wird, ist dies der Hover-Effekt, auf den ich einwirken.
• Ich glaube, es muss immer noch Schwebeflug gezeigt werden, nur eine Hand verwirrt den Benutzer, da wir möchten, dass das Web so naturgetreu wie möglich funktioniert und wenn wir auf Dinge klicken, wenn sie im wirklichen Leben sind, spiegeln sie sich wider. Aus der Sicht eines Strategen ‚ möchten Sie, dass sich Ihre Website sicherer anfühlt und ‚ die meisten davon Betrugswebsites ‚ machen sich nicht die Mühe, den Hover-Effekt zu installieren. Wenn Benutzer ‚ den Effekt nicht sehen, fühlen sie sich innerlich merkwürdig.