E-mail List Archives
Thread: alternative to use of onChange in select menus
Number of posts in this thread: 25 (In chronological order)
From: Angela French
Date: Wed, Jun 08 2011 4:45PM
Subject: alternative to use of onChange in select menus
No previous message | Next message →
I am exploring options to reworking the functionality of the Quicklinks select (drop down) menu found in top of our global banner on this site:
http://www.sbctc.edu/index.aspx . It relies on the JavaScript onChange event which makes it unusable to either screen readers or keyboard users (correct me please if I am wrong).
Does anyone have an example URL they might direct me to of an alternative to this approach?
Thank you,
Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED =
http://www.checkoutacollege.com<;http://www.checkoutacollege.com/>;
From: Steve Green
Date: Wed, Jun 08 2011 5:12PM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Is there any reason why you can't just remove the onChange event handler and
add a Go button?
From: Angela French
Date: Wed, Jun 08 2011 5:18PM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
That is certainly an option. Researching others as well.
From: Giovanni Duarte
Date: Wed, Jun 08 2011 8:30PM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Hi Angela,
You may want to check the link below.
http://www.freedomscientific.com/Training/accessible-forms-in-word.asp
Thanks,
Giovanni.
From: Tim Harshbarger
Date: Thu, Jun 09 2011 6:09AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
It's been a while since I did this, but I know I once had a working example of a quick nav combobox that allowed people using the keyboard to select an item from the combobox and then click a go button while allowing people using the mouse just to expand the combobox and then select an item to go to the new page.
What I did is set up a combobox with a go button that was just basically a standard web form that was processed by the server. Then I added a click event to the combobox where the first mouse click just has the combobox expand and the second mouse click causes the user to be sent to the new page. If no item had been selected, then nothing happens.
I am uncertain I still have the code for that one laying around. I was just trying to generate a number of possible solutions for a similar problem to yours and it was just one of the ideas I tossed together. I do remember that the coding wasn't that difficult.
I think I had two
From: Michael.Moore
Date: Thu, Jun 09 2011 6:51AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Use of onChange on a dropdown menu is certainly not a best practice for accessibility, but it is not a drop dead barrier either. Screen reader and other keyboard users can use the dropdown if they open it with alt+down arrow, then move to their selection and tab out of the control. The problem occurs if they simply try to use the down arrow without opening the control. Some folks argue that these folks are simply not using their keyboards correctly.
Michael Moore
From: Steve Faulkner
Date: Thu, Jun 09 2011 7:24AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
also note that in browsers other than IE the navigation of the select
options uisng the keyboard does not cause the onchange event to fire, the
user having selected an option must press enter to activate the event.
--
with regards
Steve Faulkner
Technical Director - TPG
www.paciellogroup.com |
www.HTML5accessibility.com<;http://www.html5accessibility.com/>;|
www.twitter.com/stevefaulkner
HTML5: Techniques for providing useful text alternatives -
dev.w3.org/html5/alt-techniques/
Web Accessibility Toolbar - www.paciellogroup.com/resources/wat-ie-about.html
On 9 June 2011 13:48, < = EMAIL ADDRESS REMOVED = > wrote:
> Use of onChange on a dropdown menu is certainly not a best practice for
> accessibility, but it is not a drop dead barrier either. Screen reader and
> other keyboard users can use the dropdown if they open it with alt+down
> arrow, then move to their selection and tab out of the control. The problem
> occurs if they simply try to use the down arrow without opening the control.
> Some folks argue that these folks are simply not using their keyboards
> correctly.
>
> Michael Moore
>
>
>
From: Donald Evans
Date: Thu, Jun 09 2011 7:33AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
The keyboard only user may also interact with the select box (using an
onChange) with the control+enter keys and then Enter to select the option.
On Thu, Jun 9, 2011 at 9:25 AM, Steve Faulkner < = EMAIL ADDRESS REMOVED = >wrote:
> also note that in browsers other than IE the navigation of the select
> options uisng the keyboard does not cause the onchange event to fire, the
> user having selected an option must press enter to activate the event.
>
> --
> with regards
>
> Steve Faulkner
> Technical Director - TPG
>
> www.paciellogroup.com |
> www.HTML5accessibility.com<;http://www.html5accessibility.com/>;|
> www.twitter.com/stevefaulkner
> HTML5: Techniques for providing useful text alternatives -
> dev.w3.org/html5/alt-techniques/
> Web Accessibility Toolbar -
> www.paciellogroup.com/resources/wat-ie-about.html
>
>
>
> On 9 June 2011 13:48, < = EMAIL ADDRESS REMOVED = > wrote:
>
> > Use of onChange on a dropdown menu is certainly not a best practice for
> > accessibility, but it is not a drop dead barrier either. Screen reader
> and
> > other keyboard users can use the dropdown if they open it with alt+down
> > arrow, then move to their selection and tab out of the control. The
> problem
> > occurs if they simply try to use the down arrow without opening the
> control.
> > Some folks argue that these folks are simply not using their keyboards
> > correctly.
> >
> > Michael Moore
> >
> >
> >
From: Steve Faulkner
Date: Thu, Jun 09 2011 7:45AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
hi Jon
yes you are right, thanks for pointing that out
regards
steve
On 9 June 2011 14:36, Gunderson, Jon R < = EMAIL ADDRESS REMOVED = > wrote:
> Other browsers like Firefox have a new problem with onChange event.
>
> When you view the options using the up and down arrow keys of a select box
> and then "tab" out of the select box, this also seems to trigger the
> onchange event. So while you can view the options in a select box, you
> can't not select one of them.
>
> Example:
> http://html.cita.illinois.edu/nav/form/select/index.php?example=9
>
> Jon
>
>
>
>
From: Gunderson, Jon R
Date: Thu, Jun 09 2011 7:51AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Other browsers like Firefox have a new problem with onChange event.
When you view the options using the up and down arrow keys of a select box and then "tab" out of the select box, this also seems to trigger the onchange event. So while you can view the options in a select box, you can't not select one of them.
Example:
http://html.cita.illinois.edu/nav/form/select/index.php?example=9
Jon
From: deborah.kaplan
Date: Thu, Jun 09 2011 8:03AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
On Thu, 9 Jun 2011, = EMAIL ADDRESS REMOVED = wrote:
> Some folks argue that these folks are simply not using their keyboards correctly.
Since this behavior varies on a browser to browser level and is
never documented (that I've ever seen) in any documentation aimed
at users, calling this "not using their keyboards correctly"
would not be a particularly politic way of framing the argument,
I would think.
From a user experience perspective, there is no way for a user
looking at a web form to know whether a drop-down has been
programmed with onChange or not. Even for mouse users with no
accessibility needs, I've seen this cause problems, when they
expect that they can change multiple form elements and then the
page reloads immediately on changing a single drop-down.
But for a keyboard user, this is very annoying behavior. It's
unlikely that many keyboard users will have figured out the
"correct" ways to use their keyboards, because they can't tell
when looking at the form if it is an onChange or not, so they
won't be able to easily build patterns about what keyboard
activities have what effects. From the user standpoint, after
all, a form is a form, and the JavaScript events tied to the form
controls are invisible until fired off.
As a voice (therefore effectively keyboard) user, I have rarely
met an onChange form that was well enough designed not to be
incredibly annoying.
-deborah
From: Angela French
Date: Thu, Jun 09 2011 8:36AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Giovanni - I believe you meant this for Courtney for her thread on Word forms.
From: Accessibility India
Date: Thu, Jun 09 2011 8:42AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Generally users will not use the exact short cut for drop downs. Try
to access any drop-down using "Alt + down arrow" to open the drop
down, navigate the items with normal down arrow and up-arrow within
the drop-down, now after selecting the required item close the
drop-downs using "Alt + up-arrow". This approach works fine in
internet explorer and firefox perfectly even we have onchange event to
refresh the page automatically.
I have tested the drop down in the page
> http://www.sbctc.edu/index.aspx using NVDA 2011.1 and found that its working perfectly.
In firefox after closing the drop down with alt + up-arrow hit the
select button. In internet explorer after selecting the item in the
drop down we can press enter for the effect or on closing the
drop-down with alt + up-arrow the page is re-directing to selected
item.
An uniform approach in both the browsers is a good solution.
On 6/9/11, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> I am exploring options to reworking the functionality of the Quicklinks
> select (drop down) menu found in top of our global banner on this site:
> http://www.sbctc.edu/index.aspx . It relies on the JavaScript onChange
> event which makes it unusable to either screen readers or keyboard users
> (correct me please if I am wrong).
>
> Does anyone have an example URL they might direct me to of an alternative to
> this approach?
>
> Thank you,
>
> Angela French
> Internet Specialist
> State Board for Community and Technical Colleges
> 360-704-4316
> = EMAIL ADDRESS REMOVED =
> http://www.checkoutacollege.com<;http://www.checkoutacollege.com/>;
>
>
From: deborah.kaplan
Date: Thu, Jun 09 2011 8:48AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
On Thu, 9 Jun 2011, Angela French wrote:
> Michael - leave it to a sighted person (me), to not know how to use their keyboard. So would you say that most keyboard and screen reader users would presumably know more than I did and would be able to successfully make a selection from my QuickLinks list, and it's not something I need to change? Would others concur?
I'm a keyboard (voice, which is effectively keyboard) user, and
I'm a web developer and I specialize in accessibility, and I DID
NOT KNOW THIS.
So I do not concur.
-Deborah
From: Angela French
Date: Thu, Jun 09 2011 9:00AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Thanks Deborah.
From: Angela French
Date: Thu, Jun 09 2011 9:06AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
I could not make that happen in IE. Perhaps I'm doing it wrong.
From: Angela French
Date: Thu, Jun 09 2011 9:12AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Thanks Deborah. As it seems there is no standard browser behavior and users may or may not know work-arounds to this type of functionality, it seems safest not to use it.
From: Angela French
Date: Thu, Jun 09 2011 9:18AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Michael - leave it to a sighted person (me), to not know how to use their keyboard. So would you say that most keyboard and screen reader users would presumably know more than I did and would be able to successfully make a selection from my QuickLinks list, and it's not something I need to change? Would others concur?
From: Michael.Moore
Date: Thu, Jun 09 2011 9:30AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Actually, when I have had the opportunity to do user testing people using the keyboard almost always just use the down arrow when they encounter a select box. Thus the reason for not using onChange as a best practice. But if you are performing a 508 compliance audit the existence of an onChange on a select box does not make the select box non-compliant. If you can get them to add the go button, great! If not, it's not worth losing sleep over.
Michael Moore
(512) 424-4159
From: Michael.Moore
Date: Thu, Jun 09 2011 9:39AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Hmm, when I opened the select with alt+tab in FF it worked without an issue. The site lists this as a best practice fail and I wholeheartedly agree with them.
Michael Moore
(512) 424-4159
From: Lucy Greco
Date: Thu, Jun 09 2011 9:45AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
I would tend to disagree about not losing sleep as when I encounter one these I give up on the page. Usually because I don't know where I ended up and trying to get back sometimes gets me more lost. As well it really is a lot to expect that many people will try both techniques on a page many keyboard only users do not know about the alt down arrow .i have seen on select used much more effectively then on change.
Lucy Greco
Assistive Technology Specialist
Disabled Student's Program UC Berkeley
(510) 643-7591
http://attlc.berkeley.edu
http://webaccess.berkeley.edu
From: Lucy Greco
Date: Thu, Jun 09 2011 9:51AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Alt tab that should change applications
Lucy Greco
Assistive Technology Specialist
Disabled Student's Program UC Berkeley
(510) 643-7591
http://attlc.berkeley.edu
http://webaccess.berkeley.edu
From: Michael.Moore
Date: Thu, Jun 09 2011 9:57AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
Sorry meant alt+down arrow. My bad.
Michael Moore
(512) 424-4159
From: Michael.Moore
Date: Thu, Jun 09 2011 10:09AM
Subject: Re: alternative to use of onChange in select menus
← Previous message | Next message →
I am simply saying that there is a difference between advocating for the use of best practices and arguing for standards compliance. When working with contracted vendors particularly, and even at times working with in-house development groups it does not help my cause to incorrectly couch a failure to follow best practices as a standards compliance issue. When we do our testing we list compliance issues and also recommend changes to meet best practice guidelines. We include the impact to the users in both cases. Sometimes we can get the best practices implemented in a later release and sometimes not. When we can get the contractor or in-house development team to agree to the best practices prior to development (and listed the requirements specifications) then we have much firmer ground to stand on when those best practices are not implemented.
Michael Moore
(512) 424-4159
From: ckrugman
Date: Thu, Jun 30 2011 3:06PM
Subject: Re: alternative to use of onChange in select menus
← Previous message | No next message
I'm behind in emails as usual but I tried it today and had no difficulty
using it with JAWS 12. Don't know if you made any changes though.
Chuck
----- Original Message -----
From: "Angela French" < = EMAIL ADDRESS REMOVED = >
To: "'WebAIM Discussion List'" < = EMAIL ADDRESS REMOVED = >
Sent: Thursday, June 09, 2011 7:44 AM
Subject: Re: [WebAIM] alternative to use of onChange in select menus
> Michael - leave it to a sighted person (me), to not know how to use their
> keyboard. So would you say that most keyboard and screen reader users
> would presumably know more than I did and would be able to successfully
> make a selection from my QuickLinks list, and it's not something I need to
> change? Would others concur?
>
>