WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Mixed purpose button bars

for

Number of posts in this thread: 4 (In chronological order)

From: Jeff Gutsell
Date: Tue, Oct 30 2018 10:29AM
Subject: Mixed purpose button bars
No previous message | Next message →

Hi all,



This relates to a possible upcoming project - nothing for which I current
have code examples:



I may create an online help system with a button bar that does the
following:

. Display a contents page

. Go back in the history

. Go forward in the history

. Enlarge the font size

. Print the page

. Close the window



Obviously, this is a mix of navigation and other functions. How should
semantic elements/roles be used in such a case?



____________________

Jeff

iPhone: (513) 235-7460

= EMAIL ADDRESS REMOVED =

From: glen walker
Date: Tue, Oct 30 2018 10:48AM
Subject: Re: Mixed purpose button bars
← Previous message | Next message →

Sounds like all of them should be buttons since they perform an action.

Your first item, "display a contents page", is hard to tell just from that
description, but it sounds like an action is performed so a button is
probably appropriate for that.

I'm guessing the font size button would actually be two buttons? One for
increasing and one for decreasing (in case you made it too big by accident).

For the last one, "close the window", are you closing a modal dialog,
closing a tab in the browser, or closing the browser itself? In all cases,
the 'close' would be a button.

Even though "go back in history" and "go forward in history" navigate you
to another page, they're not really links. They perform an action so
should also be buttons.

From: Andre Polykanine
Date: Tue, Oct 30 2018 4:30PM
Subject: Re: Mixed purpose button bars
← Previous message | Next message →

Hello Jeff,
I'd add those as buttons wrapped in a <div> or a <section> with role set to
"toolbar".


--
With best regards from Ukraine,
Andre
Skype: menelion_elensule
Twitter (English only): @AndrePolykanine


------------ Original message ------------
From: Jeff Gutsell < = EMAIL ADDRESS REMOVED = >
To: 'WebAIM Discussion List'
Date created: , 6:29:15 PM
Subject: [WebAIM] Mixed purpose button bars


Hi all,



This relates to a possible upcoming project - nothing for which I current
have code examples:



I may create an online help system with a button bar that does the
following:

. Display a contents page

. Go back in the history

. Go forward in the history

. Enlarge the font size

. Print the page

. Close the window



Obviously, this is a mix of navigation and other functions. How should
semantic elements/roles be used in such a case?



____________________

Jeff

iPhone: (513) 235-7460

= EMAIL ADDRESS REMOVED =

From: Jeff Gutsell
Date: Wed, Oct 31 2018 9:18AM
Subject: Re: Mixed purpose button bars
← Previous message | No next message

Thanks Andre and Glenn.

I think I was overly focused on the two buttons that seemed like navigation
that may need "role -= navigation" in a parent wrapper.
With your tips, this should be a routine implementation.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
Of Andre Polykanine
Sent: Tuesday, October 30, 2018 6:31 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Mixed purpose button bars

Hello Jeff,
I'd add those as buttons wrapped in a <div> or a <section> with
role set to
"toolbar".


--
With best regards from Ukraine,
Andre
Skype: menelion_elensule
Twitter (English only): @AndrePolykanine


------------ Original message ------------
From: Jeff Gutsell < = EMAIL ADDRESS REMOVED = >
To: 'WebAIM Discussion List'
Date created: , 6:29:15 PM
Subject: [WebAIM] Mixed purpose button bars


Hi all,



This relates to a possible upcoming project - nothing for which I current
have code examples:



I may create an online help system with a button bar that does the
following:

. Display a contents page

. Go back in the history

. Go forward in the history

. Enlarge the font size

. Print the page

. Close the window



Obviously, this is a mix of navigation and other functions. How should
semantic elements/roles be used in such a case?



____________________

Jeff

iPhone: (513) 235-7460

= EMAIL ADDRESS REMOVED =