cancel
Showing results for 
Search instead for 
Did you mean: 
defcon1
Strollin' around
Status: New idea

Make tabs visually distinguishable from another (as they once were)

Lately I can't visually tell where one tab begins and the next begins, except by referencing the "X" (close tab) buttom, since it's all white text on a black background.  How about making them look like actual tabs again or alternating the colors or something?   

The visual appearance should follow the function. Being able to distinguish one tab from another is a functional issue. Compare the attached screenshot (old vs new appearances).  The old way is clearly superior from a functional perspective.

At least give us an option in the Settings. It doesn't have to be a default (though I suggest it should be). 

8 Comments
Krille
Strollin' around

In one of the redesigns the background color for the current tab in the tab bar was lost. Bring it back to make it easier to spot the current tab. The current very faint border around the current tab isn't enough.

Also bring back the frame around inactive tab buttons in the bar.

By no means make the tab buttons any larger or change the shape! Just copy the design of the current tab button to the inactive buttons and give the current one an additional background.

Status changed to: New idea
Jon
Community Manager
Community Manager

Thanks for submitting an idea to the Mozilla Connect community! Your idea is now open to votes (aka kudos) and comments.

Status changed to: New idea
Jon
Community Manager
Community Manager

Thanks for submitting an idea to the Mozilla Connect community! Your idea is now open to votes (aka kudos) and comments.

steel835
Familiar face

No offense, just interested - are you really struggling with distingushing tabs from one another or you just don't like this UI language? For me having a favicon as an visual anchor point is enough (like, a tab can't have 2 favicons, plus, I usually search for the favicon or a word, move a mouse there to click it, see that the whole tab is highlighted and now I see that I click in the right place, so the separator thing wasn't really important for me earlier). Now they show a default icon even for those tabs that don't have it. Also, currently many websites (and modern design overall) use this approach of having less solid lines or separators to clean out the visual clutter and make it more appealing visually, because spacing usually works well too (for example, look at the header of this Mozilla Connect website - no separators, borders or even icons, yet distinct buttons with text on them)

But if it's not an eye itch and really a problem for some category of people, then maybe it really worth to bring it back. I'm just wondered how it feels like exactly.

defcon1
Strollin' around

Also: it's nearly impossible to see which tab is active.  The "highlighting" of the active tab is so light as to be nearly indistinguishable from the surrounding tabs.  This needs to be fixed as well.

Krille
Strollin' around

Yes, please. However the inactive tabs should not have black text on a darker grey background since this reduces the contrast of the text and hinders readability. Make sure to use colors with a decent contrast.

Also vote here: https://connect.mozilla.org/t5/ideas/make-the-current-tab-easier-to-spot/idi-p/3926

defcon1
Strollin' around

Responding to steel835: I'm really struggling. I'm an end user, not a developer, and don't know anything about the "UI language."   I really miss the old days of early operating system GUIs where all the different areas of a window were clearly distinguishable from one another. The easy-to-understand boxy look of everything made it much easier to visually distinguish different areas of a window compared to the modern "stylish" sea of black.  If you go on Google Images and look at screenshots of Gnome 2.0, Mac OS 9, Windows 2000, the window appearances were much better. Several of them had a gray background for multiple areas of the window interface, but separated by dark lines, adding contrast and helping guide the user's eye to the area that the user needed to be looking at.

MateusRodCosta
Strollin' around

I believe what could help here is just having a small vertical line between each tab so it can act as a separator, that way you could actually distinguish one tab from the other.