Safari 15 Changes in Beta 6
Juli Clover (tweet):
Throughout the beta testing period, Apple has been tweaking the design of the Safari browser on the iPhone and in beta 6, there are further refinements. The bottom tab bar has been redesigned to appear below page content, and Apple has also added a toggle to show the address bar at the top of the iPhone rather than the bottom.
[…]
With the bottom view option toggled on, Safari offers a dedicated toolbar with buttons at the bottom of the interface, which is also an improvement over the prior floating design.
Apple has also introduced new setting options to remove the website tinting and to enable a Tab Bar while in landscape mode. There was previously a “Show Color in Tab Bar” accessibility setting, which appears to be the same as the new “Allow Website Tinting” toggle.
It takes 5 seconds to see that this new Safari design is much better. Instantly clicked with me.
Bringing back a toolbar allows easier access to controls. More views are using the half-sheet style. Putting the URL bar at the top reverts to the old Safari. All of this is great.
Wow. That…looks like crap.
Either do a new feature or don’t. I feel like this option to leave everything the way it was is more confusing.
I’ve been trying to tell y’all that fast tab switching is clearly a design requirement for iOS 15 Safari!
I like this design – looks at home and works well.
Very strong “fine, whatever” vibes from the new ‘below’ mode. And the new ‘option’ is basically “ i’m sorry I’m sorry I’m trying to remove it”
I think the way to read this is ‘intermediate step to where we want to go eventually and we’ll see you in iOS 16’. My bet is that the ‘url bar at top’ option stays for years though.
Hopefully the one lesson learned that sticks though is not to bury high traffic actions under additional layers for very little win aside from aesthetics.
These are incremental changes to a big redesign, and I think they create the most successful iteration yet. Bringing the toolbar to the bottom is undeniably a muscle memory breaker, but I think it is worth the cost because it keeps a user’s hands in the same position more often. You can go from scrolling through a webpage to entering a URL without once shuffling the device in your hands.
This new version still has some rough edges. The huge drop shadow around the address bar is a nonstandard effect that confuses me. I guess it is supposed to indicate that the element is floating and interactive, but it creates a kind of blurry grey mess. The drop shadow also visually disconnects the address bar from the page or tab it represents.
You can tell this is the mostly final Safari design for iOS because the animations are all polished AF.
Safari Technology Preview release 130 includes bug fixes and performance improvements for Web Inspector, CSS, JavaScript, Media, Web API, and IndexedDB.
Previously:
- Safari 15 vs. Vivaldi When Matching the Web’s Colors
- Safari 15 Changes in Beta 4
- Safari 15 Changes in Beta 3
- Safari 15
Update (2021-08-21): John Gruber:
In a very real sense, the system worked. It’s good that Apple tried something ambitious and original with the layout for Safari on iPhone. The reason for the trend toward moving more navigation controls to the bottom of the screen is obvious: our phones are bigger than ever (iPhone 12 Mini aside), and our hands aren’t growing. It’s also good that Apple was receptive to the feedback from those using the developer and public betas. They listened, they fixed the design to address the problems, and here we are, with a layout for Mobile Safari that I think is better than ever. (I hedge with “I think” only because it just shipped — my opinions aren’t fully formed.)
The unusual part is that we got to see Apple’s design process play out in public.
Update (2021-09-08): Jason Snell:
The design of Safari 15 on the iPhone has gone to a better place, but Stephen Hackett reminds us that trouble on the Mac and iPad remain[…]
5 Comments RSS · Twitter
I think this is easily the best iteration yet (it is a little disconcerting watching how the sausage gets made in real time), but at this point, they should've just done two toolbar rows.
While it looks cute to have the first row pop out and the second be translucent, it tricked my mind into thinking that some of these buttons were disabled and others weren't (the different foreground colors on the buttons don't help).
Beta 6 is my first version of iOS 15. I actually like the bottom toolbar. Yes it breaks my muscle memory and it will take a bit to get used to, but being able to swipe between tabs and having all the buttons where my thumb can reach it is nice. I switched back to top and realized how much I like the bottom. I'm glad all the important buttons are there though, unlike what I saw in previous design screen shots.
@sal - I think they did that because in landscape its easier to reach the thumb up top than the bottom, but agree it is a bit odd.
Yup. I love the much nicer tab navigation. (You can also, on the rightmost tab, swipe from the right edge to create a new tab.)
Beta 6 Safari is best Safari, IMHO.
I'm on the fence about having both options since I really like the floating tab bar at the bottom, but having the option to revert to the old eway is fine.
However... Apple has removed the landscape tab bar entirely from Safari and SettingsiPhone SE 2020. It's just not there and no matter which option one chooses, you still gett the full/old top bar. Beta 5 had the lovely tab bar in lanscape mode. I don't know why they couldn't leave that as the default when we select the bottom tab bar and have the old/full/single address bar when choosing that.