1714339 - Accessibility issues in new design for someone with vision problems (Keratoconus)

Status: NEW

(Firefox :: Disability Access, defect)

Description

[dorm.brand]

Attachment: ghosting tabs.png

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:89.0) Gecko/20100101 Firefox/89.0

Steps to reproduce:

-1. Have Keratoconus
0. Use these settings on Version 88: Compact Density, System Theme

1. Automatic Update to Version 89

Actual results:

I am someone who suffers from Keratokonus, an eye disease, and the new UI design is seriously hurting the usability of Firefox for me.

Let me first give you some context what Keratoconus is:
It is a degenerative, progressive, non-curable (but correctable) eye disease that causes your corneas to thin out and deform over time, from the normal spherical to a more cone-like shape. This makes light break irregularly across the cornea, causing a few different problems:
General blurriness, halos and starbursts around light sources, light sensitivity, as well as, most severly, "ghosting": With high contrast imagery, multiple (sometimes blurry, sometimes sharp) images are overlayed on top of and in the vicinity of the main image. With lower contrast imagery you can't really distinguish "the border" anymore and everything can become extremely smudged.
See https://keratoconusgb.com/2014/03/23/what-is-it-like-to-have-keratoconus/ for some good examples how the vision of someone with Keratokonus might look.
It's a relatively common disease, "the most common rare eye disease" my doctor once told me, with roughly 1 in 2000 people affected, at least here in Germany. Due to often being misdiagnosed as just a very irregular astigmatism there are probably more people who have it. Injuries from LASIK surgery can also cause a very similar disease.

The specific issues this causes with the new design are the following:

• The most significant issue: The lack of differentiation between inactive tabs causes nearby tabs to sort of "blur" together due to many ghost images. In the old design, thanks to the clear dividing line, I could "concentrate" more on each tab and filter out the additional images. In the new design, I have to strain my eyes pretty hard and mentally focus to get an overview over my open tabs.

I am someone who has a lot of tabs open (20+), and the issue is not nearly as pronounced with less tabs open (12 or something), and not present at all when all tabs have their maximum width. Still, searching through my open tabs or clicking through them now takes more time for me.

• The low contrast on the adress bar, search bar and the tabs causes these elements to smudge together very strongly. This is more present in the light and less in the dark theme. Light grey on light grey is basically indistuingishable for me. The icons on the bar have a high enough contrast to be visible, but since they are also a lot thinner (and I think slightly lighter) they are still less well visible than in the old design.

• This is probably the least important one of these issues: The removal of the icons in the hamburger menu and context menus makes browsing them a lot more inconvenient for me. I can still read text, but since letters in text are a lot smaller and close together they overlap more with the ghost images flying around, which means it takes me some focus. I can't just look at the menu like before and get a complete overview over all items, I have to read each one specifically. The big icons before were nice, because since they have a very thick distinguished shape I could easily identify them even through the ghosting.

Overall I'd say that this update has caused a 10-15% usability loss for me personally.

I have included my attempts at a image mockup of how I see the tabs in the new design (ghosting tabs.png), and how I see the menu in the old design (ghosting menu.png), because the new and old menu look the same minus icons.
They are not perfect, I basically just used paint.nets layers, copy paste and transparency tools to overlay a few images atop each other, while in reality my double images are more numerous, generally do not have a constant offset, transparancy or blurriness and only include some parts of the image (those with high contrast). I still hope it gives you an indication of what my vision looks like and why the lack of tab differentiation and low contrast might be an issue to people like me.

Expected results:

I am not opposed to the new design on general, I think in some areas it looks quite pretty to someone with normal vision. I also know that a lot of these issues can be fixed with themes (mostly the contrast thing) or custom css (tab seperators, icons). For now I'm still using the about:config setting to switch back to the old design, while it's still available.

I don't think however, that a browser used by so many people should require those with visual, spatial or other issues to themselves fix the UI, which was previously working fine for them. Especially if you have to invest significant time into custom CSS which might break with further updates and require additional time fixing. (To be honest, I have not yet looked at how custom CSS works, I am just going from my own experience with similar things, maybe it's more break-resistant than I thought.)

A theme with slightly increased contrast shipped with the browser and an option to restore tab seperators would be a very welcome addition. Please excuse the length of this bug report, I wanted to get all my thoughts across, and thanks for your consideration.

Comment 1

[dorm.brand]

Attachment: ghosting menu.png

Comment 2

[Morgan Reschenberg [:morgan]]

Thanks for the in-depth report!
Triaging as S2 due to combined difficultly of access from lack of contrast, no icons.

Comment 3

[Daniel Bodea [:danibodea]]

Confirming as enhancement! The new design is a little less accessible for users with low vision.
P.S. I recommend using the High Contrast feature of the corresponding operating system.

Comment 4

[Maire Reavy [:mreavy]]

Hi Asa, Morgan, & Jamie -- I'm wondering if this bug should be duped to bug 1704347 where the real work is happening to fix this problem? I believe the a11y team is helping shepherd this fix, but we can't fix it directly ourselves.

Comment 5

[Morgan Reschenberg [:morgan]]

(In reply to Maire Reavy [:mreavy] from comment #4)

Hi Asa, Morgan, & Jamie -- I'm wondering if this bug should be duped to bug 1704347 where the real work is happening to fix this problem? I believe the a11y team is helping shepherd this fix, but we can't fix it directly ourselves.

I'm going to mark this bug as a "see also" on bug 1704347, since I think that bug is more about active tabs and this is about tab separation.
I'll call out this bug exists, though, since I think these are similar issues :) Thanks for the flag.