WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: React and screen reader accessibility?

for

From: Mark Smith
Date: Apr 27, 2017 9:42AM


Hi Brandon,

I have only been using React for less than a year, so I can't/won't claim expert knowledge but...

It probably because React uses a virtual DOM to create (mainly) single page applications that render quickly vs creating a whole new page. It's not using the tree based DOM a straight HTML page uses in the browser.

While you will see the URL change as you use the app, behind the scenes React takes a diff of the "page" you were on and compares it to the "new page" and only updates the part that has changed. This makes the app appear to load much faster but would leave you in a position where you need to alert the screen reader that part of the page has changed.

http://reactkungfu.com/2015/10/the-difference-between-virtual-dom-and-dom/

HTH,
Mark

Mark Smith
UI Developer Signet Jewelers

330.631.5409
<EMAIL REMOVED>
http://www.linkedin.com/in/mkultra

> On Apr 26, 2017, at 9:49 PM, Brandon Keith Biggs < <EMAIL REMOVED> > wrote:
>
> Hello,
>
> What is going on with React and screen reader accessibility? Apparently it
> has all kinds of hooks for 'accessibility-. Why would someone do this? Why
> can't react avoid using aria and use native widgets instead? Why is
> accessibility optional? Why is accessibility something that is more complex
> that a developer needs to worry about?
>
> https://code.facebook.com/posts/435862739941212/making-react-native-apps-accessible/
>
>
>
> https://github.com/necolas/react-native-web/blob/master/docs/guides/accessibility.md
>
>
>
> This doesn't seem to work based off the few react examples I have seen:
>
> https://facebook.github.io/fixed-data-table/
>
>
>
> https://facebook.github.io/react/tutorial/tutorial.html
>
>
>
>
>
> These are done by Facebook itself as an example to other developers. As a
> screen reader user, I find this very very insulting and disheartening. I
> hope I'm wrong and the examples I found from Facebook are not really what
> they expect developers to learn from, but I greatly fear that they are.
>
> Does anyone know why there is such a disconnect between the accessibility
> team and the people writing the examples?
>
> Accessibility is not something that can be added, it is something that
> happens when good UI practice is followed and all the myriad elements in
> UX, UI, screen reader, platform and user align in this very difficult
> dance. It is very unwise for a company to put any of those factors out of
> line.
>
> Why is FB doing this? How can we communicate that this is a problem?
>
> There are so many apps now that are being made with react that I fear soon
> many apps for work and socializing will not be accessible or easily usable.
>
> Thank you,
>
>
>
>
> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
> > > >