Low Vision Accessibility

The excellent accessibility audit provided for Jupyter Notebook is primarily is limited to WCAG 2.0 issues. It does not address many 2.1 issues, especially the extensions that were made for low vision.

The primary deficit for Jupyter Notebook is the inability to enlarge to 400% with full word wrapping.

I believe this is a CSS issue primarily, and it is easily solved. Structurally the Jupyter interface is extremely good, that is why the audit turned up so little. Having done audits professionally, I can say this is a good first audit report for Jupyter.

I am a member of the Accessibility Working Group and the Low Vision Task Force of the W3C, and I am very interested in seeing your work succeed. Also as one of the very few people to earn a PhD in Mathematics with congenital low vision I am thrilled to see STEM opened to young people like me.

I will be making a presentation this spring at the CSUN Assistive Technology Conference in Anaheim. My goal is to pull together as many people as possible to address accessibility tools for scientists with low vision.

I will follow soon with and extension of your fine accessibility audit that includes WCAG 2.1 extensions.

Best, Wayne Dick


Thanks for getting involved in this. Having more people with experience with this topic is (I think) one of the things needed to make progress.

Could you explain a bit more what this means or link to an example of “good” and “bad” behaviour to look at (doesn’t have to be a notebook any kind of example will do)? For me it sounds like the way to work on this is to open a notebook, set the zoom to 400% in your browser and look for text that is cut off instead of line wrapped. Is that it? What about having to scroll horizontally to read the text?

I tried to explore a bit and started a notebook server, then kept upping the zoom in my browser but it maxed out at 300%. Do you know if there is a way to enable higher zoom levels (I use OSX and Firefox)?

Another question that you might know an answer to: is there a good tutorial to work through to learn more about the issues, fixes, etc? As someone who knows a little about web development and nothing about accessibility that would be super useful for getting started. Right now reading things like a WCAG audit or guidelines is tough work because they are written for people who aren’t new to the topic. Any pointers, examples, blog posts, etc would be super useful. Right now my experience is limited to what tools like https://khan.github.io/tota11y/ show and recommend as fixes.

It will take a few days to work out a complete answer, but the attached pdf should explain the reflow criterion (1.4.10) of WCAG 2.1.

Best, Wayne

(Attachment TheReflowSuccessCriterion.pdf is missing)

The PDF attachment is missing. Is the content here similar to the missing PDF?

Oops I forgot the important thing

(Attachment Reflow.pdf is missing)

I think it gets removed by the discourse system due to security concerns.

The following link will explain the Reflow Criterion: Reflow.PDF

Best, Wayne Dick


The serious problem with reflow and Jupyter only occurs in code. In python this results in many long lines that a person with low vision will have to scroll across horizontally.
Now if I am working in 400% I can just write my code with short lines, but if I’m in a working group how do I work with other fully sighted users.

This is a serious professional obstacle for programmers with low vision to work on teams, and get employed. It was hard for me, so I took a lot of assembly language jobs for the short lines. But, there aren’t many assembly jobs anymore. So, what about young people with partial sight.

An auto line break with a line extension \ would be great, and IPython could generate it.

Best, Wayne

I think a solution would be to add a way to toggle soft-wrapping for code cells in the notebook. This is the default behaviour for markdown cells, so the functionality should be there.

Does someone know if https://github.com/uclixnjupyternbaccessibility/accessibility_toolbar includes an option to enable soft wrap for code cells? It seems like an extension that has a lot of functionality already so might be a good place to add this.

1 Like

Thank you, I will look at this

I have looked at the interface and I think I can fix it. Where do I find the code. I think I can fix it with an extension that does not touch the jupyter code, but I need to see the code templates and css.

With my eyes I have a difficult time with github. It is very difficult to use with low vision. But I can struggle through if I have a pointer of where to look.

Viewing the code through the ‘inspector’ it looks pretty doable.

One problem is achieving large print word wrapping with correct indentation. This is very important for reading Python. I have already solved this in different settings, and the Jupyter code looks similar.

Best, Wayne

When you are asking for where to look in the code are you asking about the extension I referred to or the Jupyter notebook itself?

For the former (accessibility toolbar extension) I think https://github.com/uclixnjupyternbaccessibility/accessibility_toolbar/blob/1c48864248669ab612288f933bebf21bb35b8cb2/font_style/font_control.js would be the place to start. I’m not super familiar with the code of the extension but that looks like where they define things like the additional fonts, font size and so on.

Loosely related, I started tinkering with a proof-of-concept thing to provide audible feedback around code cell execution status today: https://github.com/innovationOUtside/nb_cell_execution_status

The audio design is HORRIBLE, so if anyone can suggest better tones / audible alerts to use, that’d be appreciated.


I tried the binder link, there was no sound :frowning: What did I miss/do wrong?

@betatim Because I’d pasted the wrong URL in the Binder badge…

Note that you also need to enable the audio from the extension configurator before loading a notebook and trying it out…

I’ve think I’ve got a heartbeat thing going too that gives a quiet heartbeat every few sounds to indicate long running cells; just want to add a couple more config bits to that, which I’ll hopefully get to tomorrow…

[UPDATE: I just pushed the version with the heartbeat; tomorrow I may look at integrating elements of https://jameslmartin.github.io/jupyter-a11y/ too…]

1 Like

FWIW, I made a start on wrapping the original https://jameslmartin.github.io/jupyter-a11y/ extension (with a couple of minor edits to suppress alert identifying command/edit mode when entering a cell) as a packaged notebook extension here: https://github.com/ouseful-backup/jupyter-a11y/

1 Like

Thank you, I’ve got a lot of work.
Best, Wayne