As technology evolves, web applications have become integral to our digital experience. While progressive web apps are not for everyone, they can be lifesavers in cross-platform computing and content availability. When installing web apps, macOS users can choose between two powerful browsers – Safari and Chrome – each offering unique features and functionalities. In this article, I’ll show you how to install web apps on macOS using both browsers. (Spoiler Alert – Chrome web apps have several significant advantages).

Installing Progressive Web Apps with Safari

Safari, Apple’s default browser, provides a straightforward process for installing web apps, giving users quick access to their favorite sites. While adding a web app with Safari is much easier, it’s not necessarily the best way (explained later in the article). Here’s a step-by-step guide to installing a web app in Safari:

• Open Safari: Launch Safari on your macOS device and navigate to the website you want to turn into a web app.
• Save to Dock: In the Mac Menu Bar, to the right of “Safari,” click “File,” and then click “Save to Dock.

• Customize and Add: With the app opened, click on the app name in the Mac Menu Bar and then click “Settings.” Here, you can customize the web app’s name and replace the default icon with a better one (later in the article).
• Location: Each web app created with Safari resides in the ~/Users/name/Applications/ folder.

Installing Progressive Web Apps with Chrome

With its extensive ecosystem of extensions and applications, Google Chrome also simplifies the process of installing web apps on macOS. Though adding an app with Chrome takes a few more steps, I think it’s a better option due to more app customization, especially its window when opened on your desktop (see below).

• Launch Chrome: Open Google Chrome on your macOS device and go to the website you wish to install as a web app.
• Access the Three Dots Menu: Locate the three dots in the upper-right corner of the browser window to open the Chrome menu.
• Save and Share & Create Shortcut: Hover over “Save and Share” in the menu and select “Create Shortcut.”

• Customize: This will open a pop-up window. Customize the web app’s name as desired in the pop-up window and check the “Open as window” option. Click “Create,” and Chrome will add the web app to the “Chrome Apps” folder in ~/Users/name/Applications/Chrome Apps/.

• Add to Dock: Open the app from the “Chrome Apps” folder (or by using Finder) and save it to your Dock. NOTE: Some web pages will have an “Install” icon at the far right of the URL window. For these, click the icon to install the app automatically. You can rename it as desired in the “Chrome Apps” folder. The number of websites programmed to do this increases as web apps soar in popularity, especially on Macs.

Benefits of Web App Installations

1. Quick Access: Installing web apps on macOS enhances user convenience by providing direct access to your favorite websites with a single click.
2. Reduced Browser Clutter: Web app installations help declutter your browser, separating essential web apps from numerous open tabs and creating a more organized workspace.
3. Offline Accessibility: Many web apps, once installed, offer improved offline accessibility, ensuring users can access crucial features even without an active internet connection.
4. Enhanced Performance: Web apps, when installed, may run more efficiently as they operate in a standalone window, reducing the processor workload on the browser.

Chrome Web Apps Have Some Distinct Advantages

Even on macOS, Chrome web apps have several advantages over Safari Web Apps. While using either provides a similar experience, the Chrome web apps are noticeably more responsive – to the point you can’t differentiate them from an installed system app.

And Chrome apps open in windows you can resize and reposition – and they stay there. Most Safari web apps open in a window that can be resized and repositioned, but the next time you open that web app, it’s back where Apple decided to put it. This infuriates me, and Apple does this with several of their mainstream apps (looking at you, TextEdit).

Changing Dock Icons

The Dock icons that install with a web app are OK, but they’re not the 50×50 squircles that Apple has recommended app developers use. Fortunately, you can easily change these icons to the modern Dock icons.

Change the Dock Icon in a Chrome Web App: Locate the web app in ~/Users/name/Applications/Chrome Apps/. Highlight the web app and click “Get Info” from the right-click context menu. In the small window that opens, drag a new icon and drop it on the small icon in the top-left corner. The next time you open this web app, it will have the new Dock icon.

Change the Dock Icon in a Safari Web App: With the web app open, click the app name in the Mac Menu Bar, then click “Settings.” On the “General” tab, click the displayed icon to open Finder. Navigate to the replacement icon, select it, and change the icon.

Where to Find Newer Style macOS Dock Icons: Several 3rd party sites offer these icons for free, and one exists for almost every app or website solution. I think the best one is macOS icons. They have an extensive collection of icons; I’ve found one for every web app I use. (HINT: these icons are also great replacements for the system apps in macOS where the developer didn’t include a new style Dock icon or just wanted to push a different icon.)

Conclusion

Whether you’re a Safari loyalist or a Chrome enthusiast, installing web apps on macOS is a simple and user-friendly process that enhances application accessibility and streamlines your workflow. There are almost no limits or restrictions with web apps – if you can view it in your browser, you can make it a web app. By following the simple steps I’ve outlined, you can make the most of your favorite website apps, turning them into convenient, standalone applications on your Mac.

My Favorite Web Apps on macOS

• Gmail
• Google Maps
• Google News
• Google Photos
• Google Messages
• Reddit
• Google Drive
• Google Keep
• Google Docs
• Google Sheets
• Google Slides
• Google Calendar
• YouTube
• Google Tasks