ChrisMurray
ChrisMurray

Reputation: 487

How best to inform a screen reader user when new content is loaded in a different container

I am working on a app where users can add 'terms' from a list of search results into a new a search query. When the first term is added, a toolbar appears at the bottom of the page to allow users to track which terms are in the list, and kick off the new search.

The question is, how do I best announce the existence of this toolbar via a screen reader?

My current thought is to load the toolbar into the DOM as a new complementary landmark, and have the SR announce this new landmark being loaded. This allows SR users to jump easily to the landmark when they are ready to kick off the search.

The toolbar won't exist in the DOM until the first term is added to the list. Would having a dynamic landmark such as this being added and removed break any accessibility rules?

Upvotes: 0

Views: 32

Answers (1)

Manfred
Manfred

Reputation: 3062

Consider declaring the dynamic region as aria-live.

Upvotes: 1

Related Questions