Reader view and accessibility



  • I’m building a Quasar app and testing as I build each page/feature. However, I just tried to invoke Reader View on Vivaldi and FireFox on Windows. Both will not render any content of my Quasar app in Reader View. I wrapped some dummy content on my page with an <article> tag and that didn’t help either.

    This is a traditional fixed header, side drawer nav and feature/page content area for the application’s layout. Where is the starting point to being learning what features/settings I need to enable within my quasar page’s / comps to ensure they will be accessible and at a minimum the content of each page is reachable/can render in Reader View on all modern browsers…

    Thanks



  • I’ll update this thread as I learn what I learn…

    • Ensure all “readable” (that which can be rendered in Reader View) is within a <P> element.
    • Your content has to pass a content scoring algo - basically it needs to be within a certain element and of a certain length https://stackoverflow.com/questions/30661650/how-does-firefox-reader-view-operate. ie > 140 chars…?
    • When I put a lot of content in just an Article section that wasn’t readable
    • When I put a lot of content in P elements within an a parent Article element, the content of the article section was readable
    • I’ve tried a couple ways to ensure H1 page titles are readable but haven’t figured that out yet
    • The side drawer for a SPA is the nav for a site, for someone dependent on reader view I would suspect that having the navigation contents rendered in Reader View would be needed/useful. However, what is the ‘standard’ regarding navigation content being rendered in a Reader View.

    Lastly, after I get pass Reader View, I will test each page with screen readers. Any input on what to look for to ensure I’m using Quasar as designed for accessibility would be helpful. But, I’ll post what I learn here. I did read a blog that indicated most/all SPAs by default don’t refresh Screen Reader when a route is invoked. That won’t affect me b/c although I’m building a SPA style app, I have every " route " as it’s own page. Therefore, I’m not a true SPA and for now I want to keep it that way. But, it’s one of the issues I’ve learned SPAs struggle with and I’m wondering if anyone has done any testing with Quasar using Screen Readers.

    Thanks


Log in to reply