Best Practices für Webberechtigungen

Marian Harbach

Thomas Steiner

Berechtigungsaufforderungen sind der wichtigste Mechanismus im Web, um Nutzer vor leistungsstarken Funktionen zu schützen, die ihre Privatsphäre und Sicherheit gefährden könnten. Browser versuchen zu bestätigen, dass ein Nutzer eine Funktion auf einer bestimmten Website zulassen möchte. Sie können Berechtigungen für eine Reihe von APIs, darunter Media Capture (Kamera und Mikrofon), Geolocation, Speicherzugriff, MIDI und Benachrichtigungen implementieren.

Beachten Sie diese Best Practices, wenn Sie Nutzern Berechtigungsaufforderungen präsentieren. Sie basieren auf Chrome-Nutzungsstatistiken und Nutzerstudien. Wenn Sie sie befolgen, sollten Ihre Nutzer weniger unnötige Aufforderungen erhalten, was zu weniger Blockierungsentscheidungen führt.

Am Ende dieses Dokuments finden Sie einige Codemuster für APIs mit Berechtigungsbeschränkung und Informationen dazu, wie Sie Nutzern helfen können, åeinen blockierten Zustand zu beheben.

Best Practices für Aufforderungen

Fordern Sie nach einer Nutzerinteraktion eine Berechtigung an, wenn Nutzer den Kontext haben, um zu verstehen, warum Sie sie anfordern und welchen Nutzen sie aus dem Zugriff ziehen.

Bieten Sie nach Möglichkeit alternative Möglichkeiten, um dieselbe Aufgabe zu erledigen. Wenn Sie den richtigen Zeitpunkt für die Anfrage sorgfältig auswählen, verringern Sie die Wahrscheinlichkeit, dass Ihre Nutzer in einen blockierten Zustand geraten, aus dem sie sich nur schwer befreien können.

Nie beim Seitenaufbau oder ohne Nutzerinteraktion anfragen

Wenn Sie beim Seitenaufbau eine Berechtigung anfordern, ist das so, als würden Sie einen Kunden nach sensiblen Informationen fragen, wenn er ein Ladengeschäft betritt. Eine Berechtigungsaufforderung zu sehen, möglicherweise neben mehreren anderen Aufforderungen zur Newsletter-Anmeldung und zur Cookie-Einwilligung, ist eine unangenehme Erfahrung. Nutzer verstehen nicht warum sie gefragt werden und welchen Nutzen sie daraus ziehen.

Auch wenn Ihre Webanwendung ohne Zugriff auf eine bestimmte Funktion nicht funktioniert, sollten Sie Nutzern die Möglichkeit geben, zu verstehen, warum sie erforderlich ist. Leiten Sie die Berechtigungsaufforderung beispielsweise mit einer Erklärung ein, warum die Aufforderung erforderlich ist, und geben Sie Nutzern eine Wahlmöglichkeit (z. B. durch alternative Möglichkeiten, um dieselbe Funktion auszuführen). Wenn Ihnen kein besserer Zeitpunkt für die Anfrage einfällt als beim Seitenaufbau, finden Sie später in dieser Anleitung einige Beispiele.

Auch das Anfordern einer Berechtigung ohne vorherige Nutzerinteraktion ist ineffektiv. Dies wird als vorübergehende Nutzeraktivierung bezeichnet. Chrome-Telemetriedaten zeigen, dass 77% der Berechtigungsaufforderungen auf dem Computer ohne Signal der Nutzerabsicht angezeigt werden und daher nur 12% dieser Aufforderungen zugelassen werden. Nach einer Nutzerinteraktion steigt die Zulassungsrate auf 30%.

Fordern Sie eine Berechtigung erst an, nachdem der Nutzer mit der Seite interagiert hat.

Nur anfragen, wenn Nutzer verstehen können, warum

Berechtigungsentscheidungen sind oft Datenschutzentscheidungen. Basierend auf dem Framework für kontextbezogene Integrität, wissen wir, dass Datenschutzentscheidungen stark kontextabhängig sind. Es ist wichtig zu verstehen, warum der Zugriff erforderlich ist. Sie sollten nur die Funktionen anfordern, die Sie benötigen, um einen Mehrwert zu bieten, und bei denen Nutzer wahrscheinlich zustimmen, dass sie einen Mehrwert bieten. Fordern Sie außerdem eine Berechtigung an, wenn für den Nutzer offensichtlich ist, warum die Funktion hilfreich ist. Erleichtern Sie Nutzern, den Nutzungskontext zu verstehen.

