UX für Berechtigungen

Matt Gaunt

Nachdem ein PushSubscription abgerufen und auf unserem Server gespeichert wurde, besteht der natürliche Schritt darin, eine Push-Nachricht auszulösen, aber es gibt noch etwas, das ich auffällig ignoriert habe. Die Nutzererfahrung, wenn der Nutzer um die Berechtigung zum Senden von Push-Nachrichten gebeten wird.

Leider achten nur sehr wenige Websites darauf, wie sie ihre Nutzer um Erlaubnis bitten. Lassen Sie uns also kurz einen Blick auf gute und schlechte UX werfen.

Es gibt einige gängige Muster, die Ihnen bei der Entscheidung, was für Ihre Nutzer und Ihren Anwendungsfall am besten ist, als Orientierungshilfe dienen sollten.

Wertversprechen

Fordere die Nutzer auf, ein Abo zu einem Zeitpunkt abzuschließen, zu dem die Vorteile klar ersichtlich sind.

Beispiel: Ein Nutzer hat gerade einen Artikel in einem Onlineshop gekauft und den Bezahlvorgang abgeschlossen. Auf der Website werden dann Updates zum Lieferstatus angeboten.

Es gibt eine Reihe von Situationen, in denen dieser Ansatz funktioniert:

  • Ein bestimmter Artikel ist nicht auf Lager. Möchtest du benachrichtigt werden, wenn der Artikel wieder verfügbar ist?
  • Diese Eilmeldung wird regelmäßig aktualisiert. Möchten Sie über die Entwicklungen informiert werden?
  • Sie sind der Höchstbietende. Möchten Sie benachrichtigt werden, falls Ihr Angebot überboten wurde?

Dies sind alles Punkte, bei denen der Nutzer in Ihren Dienst investiert hat und für ihn ein klares Nutzenversprechen besteht, Push-Benachrichtigungen zu aktivieren.

Owen Campbell-Moores Beispiel für gute UX für Push.

die Website einer Fluggesellschaft erstellt, um diesen Ansatz zu demonstrieren.

Nachdem der Nutzer einen Flug gebucht hat, wird er gefragt, ob er über Flugverspätungen benachrichtigt werden möchte.

Dies ist eine benutzerdefinierte UI von der Website.

Owen Campbell-Moores Beispiel für eine gute UX für die Berechtigungsaufforderung.

Eine weitere nette Geste an Owens Demo ist, dass die Website, wenn der Nutzer auf Benachrichtigungen klickt, um Benachrichtigungen zu aktivieren, ein halbtransparentes Overlay auf der gesamten Seite hinzufügt, wenn die Berechtigungsaufforderung angezeigt wird. Dadurch wird die Aufmerksamkeit der Nutzer auf die Berechtigungsaufforderung gelenkt.

Die Alternative zu diesem Beispiel, der schlechten UX zum Anfordern von Berechtigungen, besteht darin, die Berechtigung anzufordern, sobald ein Nutzer auf der Website der Fluggesellschaft landet.

Owen Campbell-Moores Beispiel für schlechte UX für Push.

Dieser Ansatz liefert keinen Kontext dazu, warum Benachrichtigungen für den Nutzer erforderlich oder nützlich sind. Außerdem wird der Nutzer durch diese Berechtigungsaufforderung daran gehindert, seine ursprüngliche Aufgabe auszuführen (z.B. einen Flug zu buchen).

Doppelte Berechtigung

Möglicherweise sind Sie der Meinung, dass Ihre Website einen klaren Anwendungsfall für Push-Benachrichtigungen hat, und sollten den Nutzer daher so schnell wie möglich um Erlaubnis bitten.

Zum Beispiel Instant Messaging und E-Mail-Clients. Das Anzeigen einer Nachricht für eine neue Nachricht oder E-Mail ist eine etablierte Nutzererfahrung auf einer Reihe von Plattformen.

Für diese App-Kategorie ist das Muster der doppelten Berechtigung zu beachten.

Zeigen Sie zuerst eine gefälschte Berechtigungsaufforderung an, die von Ihrer Website gesteuert wird. Sie besteht aus Schaltflächen zum Zulassen oder Ignorieren der Berechtigungsanfrage. Wenn der Nutzer auf „Zulassen“ klickt, fordern Sie eine Berechtigung an und die Aufforderung für den echten Browser wird ausgelöst.

Bei diesem Ansatz zeigen Sie eine benutzerdefinierte Berechtigungsaufforderung in Ihrer Webanwendung an, in der der Nutzer aufgefordert wird, Benachrichtigungen zu aktivieren. Auf diese Weise kann der Nutzer die Aktivierung oder Deaktivierung auswählen, ohne dass Ihre Website dauerhaft blockiert wird. Wählt der Nutzer die Option „Aktivieren“ in der benutzerdefinierten Benutzeroberfläche aus, muss die tatsächliche Berechtigungsaufforderung eingeblendet werden. Blende andernfalls das benutzerdefinierte Pop-up aus und frage später noch einmal nach.

Ein gutes Beispiel dafür ist . Nachdem Sie sich angemeldet haben, wird oben auf der Seite eine Aufforderung angezeigt, in der Sie gefragt werden, ob Sie Benachrichtigungen aktivieren möchten.

