The fact the TOC is collapsable is hardly discoverable

RESOLVED FIXED

Status

developer.mozilla.org
Design
RESOLVED FIXED
5 years ago
5 years ago

People

(Reporter: Jeremie, Unassigned)

Tracking

Details

Attachments

(1 attachment)

(Reporter)

Description

5 years ago
If necessary, the TOC can be collapse. To do so; it's just require to click, touch or activate the title with the kayboard. However, by default, the only hint that this is possible is the little arrow on the left. As this arrow is very small and have a very low contrast, it is very hard for user to discover that the TOC is collapsable.

I suggest to improve the arrow contrast and to add a small animation on it when the title is hover/focus. This will make this feature more discoverable.

Note that the title already change color when hover/focus. however, according to WCAG recommendation, this is not enough in term of accessibility. In term of discoverability it can lead to false assumption (is the title a link?).
Flags: needinfo?(hhabstritt.bugzilla)

Comment 1

5 years ago
Hi Jeremie, thanks for the feedback!  Could you provide a screenshot? I believe this has been removed for now, from what I can tell by looking at MDN right now. The intention was to be able to hide the left column (which includes the quick links and contributor tools), so that the user could focus directly on the article content and also allow for better readability of the content for small resolutions. 

I'm going to add a need info for Sean Martell to see if he can offer a solution for hiding the left column. I know this was in the original PSDs, but we wanted a subtle icon instead of explicit words directing the user to hide this column.
Flags: needinfo?(hhabstritt.bugzilla) → needinfo?(smartell)
(Reporter)

Comment 2

5 years ago
Created attachment 807114 [details]
TOC on tablette mode
(Reporter)

Comment 3

5 years ago
Here is a screenshot of the TOC in tablet mode.

In this configuration the TOC is collapsable. However, the only hint about that functionality is the arrow in the upper right corner. Eventually, if you hover or activate the title, it changes color to become dark blue. Those are very subtle hints. If TOC are very large, it's painful to have to scroll to reach the content therefor, knowing it's collapsable is a key functionality for users and IMO it should be benefit from a stronger highlight.

As per bug 915775 I also suggest that in Tablet/mobile mode, the TOC should be collapse by default.
Thanks, Jeremie. That does show up pretty light. 

We have a mockup for how the TOC will be minimized by default for mobile mode, but it must not be implemented yet. This is just a screenshot from the wireframe but it will collapse above the intro paragraph (http://cl.ly/image/3S130o2H3W0S)

Updated

5 years ago
Blocks: 927422

Updated

5 years ago
No longer blocks: 910513
I think the TOC is no more collapsable, David can you confirm?
Flags: needinfo?(dwalsh)
The TOC is still collapsable, and we've moved to using "+" and "-" icons.  Furthermore, the icons are now dark so they are very discoverable.  IMO, this can be closed as RESOLVED:FIXED.
Flags: needinfo?(dwalsh)
Oh yes, you are right. Resolving fixed. Jeremie if you can double check it would be much appreciated.
Status: NEW → RESOLVED
Last Resolved: 5 years ago
Flags: needinfo?(smartell)
Resolution: --- → FIXED
(Reporter)

Comment 8

5 years ago
Yes this is okay :)
You need to log in before you can comment on or make changes to this bug.