Hello, I am producing a series of learning modules in Evolve and the client has performed an accessibility audit on the solution. They have identified some bugs that I have been able to resolve, but I would appreciate any guidance on the below two:
1) The focus in the screen reader doesn’t move to the new content after submitting an answer. In the module, I have created triggers to bring up content after questions to help break up the experience. The modules use a range of MCQs and Text Input questions. The feedback to questions is also presented inline. Has anyone else experienced issues and found any workarounds?
2) Incorrect heading levels appear on the Tabs interaction. It has been identified that the Tab Panel Title is pulling through as a h1 heading where they requested that this be pulled through as a h2 heading. You can’t delete the title completely so I am trying to find a fix. I had a look in the theme settings and couldn’t see anything obvious. Any ideas?
The modules have been tested with JAWS and NVDA in both Edge and Chrome.
Unfortunately, using Logic to make things appear can mess with the page structure and focus order for screen readers so we can’t give any guarantees for content remaining fully accessible when Logic is used like this. Under non-logic circumstances, inline feedback and page structure generally shouldn’t cause any issues.
For the Tab panel title - all the headings tags in Evolve are set dynamically, so it’s not something you can adjust manually. I just did a quick test of tabs in a couple of different courses and each time the tab panel title had an h4 heading. If you want, you can DM me a link to your course and I can take a look at the tabs component.
It’s hard to say for sure without seeing the course in question whether this will help or not - but if, using Logic, you want to reveal some content as a result of an event and send the learner to it you should add a slight delay to the ‘navigate to’ Logic action.
The only time this should happen is if you haven’t set any page/article/block display titles on the page and the tabs component has no display title.
As @Sam_Cook_Evolve_PO points out, heading levels are set automatically - so if you have, say, a page display title, no article title, no block title but have set a component display title then the heading order will be set to:
I’d also generally recommend having either a page display title or hero image title set on every page - just so there’s a ‘top level’ title that has a higher prominence in the heading hierarchy than all the other display titles on the page. That way if the user brings up the list of headings in their screenreader it gives them a better sense of the structure.
