i'm working on site lists bunch of mp3 radio programs. every program has few different tab-able elements: title link, tags, controls choose language, , play button. when user tabs on content screen reader, hear like:
dan's story
mystery
french // there might tag named this
mayhem
english
french
spanish
play
under treehouse
nature
outdoors
english
french
play
that's pretty confusing discern audio.
so question this, what's best practice in situations have recurring "components" have controls. when tab on control, should screen reader provide context component belongs to?
for example, should set aria-label play button aria-label="play under treehouse"? similarly, should add aria-labels tags describe them tag, example aria-label="mystery tag"?
in collection of tags heading job without being verbose:
<h#>tags</h#> <p> nature, outdoors, english, french </p> ideally, if have content grouping fits naturally. can style heading minimize see fit.
for play button, depends. if play button thing on page, not need it. if play button 1 of many, grouped title of thing, may not need it. if there play buttons , no grouping, or play button shifts context, need label.
the key here rely on content , html structure first. consider how verbose page otherwise (verbose pages hassle screen reader users). then, when absolutely cannot find way in standard html or page structure, consider using aria.
Comments
Post a Comment