Improving notifications and badging in Microsoft Edge
Notifications are an important part of the web, helping users stay up to date about what’s going on. Earlier this summer we announced a set of changes to make notification requests less distracting for users. This was just the first step, and we are working to reenable the full notification prompt for sites with desired notifications while maintaining quiet requests for others. Stay tuned for more updates on this soon.
Today, we’re excited to share more about the work we’re doing to ensure users never miss out on the notifications they care about.
Notifications when you need them, not just when the browser is open
Most desktop browsers only receive notifications while they’re running, causing users to miss out on important updates if the browser is closed. And when users do finally open their browser, they’re treated to a flood of incoming notifications that may no longer be relevant. The legacy version of Microsoft Edge addressed this issue with support for background notifications while the browser was closed, and we’re excited to share that the new version of Microsoft Edge now does as well.
Taking advantage of background notifications is easy, and any site which supports web push notifications using the web standard Push API, Notifications API, and web push protocol is already supported. Web developers don’t need to make any special changes to their website for users to receive notifications while Microsoft Edge is closed—it all just works. This feature is available now for anyone using Edge 85 on Windows 10 version 20H1 and above.
Notification badges on the taskbar/dock
While notification toasts—the little messages that appear with important alerts—are incredibly helpful when used properly, some types of notifications are better suited to a more lightweight update. For years, desktop and mobile operating systems have supported showing a badge with a notification count on surfaces like the Windows taskbar, macOS dock, and Android or iOS home screen, but this feature has always been limited to native apps. With the latest version of Microsoft Edge, PWAs and pinned sites can now display badges as well.
Basic support for badging PWAs has been available on Windows and Mac since Edge 81, as well as in other Chromium browsers. Developers can set and update badges using the Badging API from documents or service workers. Service workers allow users to receive notifications or badge updates when the site or PWA is not open. However, for privacy reasons, updating a badge via the service worker push event also requires that the site show a toast notification. Users must also opt into receiving notifications from the site. Learn more about how to enable badging on your site.
Unfortunately, one of the drawbacks of badging in most browsers is that badges can only be shown on the taskbar while the PWA is open. But with the recent changes we’ve made to Microsoft Edge, badges can now be shown on the taskbar at any time. This, combined with the background notification capability, removes the key limitations of badging and ensures that users can rely on taskbar badges regardless of whether the PWA or Microsoft Edge is running. We’ve also added support for badging pinned sites, bringing the feature to any web-powered experience on the taskbar. To take advantage of these improvements, users must be on Edge 85 (for PWAs) or Edge 87 (for pinned sites) with Windows 10 version 20H1 or higher.
Between background notifications when the browser is closed, more reliable badging, and support for badges on pinned sites, users can rest assured they’ll always receive important updates for their favorite sites in Microsoft Edge. And best of all, developers who are already using service workers for notifications and badging don’t have to do a thing.
If you haven’t enabled badging for your site, this article will help you get started. Users often find badging very useful, and our research shows that sites with badges see increased engagement overall. We’re so excited to see how developers will use these improvements to enhance the experience on the web.