Screen Shot 2013-06-13 at 10.18.20 AM
Zugegeben, Web Notifications sind an sich ein etwas alter Hut – Google Chrome kann das schon lange und wer das Webinterface von GMail nutzt, kennt sicher auch die ‘Notify me about incoming mails’ Funktion. Dennoch habe ich mich bisher immer zurückgehalten einen Blogpost darüber zu schreiben, denn lange Zeit war das eine WebKit (und z.T. Chrome) Insellösung mit dem ‘webkit’ Prefix und ohne w3c Standard.
Web Notifications sind an sich nichts besonderes: Man erlaubt einer Webanwendung einfach, eine Notification am Desktop anzuzeigen, auch wenn der Browser gerade nicht aktiv ist. Google Mail ist da wohl auch gleich eines der logischen Beispiele: Wenn eine neue Mail kommt, will man darüber informiert werden, aber nicht andauernd auf das Fenster schauen.

Screen Shot 2013-06-13 at 10.24.05 AM
Mittlerweile wurde da aber ein draft erstellt und die API nicht nur in Safari und Firefox (ab Version 22) integriert, sondern auch direkt in die Betriebssysteme mit übernommen (z.B. das Notification Center von OSX). Ich bin mir ziemlich sicher dass auch iOS 7 WebNotification Support an Bord hat und laut caniuse hat auch schon der Chrome for Android Browser seit Version 25 support dafür (ich habe die Version 27, ehrlich gesagt ging das aber nicht). Resumée: Heute kann man die Technik bereits verwenden und morgen erreicht man damit einen Großteil der Endgeräte.
Screen Shot 2013-06-13 at 10.18.29 AM
 
Das erstellen von Notifications ist wirklich einfach, anstatt das hier genau zu erläutern habe ich aber einen ausführlich dokumentierten Beispielcode in JSFiddle erstellt.
Dafür ein paar Anmerkungen:

  • Die Beispiele, wie sie unter html5rocks zu finden sind, behandeln noch die webkit API, die sich vom W3C Entwurf unterscheidet – das steht da allerdings auch. Ich empfehle nicht auf die webkit-Implementation zurückzugreifen, die kann in zukünftigen WebKit/Blink Versionen herausfallen. Wer auf Nummer sicher gehen will findet in der Suchmaschine seine Vertrauens etliche Polyfills, die die window.Notification Api auch für ältere Chrome Versionen bereitstellt
  • Die Berechtigungsabfrage für Notifications (requestPermission) funktioniert nur, wenn Sie durch einen Eventhandler (z.B. Buttonclick) getriggert wird. Ergibt Sinn: Wenn ich Browse will ich auch nicht dass mir 10 Berechtigungsanfragen verschiedener APIs aufpoppen.
  • Aus Usability Sicht ergibt es manchmal Sinn, beim schließen des Fensters eine Bestätigungsnachricht für das schließen einzublenden, wenn Notifications aktiviert wurden: Oft schliesst man als Nutzer ein Fenster mit 10 Tabs und vergisst dabei, dass ein Wichtiges dabei war.
  • Wer Notifications verwendet, sollte, wenn Möglich, auf ‘onclick’ reagiere, d.h. wenn die Notification ausgewählt wurden und zusätzlich Informationen zu dem Event anzeigen.

Etwas unschön ist, dass jeder Browser und jedes Betriebssystem die Ereignisse anders anzeigt, aber immerhin ist es (im Gegensatz zu früheren Versionen) mittlerweile nicht mehr möglich, seine Nachrichten mit HTML zu formatieren.