Demo of the first public website using Safari’s new native push notifications feature [Video]

http://www.youtube.com/watch?feature=player_embedded&v=T4QrylM6th0

During the WWDC keynote, Apple introduced a new Safari 7 feature that allows developers to take advantage of native push notifications on their websites. Unlike HTML5 push notifications, which have been used by some browsers for some time now, native push notifications act like any other installed application’s notifications: they are branded for the web app rather than the browser, they can be used even when you aren’t on the website, and they can even pop up when Safari isn’t running.

Working with 9to5Mac, developer Connor LaCombe has developed the first public demo website that shows exactly how the feature works:

1. Visit kandutech.net using Safari 7 on Mavericks
2. Accept the permission request
3. Write down the four digit unique code
4. Open the website on your mobile device and type in the code on your Mac’s screen
5. A push notification will appear on your Mac’s screen – you can click on it to open the website in your default browser

During the WWDC keynote, Apple demonstrated the feature by showing a “breaking news” notification from CNN. This could also be used by airline websites, lightning deal sites, hotels, and many more sites. Connor said the feature isn’t too difficult to integrate:

If you’ve worked with push notifications for iOS before then this will feel pretty familiar. It’s relatively the same process as implementing notifications into iOS except there’s one more step of giving Safari your web service’s info like icons and whitelisted URLs.

But overall it’s pretty straight forward, the certificate process is basically the same too.

Once Mavericks is brought out of beta, we expect more developers to integrate this feature into their websites. It’s not clear if Apple will allow other browsers to integrate with this feature, but once you go through the initial setup process, notifications open up in your default browser.