Aggressive Web Apps - JSConf EU

Push notifications on the web can be a force for good, but is that how they are coming across? We’ll take a look at how push notifications permissions are being implemented and how we can do it better. We’ll then look at the notifications themselves, find out what the best kind of notifications are and how not to wind up with your app’s, or the entire web’s, notifications blocked forever.

https://2018.jsconf.eu/speakers/phil-nash-aggressive-web-apps.html

---

Links:

Discussion on requiring user input: https://github.com/WICG/interventions/issues/49
Permissions API spec: https://w3c.github.io/permissions/

Transcript

1. AGGRESSIVE WEB APPS
2. BROWSING THE WEB IN 2018 @philnash
3. Phil Nash @philnash http:/ /philna.sh philnash@twilio.com
4. PROGRESSIVE WEB APPS @philnash
6. Service Worker Support ✅ ✅ ✅ ✅ ✅ @philnash
7. APP LIKE FEATURES @philnash
8. PUSH NOTIFICATIONS @philnash
9. Push Noti cation Support ✅ ✅ ✅ ❌ ✅ @philnash
10. @philnash
11. @philnash
12. @philnash
13. Push noti cations are good How to push Good push noti cations Permissions @philnash
14. HOW TO PUSH @philnash
15. @philnash
16. HOW IS NOT THE PROBLEM @philnash
17. WE NEED TO TALK ABOUT... @philnash
18. GOOD PUSH NOTIFICATIONS
19. Dear every website, I never want push noti cations. Thanks. - Everyone @philnash
20. I DON'T BELIEVE THIS @philnash
21. PUSH NOTIFICATIONS ARE INCREDIBLY USEFUL @philnash
22. Side note I believe that you don't want push noti cations @philnash
23. Good noti cations • Appointment reminders • Chat alerts • ETA alerts • Event updates @philnash
24. TIMELY, ACTIONABLE AND PERSONAL @philnash
25. TIMELY @philnash
26. @philnash
27. @philnash
28. TIME OF DAY, TIME ZONE, NUMBER OF NOTIFICATIONS @philnash
29. ACTIONABLE @philnash
30. Actionable noti cations "Daisy sent you a message" "Your car is here" "You can check in now" @philnash
31. PERSONAL @philnash
32. Personal noti cations "Daisy sent you a message" "Your car is here" "You can check in now" @philnash
33. KNOW WHEN TO BREAK THE RULES @philnash
34. @philnash
35. LET THEM OPT OUT WITHIN YOUR APPLICATION @philnash
36. @philnash
37. THE ALTERNATIVE? @philnash
38. DEMO
39. @philnash
40. @philnash
41. @philnash
42. WE NEED TO TALK ABOUT... @philnash
43. PERMISSIONS
44. Ketan Joshi @KetanJ0 Dear website, - I don't want you to post notifications to my desktop - I don't want to subscribe to your thing via a popup - I don't want you to know my location - Please stop autoplaying that video - I am angry and sad now 11:17 AM - May 13, 2018 31.4K 8,756 people are talking about this @philnash
45. Permissions • Push noti cations • Geolocation • Media Devices • Bluetooth, MIDI, WebUSB... @philnash
46. @philnash
47. @philnash
48. @philnash
49. @philnash
50. @philnash
51. NO CONTEXT @philnash
52. STOP THIS!
53. @philnash
54. Firefox @firefox You know who loves push notifications? . . . yeah . . . We couldn't think of anyone either so we made it so you can deny sites from even asking if you want to receive them: techcrunch.com/2018/03/13/fir… 12:04 AM - May 23, 2018 Firefox can now block those annoying notification requests @philnash
55. PLEASE
56. DO NOT DEMAND NOTIFICATION PERMISSIONS ON PAGE LOAD @philnash
57. WORRY
58. PERMISSIONS WILL BECOME THE NEW POPUPS @philnash
59. PERMISSIONS WILL BE REVILED AND DISMISSED BY USERS @philnash
60. WHEN USERS DISMISS PERMISSIONS BY DEFAULT THE WEB PLATFORM LOSES ITS POWER @philnash
61. @philnash
62. PLEASE
63. DO NOT DEMAND NOTIFICATION PERMISSIONS ON PAGE LOAD @philnash
64. SUGGESTIONS
65. FOR NOW @philnash
66. WAIT @philnash
67. @philnash
68. @philnash
69. UNLESS IT'S OBVIOUS @philnash
70. @philnash
71. FOR THE FUTURE @philnash
72. TOGETHER WE CAN FIX THIS! @philnash
73. SUGGESTION? BROWSERS SHOULD ENFORCE A USER INTERACTION BEFORE ASKING FOR PERMISSION @philnash
74. GET INVOLVED @philnash
75. Get involved https:/ /github.com/WICG/interventions/issues/49 @philnash
76. Get involved Permissions API https:/ /w3c.github.io/permissions @philnash
77. CONCLUSION
78. PUSH NOTIFICATIONS ARE AWESOME FOR THE RIGHT THINGS @philnash
79. DO NOT DEMAND NOTIFICATION PERMISSIONS ON PAGE LOAD @philnash
80. MAKE NOTIFICATIONS TIMELY, ACTIONABLE AND PERSONAL @philnash
81. OR DON'T. BUT DO ALLOW OPT OUTS @philnash
82. IF USERS BLOCK ALL NOTIFICATIONS THE WHOLE WEB SUFFERS @philnash
83. USERS WILL BLOCK IF THEY HAVE A BAD EXPERIENCE @philnash
84. WE CAN PROVIDE GOOD EXPERIENCES FOR BOTH PERMISSIONS AND NOTIFICATIONS @philnash
85. BUILD PROGRESSIVE WEB APPS @philnash
86. NOT AGGRESSIVE WEB APPS @philnash
87. THANKS!
88. Thanks! @philnash http:/ /philna.sh philnash@twilio.com