Unsere Nutzerstudien zeigen, dass Nutzer wesentlich häufiger den Zugriff zulassen, wenn sie verstehen, warum eine Website Zugriff anfordert, und auch einen Nutzen sehen. Außerdem haben wir festgestellt, dass Nutzer unbekannte Websites zuerst erkunden möchten, um besser zu verstehen, welchen Wert sie im Gegenzug für die Zulassung des Zugriffs erhalten können. In der Zwischenzeit lehnen sie Berechtigungsaufforderungen oft ab oder ignorieren sie. Bei einmaligen Berechtigungen lassen sie möglicherweise zuerst einen einzelnen Besuch zu. Unterstützen Sie dieses Verhalten in Ihrer Anwendung.

Alternativen anbieten

Das Ergebnis einiger Funktionen ist für Nutzer möglicherweise nicht hilfreich. Beispiel: Bei der Geolocation eines Desktopgeräts ohne GPS-Sensor wird möglicherweise der falsche Standort zurückgegeben, weil die Person mit einem VPN verbunden ist. Andere Nutzer möchten möglicherweise keinen Zugriff auf die Zwischenablage gewähren, da sie die Kontrolle behalten und diese Ereignisse manuell mit Tastenkombinationen auslösen möchten. Bieten Sie in diesen Situationen eine alternative Möglichkeit, um dieselben Ergebnisse zu erzielen.

Wenn Sie beispielsweise eine Berechtigung für die Geolocation anfordern, bieten Sie ein Textfeld an, in dem Nutzer eine Postleitzahl oder Adresse eingeben können. Ermöglichen Sie, dass Elemente mit einer Tastenkombination oder über das Kontextmenü ausgewählt und in die Zwischenablage kopiert werden können. Bieten Sie für Benachrichtigungen E‑Mails anstelle von Push-Benachrichtigungen an.

Ein nützliches Muster besteht darin, die alternative UI auch als Erklärung dafür zu verwenden, warum der Zugriff von Vorteil sein könnte. Nutzer, die neben einer Schaltfläche, die die Geolocation API auslöst, eine Option zur Eingabe eines Standorts sehen, haben das Gefühl, die Kontrolle zu haben, da sie wissen, dass sie ihre Adresse eingeben können. Wenn es eine Wahlmöglichkeit zwischen dem Empfang von Benachrichtigungen per Push oder E‑Mail oder der Teilnahme an einer Besprechung ohne Zulassung des Kamera- und Mikrofonzugriffs gibt, verstehen Nutzer die Kompromisse.

Blockierte Zustände vermeiden

Sobald ein Nutzer den Zugriff auf eine Funktion mit Berechtigungsbeschränkung dauerhaft verweigert hat, berücksichtigen Browser diese Entscheidung. Wenn es möglich wäre, weiterhin nach Zugriff zu fragen, würden böswillige Websites Nutzer mit Aufforderungen bombardieren. Es ist bewusst aufwendig, den blockierten Zustand einer Funktion zu beheben. Fordern Sie keine Berechtigung in Situationen an, in denen Nutzer den Zugriff wahrscheinlich nicht zulassen.

Eine gängige Methode ist die Verwendung einer sogenannten Vorab-Aufforderung, in der Sie Ihren Nutzern erklären, was passieren wird und warum Ihre Anwendung die Funktion benötigt, die Sie anfordern möchten. Nur wenn Nutzer positiv auf eine solche Vorab-Aufforderung reagieren, sollten Sie die Berechtigungsaufforderung des Browsers auslösen. Es gibt Situationen, in denen Nutzer diesen Zustand möglicherweise rechtmäßig beheben müssen. Weitere Informationen finden Sie im Abschnitt Nutzern helfen, einen blockierten Zustand zu beheben für mehr dazu.

Inhalte von Dritten beachten

