Progressive Web Apps on Windows look more like native Windows apps than ever before. Thanks to a new feature Microsoft just announced, Window Control Overlay, developers can now customize the title bar of their PWAs.
Previously, web apps didn’t have access to this feature, which could lead to white spaces, color clashes, and other quirks that made some PWAs look decidedly anti-app. The new feature should help developers fix these issues. Web apps now have access to the “full surface” of their app window, excluding only the buttons in the top right corner – minimize, etc. remain untouchable.
“Recently, with many new web features in the Chromium browser engine and UX changes in Microsoft Edge and on Windows, installed desktop web apps are really starting to look like native apps,” wrote Patrick Brosset, Senior Program Manager , in a blog post for Microsoft. “While native apps were able to display content anywhere in the app window, including in the title bar, installed web apps were forced to use the default experience, causing them to makes them visually different. We’re excited to announce the availability of a new PWA feature that bridges this gap and helps blur the line between apps and websites even further.
This may not be shocking news for anyone who regularly uses PWAs. Microsoft developers initially offered the feature in January 2020, showcasing it with a demo web app. Chrome started supporting window control overlays as a beta feature in April, and the feature rolled into Chrome 105 in August. With Chrome and Edge now supporting the tool, it looks like this new look for web apps may become quite mainstream.
“We think PWAs are great for building desktop web apps. Turning your website into an app that really looks like it belongs on the desktop has never been easier and using the Window Control Overlay feature will help you create much more modern and engaging desktop apps for your users” , reads the message from Microsoft.