Einstellungen

Sie können Benachrichtigungen in einen Einstellungsbereich verschieben, sodass Nutzer Push-Nachrichten einfach aktivieren und deaktivieren können, ohne die Benutzeroberfläche Ihrer Webanwendung überladen zu müssen.

Wenn Sie die Seite zum ersten Mal laden, wird keine Aufforderung angezeigt.

Ein gutes Beispiel dafür ist . Wenn Sie die Google I/O-Website zum ersten Mal laden, werden Sie nicht aufgefordert, etwas zu tun. Der Nutzer muss sich lediglich auf der Website umsehen.

Der Bereich „Einstellungen“ in der Webanwendung von Google IO für Push-Benachrichtigungen.

Wenn Nutzer nach einigen Besuchen auf das Menüelement rechts klicken, wird ein Einstellungsbereich angezeigt, über den der Nutzer Benachrichtigungen einrichten und verwalten kann.

Web-App von Google IO mit der Berechtigungsaufforderung.

Wenn Sie auf das Kästchen klicken, wird die Berechtigungsaufforderung angezeigt. Keine versteckten Überraschungen.

Nachdem die Berechtigung erteilt wurde, ist das Kästchen angeklickt und der Nutzer kann loslegen. Das Tolle an dieser Benutzeroberfläche ist, dass Nutzer Benachrichtigungen von einem Ort auf der Website aus aktivieren und deaktivieren können.

Passiver Ansatz

Eine der einfachsten Möglichkeiten, einem Nutzer Push-Benachrichtigungen anzubieten, besteht darin, eine Schaltfläche oder einen Umschalter zu verwenden, mit dem Push-Nachrichten an einer Position auf der Seite aktiviert bzw. deaktiviert werden, die auf der gesamten Website einheitlich ist.

Nutzer werden dadurch nicht dazu angeregt, Push-Benachrichtigungen zu aktivieren, sondern bieten ihnen eine zuverlässige und einfache Möglichkeit, der Interaktion mit Ihrer Website zuzustimmen oder sie zu deaktivieren. Für Websites wie Blogs, die sowohl regelmäßige Zuschauer als auch hohe Absprungraten haben, ist dies eine solide Option, da sie sich an regelmäßige Zuschauer richtet, ohne lästige Drive-by-Besucher zu stören.

Auf meiner privaten Website habe ich in der Fußzeile eine Ein/Aus-Schaltfläche für Push-Benachrichtigungen.

Beispiel für die Ein/Aus-Schaltfläche für Push-Benachrichtigungen von Gauntface.com in der Fußzeile

Es ist ziemlich weit weg, aber für regelmäßige Besucher sollte es genug Aufmerksamkeit von Lesern bekommen, die Updates erhalten möchten. Einmalige Besucher sind davon nicht betroffen.

Wenn der Nutzer Push-Benachrichtigungen abonniert, ändert sich der Status der Umschalttaste auf der gesamten Website.

Beispiel für Gauntface.com mit aktivierten Benachrichtigungen

Die schlechte UX

Das sind einige der gängigen Praktiken, die mir im Web aufgefallen sind. Leider gibt es eine sehr häufige schlechte Praxis.

Am schlimmsten ist es, Nutzern das Berechtigungsdialogfeld anzuzeigen, sobald sie auf Ihrer Website landen.

Sie haben keinen Kontext dazu, warum sie um eine Berechtigung gebeten werden, und wissen möglicherweise nicht einmal, wofür Ihre Website da ist, was sie tut oder was sie bietet. Es ist nicht ungewöhnlich, dass Berechtigungen an dieser Stelle blockiert werden, weil ein Pop-up-Fenster die Aktion des Nutzers beeinträchtigt.

Denken Sie daran: Wenn der Nutzer die Berechtigungsanfrage blockiert, kann Ihre Web-App die Berechtigung nicht noch einmal anfordern. Um die Berechtigung nach dem Blockieren zu erhalten, muss der Nutzer die Berechtigung in der Benutzeroberfläche des Browsers ändern. Das ist für den Nutzer nicht einfach, offensichtlich oder unterhaltsam.

Bitten Sie in jedem Fall nicht sofort um Erlaubnis, wenn der Nutzer Ihre Website öffnet. Ziehen Sie stattdessen eine andere UI oder einen Ansatz in Betracht, der den Nutzer dazu animiert, die Berechtigung zu erteilen.

Bieten Sie einen Ausweg

Zusätzlich zur UX-Design-Funktion zum Abonnieren eines Nutzers per Push-Benachrichtigung solltest du auch überlegen, wie ein Nutzer sich abmelden oder Push-Nachrichten deaktivieren sollte.

Es gibt erstaunlich viele Websites, die direkt beim Laden der Seite eine Berechtigung anfordern und dann keine UI zum Deaktivieren von Push-Benachrichtigungen anbieten.

Auf Ihrer Website sollte den Nutzern erklärt werden, wie sie Push-Benachrichtigungen deaktivieren können. Andernfalls ist es wahrscheinlich, dass Nutzer die Nuklear-Option wählen und die Berechtigung dauerhaft blockieren.

Weitere Informationen

Code-Labs