Achten Sie auf unerwartete Quellen von Berechtigungsaufforderungen. Skripts von Drittanbietern auf Ihrer Website können unbeabsichtigte Berechtigungsaufforderungen auslösen. Dies kann sich auf die Nutzererfahrung auswirken, insbesondere wenn die Aufforderungen nicht den Best Practices entsprechen. Damit Sie die Nutzererfahrung im Blick behalten, lesen Sie die Dokumentation für alle Drittanbieterbibliotheken und ‑skripts, die Sie Ihrem Code hinzufügen.

Wann nach einer Berechtigung fragen?

Hier sind einige Beispiele für Momente, die sich gut eignen, um nach einer Berechtigung zu fragen, wenn Sie Best Practices befolgen:

• Nachdem ein Nutzer neben einem Formularfeld auf Meinen Standort verwenden geklickt hat, wenn er manuell eine Adresse eingibt.
• Nachdem ein Nutzer einen Videochannel oder ‑Beitrag abonniert und in einem Dialogfeld, in dem beschrieben wird, dass Updates als E‑Mails oder Benachrichtigungen zugestellt werden können, auf eine bestätigende Schaltfläche geklickt hat.
• Nachdem ein Nutzer auf einer Seite angekommen ist, auf der er sich auf einen Videoanruf vorbereitet, und in einer Vorab-Aufforderung bestätigt hat, dass er gesehen und gehört werden möchte. Weitere Informationen finden Sie in der Fallstudie zu Google Meet.

Codemuster

Die Berechtigung zur Verwendung einer API wird je nach API auf unterschiedliche Weise erteilt. Einige ältere APIs verwenden ein Modell, bei dem der Browser automatisch nach einer Berechtigung fragt, wenn Sie die API zum ersten Mal verwenden. Ein Beispiel ist die Geolocation API beim Aufrufen von navigator.geolocation.getCurrentPosition().

try {
  navigator.geolocation.getCurrentPosition((pos) => console.log(pos));
} catch (error) {
  console.error(error);
}

Andere APIs verwenden ein Modell, bei dem Sie zuerst explizit eine Berechtigung mit einer statischen Methode anfordern. Ein gutes Beispiel ist Notification.requestPermission() zum Zulassen von Benachrichtigungen oder das weniger verbreitete DeviceOrientationEvent.requestPermission(), das Teil der Device Orientation Events API ist.

Einige Browser erteilen automatisch eine Berechtigung für bestimmte APIs. Chrome lässt beispielsweise immer den Zugriff auf die Geräteausrichtung zu, während Safari eine Aufforderung anzeigt.

const result = await DeviceOrientationEvent.requestPermission();
console.log(`The user's decision when prompted to use the Device Orientation
Events API was: ${result}.`);
if (result === 'granted') {
  /* Use the API. */
}

Berechtigungsstatus prüfen

Verwenden Sie die navigator.permissions.query() Methode aus der Permissions API, um zu prüfen, ob Sie eine bestimmte API verwenden können.

const result = await navigator.permissions.query({ name: 'geolocation' });
console.log(`The result of querying for the Geolocation API is:
${result.state}.`);
if (result.state === 'granted') {
  // Use the API.
}

Nutzern helfen, einen blockierten Zustand zu beheben

Wenn Sie Nutzern bei der Behebung von Zugriffsproblemen helfen möchten, erkennen Sie mit der Permissions API, dass sie den Zugriff blockiert haben, und bieten Sie eine Anleitung zum Ändern der Einstellungen. Wenn Nutzer mit UI-Elementen interagieren, die mit einer Funktion mit Berechtigungsbeschränkung verknüpft sind, prüfen Sie den Berechtigungsstatus und öffnen Sie ein Dialogfeld zur Fehlerbehebung.

Die genauen Schritte zum Ändern des Berechtigungsstatus variieren je nach Browser. Bieten Sie daher passende Beschreibungen basierend auf dem User-Agent-String für die am häufigsten verwendeten Browser an.

In Chrome können Nutzer Berechtigungen über Websiteinformationen ansehen > Websiteeinstellungen, in der Adressleiste ändern. In einigen Fällen müssen sie die Seite möglicherweise neu laden, bevor sie eine Funktion verwenden können. In diesem Fall wird oben im Fenster eine Meldungsleiste angezeigt, in der angeboten wird, die Website neu zu laden.

Ähnliche UIs zum Steuern von Berechtigungen gibt es auch in anderen Browsern, z. B. in Firefox.