138 comments

[ 5.3 ms ] story [ 114 ms ] thread
With Firefox, you get the best of both worlds. You get favicons, but you also get a minimum tab width so you can always read the first word or two of the page title. Rather than squishing down infinitely like Chrome, they just quickly scroll side-to-side more like Safari.
I wonder when, if ever, vertical tabs will become the norm, or even a well-supported option.

They seem to resolve most tab issues while also being a better use of space in many use cases.

switched on firefox and can't look back!
Side-scrolling tabs are one of the worst UI innovations I've suffered in recent years. They wreak havoc on spatial tab organization, make it impossible to see how many tabs are open, and slide out from under the mouse cursor unpredictably when clicking.

The original Safari behavior of a vertical overflow list of tabs, favicons included, keyboard searchable and navigable, was much more usable. https://i.stack.imgur.com/eyXum.png

Strongly disagree. That list menu made it hard to reorganize tabs, required a mouse click, and arbitrarily split your tabs into those visible and those relegated to some obnoxious menu.
Spatial tab organization is already lost any time you open or close a tab.
It really isn't, human brains are clever enough to deal with that quite well.
And they're not clever enough to deal with Safari's tab bar?

Just as humans can adapt to the tab bar shifting when tabs are opened and closed, humans can also adapt to the concept the tab bar focusing on the left or the right and collapsing the opposite side.

The point of my previous comment is you've lost literal spatial organization already, as the exact same position isn't guaranteed to be the same tab after other tabs have opened/closed, so we're already talking about dealing with relative positioning of tabs instead of absolute positioning. And Safari's tab bar does not screw with relative positioning.

