Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create speech output for images #18

Open
ghost opened this issue Sep 9, 2020 · 2 comments
Open

Create speech output for images #18

ghost opened this issue Sep 9, 2020 · 2 comments

Comments

@ghost
Copy link

ghost commented Sep 9, 2020

It would be nice to generate speech output for images using the alt attribute. I think this is the relevant AST node: https://github.com/syntax-tree/mdast#image.

I'm not quite sure what consequences that would have for the word marker. Perhaps add a border around the image?

@flogy
Copy link
Owner

flogy commented Sep 13, 2020

Good idea! I think a border around the image would be nice. Could also be another highlighting effect, but we must pay attention that it does not change the dimensions of the image or it will flicker around.

A problem I stumbled across when playing around with this was that we don't know if the embedded image is just a simple <img> element or a gatsby-image (or even something else). Depending on how images are implemented we will have to use different approaches to manipulate their styles.

Generally, I think it would be nice to somehow abstract the way the word highlighter handles different kinds of elements. Like that we could also provide an option to the plugin users to inject custom handlers for elements we have not yet foreseen. What do you think about this?

@ghost
Copy link
Author

ghost commented Sep 14, 2020

You're right, applying the style might be a problem.

A friend who is blind recently showed me her JAWS setup and how she browses the web. JAWS seems to apply a border with a padding to the images but I didn't look at the actual HTML. Since JAWS isn't open source (afaik) perhaps we could look at how NVDA does it?

Making the highlighting customizable seems like a good idea.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant