WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Announcing sub menu levels

for

From: Tim Harshbarger
Date: Nov 4, 2019 11:20AM


Another way you can try to quit NVDA is by:

Press the Windows Logo Key + B (it will move you to the system tray.)
Use letter navigation or arrow keys to navigate to NVDA.
Use either shift+F10 or the context menu button on the keyboard to bring up
the context menu for NVDA.
Select Exit.

This only works if you have NVDA set up to appear in the system tray.

Thanks,
Tim
Tim Harshbarger
Senior Accessibility Consultant
Deque Systems
-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
Mohith BP
Sent: Sunday, November 3, 2019 9:34 AM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Announcing sub menu levels

HI JP,

I agree being a screen reader user it is very important to know the level
when it is more than 2 level deep.
Have you tried aria-level?

I have tried it almost 3 to 4 years ago when the support with screen reader
was poor.


Thanks & Regards,
Mohith B. P.


On 11/3/19, JP Jamous < <EMAIL REMOVED> > wrote:
> Birkir,
>
> I like your approach with aria-labelledby. It helps the SR user remain
> oriented.
>
> The reason why this is required is because SR users are complaining
> that they are getting lost, as the nesting goes 2 or 3 levels deep.
> Also, the navigation menus are built dynamically. For example, you
> select certain links that display as check boxes. Once pressing the
> Save button, the code behind organizes them according to business
> requirements. For example,
>
> 1. You check Chicken, cow and lion.
> 2. The business requirement is to organize those according to the
> types of food those animals eat and other categories.
> 3. It creates a main menu called "Animals" and inside of it 2 sub
> menus called "Domestic" and "Wild"
> 4. It then creates "herbivores" under "Domestic" and adds Chicken and
> Cow underneath it as links that point to articles.
> 5. It then puts lion as a link that points to an article under "Wild"
> and creates a submenu for it called "Carnivores'"
>
> There are many business requirements for categorizing links that point
> to articles. Those depend on the content selected. Users also have the
> ability to delete those articles once they are done studying about them.
>
> This menu structure works great for most users, but disorients SR
> users, that have filed complaints in the past. So we wanted to keep
> them as oriented as possible like other users.
>
> I think providing the aria-labelledby to read the parent menu of the
> current submenu is great. I did not even think of that one. We decided
> to go with role="navigation" or use a <nav> to house the <ul> inside
> of it. This allows screen readers to announce the start and end of the
> menu label.
>
> The only thing I am not aware of is the use of aria-level. I thought
> it is only implemented with treeviews and not dropdown menus. Do you
> know how it can be coded to provide levels for sub menus?
>
>
>
> --------------------
> JP Jamous
> Senior Digital Accessibility Engineer
> E-Mail Me |Join My LinkedIn Network
> --------------------
>
>
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Birkir R. Gunnarsson
> Sent: Friday, November 1, 2019 10:07 PM
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: Re: [WebAIM] Announcing sub menu levels
>
> I find this whole setup kind of weird. Why does the user care how many
> levels deep he/she is, as opposed to what menu are they in?
> If you have submenus of appetizers and desserts, second level menus of
> meat, seafood and cheese for the appetizers and then individual
> appetizers, wouldn't it be more useful to know that the moldy medley
> is a submenu of cheeses, as opposed to the third level menu?
> You could strip away all the ARIA semantics and just use list markup
> with aria-level to indicate nesting (though if you do the nesting
> properly you should get the proper level announcements), you can add
> aria-label or aria-labelledby to <ul> elements, they are announced by
> most screen readers.
> You can go super aria and use aria-labelledby with the mneu roles and
> aria-label to refer to self, e.g.
> ...
> <li role="menuitem" id="l2m">Meat</li>
>
> <ul role="menu" aria-label="level 3" id="l3" aria-labelledby="l2m l3">
>
> but does the user really care how many levels deep he/she is?
>
>
>
>
> On 11/1/19, <EMAIL REMOVED> < <EMAIL REMOVED> > wrote:
>> Would the aria-label be the correct tag why not aria-description?
>>
>> -----Original Message-----
>> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf
>> Of <EMAIL REMOVED>
>> Sent: Wednesday, 30 October 2019 1:44 AM
>> To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Announcing sub menu levels
>>
>> Correction: if updating the aria-label to role=menu, you would want
>> to add the text "Level [#]" at the end of any value currently in the
>> aria-label for the menu
>>
>> -----Original Message-----
>> From: <EMAIL REMOVED> < <EMAIL REMOVED> >
>> Sent: Tuesday, October 29, 2019 10:41 AM
>> To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
>> Subject: RE: [WebAIM] Announcing sub menu levels
>>
>> Adding that exact aria-label would not be recommended as it wouldn't
>> announced the visible text for the menuitem since you are overriding it.
>> You could add an aria-label to the element with role=menu, but I'm
>> not sure if that will announce what you want so you would need to
>> code it up and test with multiple AT/browsers.
>>
>> Joe Humbert
>> Accessibility Champion
>>
>> -----Original Message-----
>> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf
>> Of JP Jamous
>> Sent: Tuesday, October 29, 2019 10:34 AM
>> To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Announcing sub menu levels
>>
>> Close but not really. I keep digging up menus like that that do not
>> announce their levels.
>>
>> The dynamic menu that I am facing expands as the user adds more items
>> to it.
>> They can create a sub menu 3 levels deep. It is important to have
>> screen readers announce that to keep SR users oriented.
>>
>> I am thinking of using role="menuitem" and aria-label="Level 1" on
>> each container.
>>
>>
>>
>> --------------------
>> JP Jamous
>> Senior Digital Accessibility Engineer E-Mail Me |Join My LinkedIn
>> Network
>> --------------------
>>
>>
>> -----Original Message-----
>> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf
>> Of Xavi Blanch
>> Sent: Tuesday, October 29, 2019 8:38 AM
>> To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Announcing sub menu levels
>>
>> Hi,
>> See this example.
>> https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/m
>> e
>> nubar-
>> 1.html#
>>
>> I have implemented it and is a good example.
>>
>> Xavi Blanch
>>
>>
>>
>> -----Mensaje original-----
>> De: WebAIM-Forum [mailto: <EMAIL REMOVED> ] En
>> nombre de JP Jamous Enviado el: martes, 29 de octubre de 2019 14:28
>> Para: 'WebAIM Discussion List' < <EMAIL REMOVED> >
>> Asunto: [WebAIM] Announcing sub menu levels
>>
>> Hi folks,
>>
>>
>>
>> I am trying to find a good ARIA article that explains how to
>> implement sub menus with levels. For example, I have a Menu button
>> that expands under it there can be a sub menu button and inside that
>> sub menu button there would be links. I want screen readers to announce:
>>
>>
>>
>> "File Menu"
>>
>> "new Sub Menu Level 1"
>>
>> "Text File Menu Item"
>>
>> "Folder Menu Item"
>>
>> "Send to sub menu Level 1"
>>
>> "7Zip sub menu Level 2"
>>
>> "Extract file Menu Item"
>>
>> "Extract Here Menu Item"
>>
>> "Desktop Menu Item Level 1"
>>
>> "mail Sub menu"
>>
>>
>>
>>
>>
>>
>>
>> I cannot find an article that would allow me to include the sub menu
> level.
>> Any help would be greatly appreciated.
>>
>>
>>
>>
>>
>>
>>
>> --------------------
>>
>> JP Jamous
>>
>> Senior Digital Accessibility Engineer
>>
>> <mailto: <EMAIL REMOVED> > E-Mail Me |
>> <http://linkedin.com/in/JPJamous>; Join My LinkedIn Network
>>
>> --------------------
>>
>>
>>
>>
>>
>> >> >> archives at http://webaim.org/discussion/archives
>> >>
>> >> >> archives at http://webaim.org/discussion/archives
>> >>
>> >> >> archives at http://webaim.org/discussion/archives
>> >>
>> >> >> archives at http://webaim.org/discussion/archives
>> >>
>> >> >> archives at http://webaim.org/discussion/archives
>> >>
>
>
> --
> Work hard. Have fun. Make history.
> > > archives at http://webaim.org/discussion/archives
> >
> > > archives at http://webaim.org/discussion/archives
> >
http://webaim.org/discussion/archives