WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Selects with drop downs

for

From: Brandon Keith Biggs
Date: Mar 15, 2018 3:21AM


Hello,
You can use AccDC along with any other framework. What framework are they
using?
I'm slowly working on bringing AccDC into React, but it is a little
difficult as AccDC manipulates the DOM and React is trying to get people to
move away from touching the dom. If there is anyone working on React, I
would love some help!
Thanks,


Brandon Keith Biggs <http://brandonkeithbiggs.com/>;

On Wed, Mar 14, 2018 at 8:41 PM, Ryan Benson < <EMAIL REMOVED> > wrote:

> In regards to my situation, the application is built in house, so while
> that could be a tactic, I can't use it here. I could shut down the use of
> whatever framework used, but I wanted to see if there was an accessible
> example to point to. The example that Patrick pointed to this morning was
> kind of the interaction the application has. While I think the interaction
> they want is dumb, I wanted more ground to stand on.
>
>
> Ryan
>
> Sent from my iPad
>
> > On Mar 14, 2018, at 23:13, < <EMAIL REMOVED> > < <EMAIL REMOVED> >
> wrote:
> >
> > << all we can do is to diligently file bugs or promote bugs if already
> filed to keep the issues alive on the vendor's to-do list.>>
> >
> > Definitely, do that.
> > But how about another tactic?
> >
> > Sec. 508 requires the federal government buy accessible software and
> hardware. Enforce it, especially if you're a government entity or one that
> is covered by accessibility regulations, such as schools and colleges.
> >
> > Tell the manufacturers why their products will no longer be purchased,
> that you'll consider them again in the future if they correct their
> shortcomings.
> >
> > This strategy has worked in the past with other manufacturers in the
> industry.
> >
> > —Bevi Chagnon
> >
> > — — —
> > Bevi Chagnon, founder/CEO | <EMAIL REMOVED>
> > — — —
> > PubCom: Technologists for Accessible Design + Publishing
> > consulting ' training ' development ' design ' sec. 508 services
> > Upcoming classes at www.PubCom.com/classes
> > — — —
> >
> >
> > -----Original Message-----
> > From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Birkir R. Gunnarsson
> > Sent: Wednesday, March 14, 2018 9:49 PM
> > To: WebAIM Discussion List < <EMAIL REMOVED> >
> > Subject: Re: [WebAIM] Selects with drop downs
> >
> > My rant is purely philosophical in nature.
> > IN reality the web content authors are responsible, and we do all the
> JavaScript workarounds and extra testing to make sure our web content is
> usable, but I think this is a fundamentally flawed paradigm and that user
> agents (browsers and assistive technology applications) need to do more.
> > Until they do, accessibility will justifiably be considered resource
> intensive and difficult to implement, but it doesn't have to be like that.
> >
> > all we can do is to diligently file bugs or promote bugs if already
> filed to keep the issues alive on the vendor's to-do list.
> >
> >
> >
> > On 3/14/18, Ryan E. Benson < <EMAIL REMOVED> > wrote:
> >>> There are support and implementation differences between browsers
> >> (Firefox matches the string from the beginning, Chrome only matches
> >> for a substring,
> >> IE11 doesn't do anything at all).
> >>
> >> The app I am talking about works fine in IE 11. If we look past all
> >> the bonuses about HTML5, my interpretation of the render would look
> like:
> >>
> >> <label for="country">Select a country</label> <select name="country"
> >> id="">
> >> <option value=""><input type="text"></option>
> >> <option value="USA">USA</option>
> >> <option value="Canada">Canada</option>
> >> <option value="Mexico">Mexico</option> </select>
> >>
> >>
> >> --
> >> Ryan E. Benson
> >>
> >> On Wed, Mar 14, 2018 at 3:23 PM, Birkir R. Gunnarsson <
> >> <EMAIL REMOVED> > wrote:
> >>
> >>> A lot of people don't know this, but HTML5 actually has simulated
> >>> combox code.
> >>> That is the list attribute combined with the <datalist> element.
> >>> <label for="search">Search</label>
> >>> <input id="search" type="text" list="suggestions"> <datalist
> >>> id="suggestions"> <option value="suggestion 1"> <option
> >>> value="suggestion 2"> ..
> >>> </datalist>
> >>>
> >>> The <datalist> elemet should hold all the possible options, they can
> >>> be loaded from a JSon file.
> >>> When user starts typing into the search input the browser
> >>> automatically displays matching suggestions from the datalist (it
> >>> shows the value of the matching option elements).
> >>> In Firefox at least you can use arrow keys to navigate into and
> >>> through the list, enter to select an option and close it, and escape
> >>> to dismiss it without selecting.
> >>> There are support and implementation differences between browsers
> >>> (Firefox matches the string from the beginning, Chrome only matches
> >>> for a substring, IE11 doesn't do anything at all).
> >>>
> >>> For instance, if you type "ppl" into the field and "apples" was one
> >>> of the options, Chrome would display it as a suggestion but Firefox
> >>> would not.
> >>>
> >>> If we can file bugs and get the browser vendors committed this is
> >>> close to being an accessible no-JavaScript-needed solution.
> >>> I think this and accessibility support of the <dialog> element are
> >>> the biggest advances that current HTML5 has to offer, the amount of
> >>> ARIA and JavaScript and focus management that is needed to get those
> >>> right is beyond most ordinary developers, and I don't blame them.
> >>> But if they could do it with HTML, it would be amazing.
> >>>
> >>> I don't know why this isn't gaining more traction, most web
> >>> developers I talk to have never heard of this, even if it is in the
> HTML5 spec.
> >>>
> >>>
> >>>
> >>>> On 3/14/18, Steve Green < <EMAIL REMOVED> > wrote:
> >>>> Hi Bryan,
> >>>>
> >>>> I will reply off-list. At this stage all I really want is a
> >>>> replacement
> >>> for
> >>>> a native combobox, so I have only been testing the Country combobox
> >>>> at http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%
> >>> 20Comboboxes%20(Native%20Inputs,%20Multiselect%
> >>> 20Editable%20with%20Substring%20Match)/demo.htm.
> >>>> All the other whizzy features such as autocomplete can wait until
> >>>> we get
> >>> the
> >>>> basic widget working.
> >>>>
> >>>> Steve
> >>>>
> >>>> -----Original Message-----
> >>>> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
> >>> Behalf
> >>>> Of Bryan Garaventa
> >>>> Sent: 14 March 2018 18:09
> >>>> To: WebAIM Discussion List < <EMAIL REMOVED> >
> >>>> Subject: Re: [WebAIM] Selects with drop downs
> >>>>
> >>>> "and the Whatsock designs don't work at all well in some cases. In
> >>>> one specific case, JAWS 2018 announces that the combobox has been
> >>>> set to a different value than has actually been selected."
> >>>>
> >>>> Hi,
> >>>> There are many possibilities which may be causing this confusion,
> >>>> not
> >>> just
> >>>> the programming of the widget. E.G The purpose you are trying to
> >>>> use the combobox for, support level differences between browsers or
> >>>> screen reader bugs, or configuration settings available within the
> >>>> combobox widget that you may not be aware of.
> >>>>
> >>>> So, when you get a chance, can you please reply with steps to
> >>>> reproduce, including the version of JAWS and which browser you are
> >>>> using plus the widget example you are testing? Also please explain
> >>>> the negative behavior that you are experiencing, which will give me
> >>>> a sense of where to home in specifically.
> >>>>
> >>>> Thanks,
> >>>> Bryan
> >>>>
> >>>>
> >>>>
> >>>> Bryan Garaventa
> >>>> Accessibility Fellow
> >>>> Level Access, Inc.
> >>>> <EMAIL REMOVED>
> >>>> 415.624.2709 (o)
> >>>> www.LevelAccess.com
> >>>>
> >>>> -----Original Message-----
> >>>> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf
> >>>> Of
> >>> Steve
> >>>> Green
> >>>> Sent: Wednesday, March 14, 2018 7:31 AM
> >>>> To: WebAIM Discussion List < <EMAIL REMOVED> >
> >>>> Subject: Re: [WebAIM] Selects with drop downs
> >>>>
> >>>> I have been testing those Whatsock comboboxes recently and I find
> >>>> that
> >>> they
> >>>> only work well under certain specific circumstances. There are many
> >>>> ways
> >>> in
> >>>> which a user can interact with even a simple combobox (I have
> >>>> tested ten ways but there are potentially more), and the Whatsock
> >>>> designs don't
> >>> work at
> >>>> all well in some cases. In one specific case, JAWS 2018 announces
> >>>> that
> >>> the
> >>>> combobox has been set to a different value than has actually been
> >>> selected.
> >>>>
> >>>> It's worth noting that even when the behaviour is acceptable, the
> >>>> user experience is substantially different from a native combobox.
> >>>> I find it disappointing and frustrating that the HTML5 and ARIA
> >>>> specifications have not been written such that it is possible to
> >>>> closely or exactly emulate a native combobox. It would be
> >>>> interesting to know if there is a reason for this. It seems such an
> >>>> obvious thing to want to do.
> >>>>
> >>>> I hadn't planned to post these comments yet but I felt obliged to
> >>>> since
> >>> you
> >>>> were recommending these designs. I will send Bryan Garaventa my
> >>>> report as soon as it is complete. I very much hope that he can fix
> >>>> his designs
> >>> because
> >>>> they are better than any other combobox replacements I have tested.
> >>> However,
> >>>> I don't regard them as being good enough to recommend to our
> >>>> clients yet.
> >>>>
> >>>> Steve Green
> >>>> Managing Director
> >>>> Test Partners Ltd
> >>>>
> >>>>
> >>>> -----Original Message-----
> >>>> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
> >>> Behalf
> >>>> Of Brandon Keith Biggs
> >>>> Sent: 14 March 2018 14:03
> >>>> To: WebAIM Discussion List < <EMAIL REMOVED> >
> >>>> Subject: Re: [WebAIM] Selects with drop downs
> >>>>
> >>>> Are these datalists?
> >>>> https://www.w3schools.com/tags/tag_datalist.asp
> >>>>
> >>>> Otherwise, AccDC has some fantastic comboboxes:
> >>>> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%
> >>> 20Comboboxes%20(Native%20Inputs,%20Editable%20and%20Readonly)/demo.ht
> >>> m
> >>>>
> >>>> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%
> >>> 20Comboboxes%20(Native%20Inputs,%20Multiselect%
> >>> 20Editable%20with%20Substring%20Match)/demo.htm
> >>>>
> >>>> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%
> >>> 20Comboboxes%20(Simulated,%20Readonly)/demo.htm
> >>>>
> >>>> There are several others, but you can find them in the technical
> >>>> style guide.
> >>>> Thanks,
> >>>>
> >>>>
> >>>> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
> >>>>
> >>>> On Wed, Mar 14, 2018 at 5:54 AM, Ryan E. Benson
> >>>> < <EMAIL REMOVED> >
> >>>> wrote:
> >>>>
> >>>>> Pardon the title, I am not sure what these things are officially
> >>>>> called.
> >>>>> There's a group bent on using select elements aka dropdowns with
> >>>>> built-in search/filter functions. I believe there was a thread
> >>>>> here a while ago, but can't find it. Unless I am mistaken, the
> >>>>> thread leaned towards not using them, even though they can be made
> >>>>> accessible. The PM and the second developer didn't know what
> >>>>> framework they were using, and have yet to hear back from the
> >>>>> lead, but they think Bootstrap "or based on it."
> >>>>>
> >>>>> Any pointers would be great, since i have yet to get access to
> >>>>> their code.
> >>>>>
> >>>>> --
> >>>>> Ryan E. Benson
> >>>>> > >>>>> > >>>>> 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
> >> > >>
> >
> >
> > --
> > Work hard. Have fun. Make history.
> > > > > archives at http://webaim.org/discussion/archives
> > > >
> > > > > > > > > > > > >