It gives you less clear landmarks though. Spatial navigation through 20 items with no differentiation isn't easy. Even if you know "9 items from the right", you can't do easily do that subconsciously. "The tab next to the Stack Overflow one" or "The third Stack Overflow tab" is a lot easier in comparison. At least for me, navigating a lot of sites without favicons or large amounts with the same one decreases efficiency a lot, for exactly this reason.
This particular thread isn't about favicons at all. It's about Safari's side-scrolling (once you have enough) tab bar.
Then I misunderstood your original comment (which I took to mean spacial navigation doesn't work, scrolling or no scrolling), my mistake.
If your tabs scroll in Firefox, there’s a dropdown at the right which lists all tabs. I find this decidedly superior to the overflow behaviour you describe.
Just another reason why Firefox is king.

Another killer feature for me is that you can basically middle click anything and open it in a new tab, whether a bookmark, back button, etc. Makes some tasks very intuitive and trying to maintain the same workflow on Chrome is extremely frustrating. I cannot understand for the life of me why this isn't a native feature in Chrome.

Middle click works the same way in Chrome
You can even middle-click-and-hold the back button, bringing up the tab history so you can go back to a page several steps back in a new tab!
Doesn't work for me on GNU/Linux. I checked a Windows VM and it works from there. My browsing mainly occurs in Linux so this is still an issue.
Humm, it worked for me in a VM running Ubuntu.
With Firefox you can go one better and install the TabMixPlus extension and get multi-row tabs. I don't know how anyone functions with Chrome or Safari -- any reasonable number of tabs is unusable to me.
Enjoy it while it lasts—as of Firefox 57 (November) such functionality will be dead in the water. The sidebar panel is able to be used for things like vertical tabs, but there’s nothing which would allow the browser tab bar to wrap onto multiple lines (and I don’t expect it to ever happen).

(I run Nightly and have successfully migrated all my extensions to WebExtensions alternatives with only very minor loss or change of functionality.)

Yeah that will probably end my use of Firefox or I'll just "never" upgrade.
I’ve been a Firefox user since 0.93, with a year or so in the middle when I was forced to use Chrome as my primary browser because I was needing to run it from a USB drive and Firefox was just too slow from a USB drive. (I could switch back with Firefox 4.)

There are really good reasons for the move to WebExtensions, technical, for security and for performance. I was intensely sceptical of the timeline initially announced, but as a Nightly user I can report that November is actually sounding very reasonable now.

Not upgrading your browser leaves you insecure, and within a year or two websites will start breaking on you. In little things of design, mostly, but steadily more and more. Oh, and you’ll miss out on the continuing performance improvements of the Quantum project.

(Also, what would you migrate to? Even without XUL addons, Firefox is still going to be better for what you want than all the mainstream alternatives.)

I obviously understand all that but you have to understand is that I've been browsing with this feature for over a decade. It's fundamental to how I use browser -- even now I have over 40 tabs open and they're all nicely visible.

I've tried to use Chrome for the performance and stability but the lack of multi-row tabs always kept me on Firefox. It's just such an amazing piece of usability.

Imagine if Microsoft just removed the ability to copy/paste in the next version of Windows. Despite the improved performance and security of each successive version of Windows -- would you be so quick to upgrade?

> Not upgrading your browser leaves you insecure, and within a year or two websites will start breaking on you. In little things of design, mostly, but steadily more and more.

This blackmailing is the worst, and what I hate about modern software.

I think you only see fav icons in safari mobile in the bookmarks menu as well.
I wonder if it's because Apple didn't like the mush that 16x16 favicons become on Retina screens with their preferred linear upscaling.

Of course, other sizes of favicons are possible for use by site owners (.ICO supports multiple resolutions in a single file!), and there's no particularly good reason to use linear upscaling for what's often pixel art.

This predates Retina by like a decade.
(comment deleted)
IE used to use 32×32 for saving a bookmark to the desktop, 16×16 for the address bar favicon.
All favicons appear normal on retina display. Source - writing this on a retina macbook.
Totally valid. If they were going to change one thing about Safari, though, for me it would be to drop the required $99/year payment for a developer program membership just to distribute a signed Safari plugin. You can't really distribute plugins without a developer certificate, as Safari uninstalls them automatically when the browser restarts. Probably the worst Safari-related decision Apple has made recently, much worse than favicons, though I completely agree that they should return.
You can always distribute unsigned ones. You lose the ability to auto update however, as well as the extension store
So far, I haven't found a way to stop Safari from uninstalling an unsigned extension when it restarts. Have you? Because that would be great! More conversation about this issue: https://forums.developer.apple.com/thread/3675
I've just installed the following extension, and it persists when I restart the browser:

https://github.com/JoeKuhns/PiedPiPer.safariextension

That extension is signed. You cannot build a .safariextz archive without paying for a signing certificate.
Indeed. If you add an unsigned plugin (that is, one lacking a .safariextz file) to Extension Builder and try to install it from there, and you do not already have a developer certificate, you will see the message, "Without a Safari Extensions Certificate, this extension will only be available until you quit Safari." And it will be so.
Firefox has a similar annoyance but at least it's not behind a paywall. I wrote a plug-in I intended to be for personal use but I had to register and publish it on their site because it was removed on close. I'm not sure why they want to encourage a bunch of crap in their add-ons store but what infuriates me to no end is that they think they know better than me what I want to allow to run on my machine.
AMO allows for unlisted add-ons that just get auto-scanned for obvious problems and then signed immediately. That's the preferred method for cases like yours.

Alternatively, you could run Nightly (or an unbranded build[1]) and disable add-on signing, although that opens you up to having _any_ unsigned add-on installed, not just your own.

[1] https://wiki.mozilla.org/Add-ons/Extension_Signing#Unbranded...

> I'm not sure why they want to encourage a bunch of crap in their add-ons store but what infuriates me to no end is that they think they know better than me what I want to allow to run on my machine.

The issue, as always, are malware installers on Windows.

Many companies (including Google) pay developers on Windows to ship their addons (or even entire browsers) with the installer, and to auto-install them.

This is how Google got their toolbar addon installed everywhere in the past, how Chrome is installed as default browser without the user noticing, how Bing gets their toolbar installed everywhere, and so on.

It's also used by other actors, not quite as evil as Google or MS, to distribute their malware addons and automatically install it in browsers.

By enforcing registration on AMO, Mozilla can easily remove an addon that was distributed this way for all users.

Yes I’ve found a way, enable the develop menu, and at the bottom of the menu you will see an option to “allow unsigned extensions” .
Safari should also stop restoring private windows upon reopening.
Whoa, that's not cool. It stores all your private tabs on disk somewhere?
They’re copying iOS behaviour
Agreed, but it should change. On iOS the OS can kill the browser for you so you may still want that page you didn't kill.

On the OS quitting the browser should reset it back to a normal state that doesn't include the private tabs you had.

I don't really see why a distinction would be made there. iOS's and macOS's process models are being made more similar as time goes on. And as a heavy user of both platforms I'd find it surprising if it didn't behave this way. An option to change it would be welcome, though.
It's worth noting that Safari _can_ display favicons. If you pin a tab, it uses the favicon. It's even displayed in monochrome until you hover over the tab so they've definitely worked out a way to display them.
That’s not the favicon that’s being shown there. It is either a b/w mask as defined by the site, or defaulting to the first letter of the site’s name.
Unfortunately there is a general trend towards removing colorful icons and I hate that trend with a passion.

Take for example the setting menu from stock Android: Yes, there are still icon but they all have the same color and it is really difficult to tell them apart. Every time I go to settings I have to search around until I find the settings I was looking for. If it had colorful icons then navigation would be easier because my brain would learn "blue icon = keyboard settings"

Or take Chrome on Android: Open Chrome, press the three dots on the bottom right for the menu and try to find the 'search in page' entry. Every time i wanna search something I have to read half of the menu items to find the search function... If it would have a distinct icon it would be much easier to find.

My bookmarks bar is a row of unlabeled favicons arranged by color. Beautiful and extremely efficient. I only need to store the color of an icon in my head, not the icon itself or the url. If this ever gets taken away from me I will become extremely cross.
This is exactly what I do. I am floored to hear that people are considering moving away from favicons. It's a tremendous space saver.

The all-out war on bookmarks and the original ways we organized information back in the 90s on the web is getting to be absurd.

Not to mention the fact that, as others have said, scanning your tabs for images is much, much quicker than scanning text. Favicons also give your site character and create a lasting visual impression of your brand. They are as important as a logo. Seems like a major step backwards.
I'd love to look at your bookbar bar, if you are comfortable sharing a screenshot. I'm trying to arrange my bookmark bar since quite a while and can use some pointers from your setup.
do you have an email I can send it to?
Outlook is another terrible offender. Maybe for mailboxes in the sidebar it didn't add much, but the icons were really helpful if you're using the CRM integration.
All Microsoft products after 2010 are worst offenders. The nice Office 2010 and Windows 7 and beautiful high res icons and very nice color schemes - gone. I cannot stand the Win8/10 and Office 2016 bland look and mix of legacy icons botched with a Photoshop filter to make them grayscale and new boring grayscale icons. Everything looks white and grayish, some parts of the window can be dragged around, some are click-able ...but one only knows by try-and-error. Well I reverted back to Win7 & Office 2010 - so much more pleasing to my eyes.
I cannot agree more. Recently I was just happening to run a VM in Hyper-V where the VM is displaying a maximized window. There is literally no boundary between the hyper-V toolbar and the title bar of the window inside the VM. It is infuriating because I keep dragging the wrong thing.

Windows 7's appearance may not be "modern", or it may be too busy, but it looks so much better to my eyes too.

That's what I dislike with the recent Jetbrains products.

Designer replied they were fixing the problem of the colorful icons being too "distracting". Still don't understand how a grey UI with grey icons is better...

Older versions of Android had colourful icons, but often those colours changed between versions. This is the worst possible sin, and possibly part of why they don't any more.
A frustrating trend indeed. I really miss colours in the macOS Finder: The monochrome sidebar is frustrating, the default folders (Pictures, Music etc) are harder to distinguish than in 10.4, and Finder colour labels have been replaced by tiny "tag" bubbles.

This was so much easier to scan at a glance: http://tb43.com/wp-content/files/finder_011.png

It's the other way around on mobile. Icons are still colourful (although too many are blue-on-white), but they all have the same shape, and Apple hates icon labels with a passion. In iOS 11, they are almost impossible to read on the stock wallpaper, and the new Dock gets rid of them altogether: http://media.idownloadblog.com/wp-content/uploads/2017/06/iO...

When I am a little low on energy, I regularly catch myself tapping the wrong iOS app just because it has the right colours at a glance. Icons should just always have both a colour and a shape, no matter how much it frustrates designers.

I agree with you broadly, but not about the android settings.

I mean, they just look so much better this way (Nougat). Perhaps your requirements would be better addressed in the accessibility settings. Have you tried turning high contrast on?

For most of us, the better looking icons are a non-issue. I personally don't even look at them to navigate, I can read the options.

> I mean, they just look so much better this way (Nougat)

But that's exactly the problem. On furst glance it looks better but when you search for something then 20 icons of the same color just don't work that good. Give me ugly but visual distinct icons and I would be much happier.

Even more frustrating is that the names of the options is different across versions of chrome. On my phone it's called 'find in page' instead of 'search in page'
Kinda cracks me up when I see Google referenced in a design or UX conversation (read: article).
I much prefer to have no favicons. They're a really poor indicator of the content of the tab, especially when 20 of them are Stack Overflow and Read the Docs.

Safari has a really good way of visually distinguishing between tabs, a two fingered pinch on the trackpad and I can see the actual content of every tab that I have open. Can't remember the last time I even looked at the text in the tabs.

Indeed, it is good. And for non-trackpad-users, Shift-Command-\ is the keyboard shortcut for "Show All Tabs," which also makes the tabs searchable.
Tab Exposé is one of my favorite features in Safari (Right behind Reader view) that I wish other browsers copied.
it's cool, but can't scroll them w/o mouse/trackpad. cursor keys don't work :(
The user experience once you have many tabs open in Chrome just completely falls apart. The tabs shrink so tiny you can hardly see them, and there's no way to reorganize them other than to one-by-one pull them out into a new window.

Safari, on the other hand, has Tab Exposé and also horizontally scrolls the tab bar once there are too many. It's such a simple thing that makes a huge difference.

You can shift click a range, or command click a disjoint set, of tabs in chrome. And then with one mouse drag move all of them to an existing window or create a new one. It's a feature that I wish safari had (although I have tried tab expose)
One of the few features I like in Edge is the tab preview feature.
I tend to limit my open tabs to the maximum that can be displayed with clear favicons. Works for me.
I think it's even more useful with 20 stackoverflow tabs. I'd prefer knowing that a particular range of tabs is all stackoverflow, or all some other site. And I don't know why, but I never got into the habit of the pinch to view all tabs feature.
Sadly the title of a page is also a really poor indicator of the content of the tab.
I agree for sure. At the very least have it as a preference. My bookmark bar consists of icons w/ no label. I treat Favicons more or less like I do iOS app icons.
It should first start displaying the whole URL on my phone.
If you tap on the URL bar, it does.

What's the argument for showing it all the time? There's not enough space to show the entirety of even relatively short URLs without scrolling (and scrolling means tapping on it anyway).

Personally, I am not a fan of Favicons; it feels like yet another form of advertising - which the web has more than enough of.
That doesn't seem to make sense. Favicons tend to be the website logo, making it easy to pick out the tab when you have multiple open. The favicon tells you the site, the tab title tells you the page.
(comment deleted)
By far my biggest gripe with Safari is the behaviour of the URL bar: https://www.reddit.com/r/Safari/comments/2uikrg/any_way_to_d...
I agree a centered URL is a bit of aesthetic ridiculousness when exposing the entire URL.

Aesthetic opinions aside, the linked complaint relies on a workflow that could be considered a UI anti-pattern.

  1. Move hand to mouse.
  2. Position cursor.
  3. Click URL bar. (activate caret)
  4. Move hand(s) to keyboard.
  5. Type replacement.
The following workflow lends itself more easily to UI automation (and muscle memory)

  1. Type Command-L. ("Open Location…" which selects all in location bar.)
  2. Type left/right-arrow. (Move caret to left/right side of location bar.)
  3. Option left/right-arrow. (move caret left/right one "word".)
  4. Type replacement.
The distinct advantage of the second workflow is that it is susceptible to the automated editing of URLs of many tabs using Keyboard Maestro [0] and a simple AppleScript.

Combined with keyboard tab-switching (Command-shift-[ and Command-shift-] for next left and right tab, respectively, you can fast web-page switch to spot small differences similar to the way in which a Hinman Collator works to highlight differences between bound books. [1]

Admittedly (and a bit off-topic), the link I provide for the Hinman Collator doesn't exactly illuminate what such a device does. A better demonstration of how collation can be used to highlight subtle visual differences between two artifacts can be derived in the service of solving a puzzle from one of my favorite web sites, Kindertrauma. [2]

The puzzle, which asks you to spot the differences between a series of two photos, is mildly challenging. That mild challenge is reduced to laughably simple when the images are collated. [3]

EDIT: Move parenthetical into footnote. Add adverbial phrase to footnote parenthetical. Rewrite Kindertrauma example. General readability.

[0] https://www.keyboardmaestro.com/main/ (I'd be embarrassed to name drop Keyboard Maestro yet again here on HN if it just weren't so darned useful. A truly amazing piece of software Keyboard Maestro is. No relationship except as a satisfied user.)

[1] http://library.unc.edu/2016/11/video-hinman-collator-compare...

[2] https://www.kindertrauma.com/the-thing-2011-funhouse/

[3] https://secure.fluffycloud.net/shimmering/kindertrauma/20111...

I made a Safari extension that simulates favicons by prefixing tab titles with emoji. It's not a perfect substitute, but it's made it a lot easier for me to distinguish between tabs.

https://github.com/logandaniels/emoji-tab-icons

Out of curiosity, how does it know which Emoji to use?
so you don't even read 15 lines of readme?
That type of response probably won't get too many people rushing to your GitHub that you are suggesting here people should try out. To answer his question, it appears it allows you to manually add/choose a emoji on a site by site basis. As of December it looks like you can now set differently for different subdomains or other variations. Also appears to offer some suggested options to choose from for popular sites.
Firefox shines here. Not only does it have the favicons but typing a site in AwesomeBar will prompt to "jump to tab".
And "% term" searches through open tab urls/titles
This is amazing. I thought I was efficient at using my browser, but I clearly have ground to cover. Thank you!
It'd be awesome if that would also search through page content.
Is Apple even still working on Safari?
They release every other week updates to Safari Technology Preview as well as daily builds of Webkit. Both include new features.

They have blog posts about feature development as well here: https://webkit.org/blog/

Forget favicons... it supports emoji domains!
I never understood why people wanted their tabs on the top instead of on the side. I'm using [Tree Style Tab][1] on Firefox and whenever I need to use any browser I feel limited by screen real estate. With modern widescreen displays I can have my tabs on the side and the titles are still readable while the website content is readable, too. What's not to like?

[1]: https://addons.mozilla.org/de/firefox/addon/tree-style-tab/

I use a 4k monitor and my browser window is usually 1280x2160.
Same here, portrait orientation is amazing for everything that's not watching video. The latest Gitlab redesign really irks me because the left sidebar takes up 30% of my tall and narrow screen.
Portrait i.e vertical orientation screen gives you so much more overview for source files. For portrait orientation even smaller screens benefit from 4k
Takes up way more screen space to show content I don't usually need/want to see. Cool that it's an option, though.
I usually have less than 5 tabs open at any time. Side tabs are a huge waste of space for me.
You can hide them. The tabs sidebar only opens when you hit the key combo to open it or bump the side of the screen with your mouse. If anything it saves space.
I wouldn't mind favicons in the url bar when the cursor isn't in it too if we are adding things to safari.
Daring Fireball should use a larger font and better contrast. Thank goodness for Reader mode.
I completely agree, one of the things that keeps me coming back to Chrome is favicons in tabs which is particularly useful when you have a bunch of tabs open. I also have a favorites bar with purely favicons so I can fit as many of my regular sites/resources in there as possible while still looking visually appealing.
iTunes Connect and other Apple properties that developers tend to bookmark should have favicons. Then you could just edit out the title/name and identify by icon.
This is the single reason I don't use Safari.
yyyea.... NO. KISS
Sheesh, Daring Fireball whips up another tempest in a teapot. If he isn't more careful, Gruber could lose his "most favored blogger" status at Apple.