Detailed Updates in project goals blocks have bad accessibility #1768
Description
I think there are multiple issues with the “detailed updates” section header in the project goals blocks, concerning accessibility.
Everything has been tested with both light and dark mode.
Tab Navigation
When tab-navigating through the page, the detailed updates do not receive any form of highlight. It is not at all apparent that they are currently selected.
Here’s the entire tab navigation sequence, starting from the link just before the detailed updates:
Now, the detailed updates header is selected, and pressing space or enter will expand or collapse the detailed updates section. But there’s no visual indication whatsoever.
And here is the link just after the detailed updates header:
Lack of interactivity indication
The detailed update header lacks any indication that it is interactive. When navigating with a keyboard, this comes back to the issue above. When hovering over the header, the mouse does indeed change into a pointer, but that’s only apparent once the user actually moves the mouse there, and doesn’t work for mobile devices. The user has to know that the detailed updates are part of the page, and are available as expandable sections. I know this because I always read project goals updates, but new readers might not. (I remember finding the detailed update concept slightly confusing initially, though I know now that they are (partially) auto-generated from GitHub issue comments.)
An easy fix would be either a text “click to expand” or similar, or an arrow / triangle symbol “>” which is standard UI language for expandable elements.
Compare this with the standard practice for links (which the Rust blog does indeed follow), which are at least colored differently from the background but should normally be underlined as well.