microsoft
[Accessibility]: Make syntax highlight accessible to screen reader users via a speech scheme
CC @meganrogge and @isidorn
Syntax highlight remains inaccessible to screen reader users. I propose using a speech scheme to address this issue. Speech scheme is a technique using and switching between different speech synthesizer voices for visual formattings, such as colors, fonts, sizes, etc.
Just like sighted people see different colors for syntax types, screen readers would be able to hear different voice per syntax highlight type.
As far as I know, there is no straight way to communicate with screen readers to force them to switch voices. However, the following solutions are available:
-
Using
langattribute. The HTMLlangattribute is recognized via screen readers and supported screen reader voice engines, such as JAWS/NVDA Vocalizer and iOS/Mac OSX can detect and automatically switch between different voices (e.g., en-US, en-GB, etc.) -
Using server-side voice engines as an option for syntax highlight. Just like VSCode LiveShare extension, you can consider using API to send a server-side voice engines to control all the details. However, screen reader users need to suspend their screen reader speech while using this option that might be inconvenient.
To come up with a more robust solution in the long run, however, I think VSCode team needs to work with some popular screen reader vendors.
System Info
Version: 1.79.0-insider (system setup) Commit: 666396ddec7708df2b986dcc178863faaa67c14d Date: 2023-06-05T11:30:50.018Z Electron: 22.5.5 Chromium: 108.0.5359.215 Node.js: 16.17.1 V8: 10.8.168.25-electron.0 OS: Windows_NT x64 10.0.22621
This feature request is now a candidate for our backlog. The community has 60 days to upvote the issue. If it receives 20 upvotes we will move it to our backlog. If not, we will close it. To learn more about how we handle feature requests, please see our documentation.
Happy Coding!
This feature request has not yet received the 20 community upvotes it takes to make to our backlog. 10 days to go. To learn more about how we handle feature requests, please see our documentation.
Happy Coding!
Quick question for clarification: Is the screen reader selecting the entire view, preventing navigation through individual elements? Should each element be selectable individually for proper navigation?
I'm experiencing an issue on macOS Sequoia 15.3.2 where the screen reader selects the entire view, hindering navigation through individual elements.
@mrleemurray @meganrogge
+1 on this issue, and I'll add another potential approach to the list that @jooyoungseo proposed.
One potential goal is to have the text simply render the text with ordinary CSS attributes like color (font color) and background-color, such that screen readers like NVDA/JAWS can access the formatting attributes.
Currently, NVDA cannot see the various colors from syntax highlighting, like how in python "def" is blue and "function_name" is yellow (or whatever color theme you're using). My NVDA just shows the following when I execute NVDA report-formatting command (NVDA+f):
4 space
Consolas
10.5 pt
very light grey on very dark grey
align left
Which e.g. just says light gray font color on dark gray background for all text, even though a sighted person sees the different colors. See https://github.com/microsoft/vscode/issues/238803 for details on reproducing (was marked as duplicate issue to this one).
If this was fixed, then NVDA can access all the font attributes, and I can then program NVDA to change speech prosody based on the font attribute changes.
To be clear, this suggestion is very similar to JooYoung's suggestion about using html attribute lang, but I'm just suggesting a slight variation on it to use the CSS attributes (like an ordinary web page would render with).
@meganrogge I think @dennischenfeng's proposal is scalable, which can be applied to other screen readers.