The Safari Browser Refreshes Tab Design

Apple’s newly redesigned Safari web browser is now available, so I’ve been trying out the refreshed “tabs”, among other things, on my iPad. While still adjusting to the updated design, I’m loving the changes so far.


Tab Trials

These aren’t the tabs you’re looking for.

When iOS and iPadOS 15 were undergoing beta testing during this past Summer, early reviews made Safari’s compact tab layout seem dire. After a few iterations, the public version of Safari landed. I wondered how bad the tabs really were and wanted to try them myself, so once my devices were updated with the new release, I set Safari on my iPad to the Compact Tab Bar. I didn’t do this because my 10.2” screen real estate was insufferable; I was simply curious to use the renewed Safari tabs as Apple had initially envisioned for the update. Being optimistic, I figured Apple’s intended tab redesign was good.

I wanted to think different.

Looking at the new ”tabs”, I realized they’re really the same as the URL address bar, just more narrow while more tabs are open. So I thought, I’m looking at web pages, not tabs. To explain better, here’s an excerpt from an article titled, ”Safari 15 isn’t bad, just misunderstood”:

“The tabs are the address bars of other pages you have open. You’re not switching tabs, you’re switching pages. This is also why the title bar and toolbar take on the same background color as the page you’re on. The entire Safari window is the page. When you switch from one page to another, it all changes to match the new page.“

Jeff Kirvin
Safari settings. Compact Tab Bar, please.

Thinking Differently

It’s only been a week, but I don’t think the compact tab design is merely a novelty; I genuinely like the radical tabs, though some reviewers still don’t. On the plus side, it’s good that Apple has provided options in Settings, letting users choose their preferred tab style. I turned on Compact tabs — I call them tab capsules — which combine a tab’s button with the URL bar; the “Omnibar” is really living up to its name. I also enabled “Show Color in Tab Bar.”

Visually, tabs have soft rounded corners, and the tab bar suggests minimal elegance. The active tab is darkened or lightened, making it easy to identify. With multiple tabs open, although the website name is truncated due to narrow width tabs, I haven’t had trouble knowing which tab I’m on or which one to switch to. Each tab has a colored Favicon, and part of the URL title is visible most of the time. These show enough to know where in the world wide web I am — with one exception, using iPad in Portrait mode with more than a handful of tabs open. To help, a simple pinch-in gesture shrinks the current tab to reveal all open websites in a tabs overview page, which shows each web page’s content and name. It’s easy to switch tabs there.

Tabs overview page in a grid.

Functionally, the tabs work well enough. Because the URL bar and tab are now combined, some previously exposed buttons hide in an overflow menu — the ellipsis /three dot button. When accessing a button, an ideal design minimizes extra gestures or taps to save time and be efficient. But an extra tap or two isn’t that big of a deal; the iPad remains a wonderful modern touch-based computer, easily accessible and user friendly. So despite a few functions living behind the ellipsis button, the Safari redesign remains nice to use.

Whimsy Works

The new compact tab bar also presents something special Apple has been known for: whimsy. The company’s software designs have sometimes been called whimsical, featuring fun things like animations. In that light, the tab capsules are delightful to swipe back and forth as they tug on the rubber-banding animation and bump into each other.

Another cool feature of Safari’s refreshed tool bar is simply color; it will now match the main color of the website being visited. This appealing aesthetic blends the tab bar with the website better, making it look and feel more native to the particular site. This color-matching complements the web page rather than contrasting from it. I like the holistic look, and although the tool bar and tabs change color, I don’t lose my location or wonder where the tabs are.

Below are several examples of websites showcasing the color-matching of Safari’s new tool bar. In particular, notice how the Six Colors site, with its constantly changing color gradient, is rendered. Safari matches the color in real-time, as it is changing, and automatically adjusts the font color from white to black and back again. It also subtly applies a lighter or darker active tab fill-color so that the text stays legible.

Six Colors with white text.
Six Colors with white text.
Six Colors with white text.
Six Colors with black text.
Six Colors with black text.
Six Colors with black text.
Starbucks
Target
Nintendo Life
Wikipedia
Psychology Today
Apple
Amazon

Overall, the new compact tab bar is great. It’s not perfect — tabs get a bit too cramped in portrait mode — but Apple did a good job in its design and implementation, thinking through different points. I even like the new pull-down-to-reload gesture to refresh the web page.

The change that I’m still adjusting to is Tab Groups. I had looked forward to the new Tab Groups feature above all, and I’m glad to have them. They change the way I surf the web, and while they add a bit of complexity to Safari, the trade-off is worth it because grouping tabs together and switching between them as needed reduces the bulk of tabs open in the compact tab bar. This improves visual and mental clarity for better focus on the current web task. More clarity yet mild complexity is a fair enough deal.

Finally, I’m also enjoying Safari’s other new features like the new Start Page that is customizable. I also plan to try Extensions, which are new to Safari; I’ve got my eye on Grammarly.

So what are your thoughts about the new Safari tab design? Do you go compact or separate? Color-matching or not? And do Tab Groups help or hurt your web surfing?

UPDATE: Credit to John Gruber at Daring Fireball for surfacing the article by Jeff Kirvin.


What do you think? Reply below with your comment. Contact or Email me at the buttons above. Thanks for reading!

One thought on “The Safari Browser Refreshes Tab Design

  1. Great post, Jason! I completely agree with you. I really like the new design, too. I like that everything just gets out of the way while reading a web page. Add to that the color matching, and I think the look is a great upgrade. I guess I can understand how some don’t like it or resist change, but for me, I’m all in!

    Liked by 1 person

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s