E-mail List Archives
Thread: ARIA Drag and Drop Pattern
Number of posts in this thread: 8 (In chronological order)
From: Brian Lovely
Date: Tue, Jan 03 2023 7:58AM
Subject: ARIA Drag and Drop Pattern
No previous message | Next message →
What is the current status of a new ARIA Drag and Drop pattern?
Does drag and drag require an actionable role like button, or can it use a
role like listitem, as long as it announces "draggable"?
--
*Brian Lovely*
Lead Analyst - Digital Accessibility
804.389.1064 (Work)
= EMAIL ADDRESS REMOVED =
The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.
From: glen walker
Date: Tue, Jan 03 2023 12:10PM
Subject: Re: ARIA Drag and Drop Pattern
← Previous message | Next message →
Not a specific answer but keep in mind that DnD does not necessarily have
to be accessible. If DnD is used to perform an action, say, to reorder a
list, then as long as there is a keyboard way to reorder that list, then
you're ok. It's nice to make DnD accessible but it's not required.
With Safari on iOS/iPad, if you have multiple websites open, the tabs in
the browser can be rearranged by dragging them. With VoiceOver on it says
they're a "tab" widget and then says "double tap and hold, then move left
or right to re-order." It actually works pretty well with VoiceOver. VO
will tell you the names of the other tabs as you move before or after them.
From: Brian Lovely
Date: Tue, Jan 03 2023 12:11PM
Subject: Re: [External Sender] ARIA Drag and Drop Pattern
← Previous message | Next message →
As far as what Glen said:
Not a specific answer but keep in mind that DnD does not necessarily have
to be accessible. If DnD is used to perform an action, say, to reorder a
list, then as long as there is a keyboard way to reorder that list, then
you're ok. It's nice to make DnD accessible but it's not required.
On Tue, Jan 3, 2023 at 2:10 PM glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> Not a specific answer but keep in mind that DnD does not necessarily have
> to be accessible. If DnD is used to perform an action, say, to reorder a
> list, then as long as there is a keyboard way to reorder that list, then
> you're ok. It's nice to make DnD accessible but it's not required.
>
> With Safari on iOS/iPad, if you have multiple websites open, the tabs in
> the browser can be rearranged by dragging them. With VoiceOver on it says
> they're a "tab" widget and then says "double tap and hold, then move left
> or right to re-order." It actually works pretty well with VoiceOver. VO
> will tell you the names of the other tabs as you move before or after them.
> > > https://urldefense.com/v3/__http://list.webaim.org/__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKLGBQAeA$
> List archives at
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKtacdyfA$
> >
--
*Brian Lovely*
Lead Analyst - Digital Accessibility
804.389.1064 (Work)
= EMAIL ADDRESS REMOVED =
The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.
From: Brian Lovely
Date: Tue, Jan 03 2023 12:14PM
Subject: Re: [External Sender] ARIA Drag and Drop Pattern
← Previous message | Next message →
As far as what Glen said:
Not a specific answer but keep in mind that DnD does not necessarily
have
to be accessible. If DnD is used to perform an action, say, to reorder a
list, then as long as there is a keyboard way to reorder that list, then
you're ok. It's nice to make DnD accessible but it's not required.
The problem I'm having is that this is already designed, so I have to come
up with a solution that doesn't look any different. There aren't any
up/down buttons in the design, so I'm trying for an accessible drag and
drop solution.
On Tue, Jan 3, 2023 at 2:10 PM glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> Not a specific answer but keep in mind that DnD does not necessarily have
> to be accessible. If DnD is used to perform an action, say, to reorder a
> list, then as long as there is a keyboard way to reorder that list, then
> you're ok. It's nice to make DnD accessible but it's not required.
>
> With Safari on iOS/iPad, if you have multiple websites open, the tabs in
> the browser can be rearranged by dragging them. With VoiceOver on it says
> they're a "tab" widget and then says "double tap and hold, then move left
> or right to re-order." It actually works pretty well with VoiceOver. VO
> will tell you the names of the other tabs as you move before or after them.
> > > https://urldefense.com/v3/__http://list.webaim.org/__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKLGBQAeA$
> List archives at
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKtacdyfA$
> >
--
*Brian Lovely*
Lead Analyst - Digital Accessibility
804.389.1064 (Work)
= EMAIL ADDRESS REMOVED =
The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.
From: Detlev Fischer
Date: Wed, Jan 04 2023 3:19AM
Subject: Re: [External Sender]ARIA Drag and Drop Pattern
← Previous message | Next message →
That DnD does not have to be accessible for pointer users (mouse, touch)
may no longer be true if and when the draft WCAG Success Criterion 2.5.7
Dragging Movements https://www.w3.org/TR/WCAG22/#dragging-movements
becomes a W3C recommendation. This specfically asks for an alternative
to DnD where the underlying function can be activated by single pointer
inputs - independent of the question whether an alternative for keyboard
operation exists. (When a keyboard-operable alternative such as a
dropdowen is also pointer operable, it may satisfy both 2.1.1 Keyboard
and 2.5.7 Dragging Movements).
Am 03.01.2023 um 20:14 schrieb Brian Lovely via WebAIM-Forum:
> As far as what Glen said:
>
> Not a specific answer but keep in mind that DnD does not necessarily
> have
> to be accessible. If DnD is used to perform an action, say, to reorder a
> list, then as long as there is a keyboard way to reorder that list, then
> you're ok. It's nice to make DnD accessible but it's not required.
>
> The problem I'm having is that this is already designed, so I have to come
> up with a solution that doesn't look any different. There aren't any
> up/down buttons in the design, so I'm trying for an accessible drag and
> drop solution.
>
> On Tue, Jan 3, 2023 at 2:10 PM glen walker < = EMAIL ADDRESS REMOVED = > wrote:
>
>> Not a specific answer but keep in mind that DnD does not necessarily have
>> to be accessible. If DnD is used to perform an action, say, to reorder a
>> list, then as long as there is a keyboard way to reorder that list, then
>> you're ok. It's nice to make DnD accessible but it's not required.
>>
>> With Safari on iOS/iPad, if you have multiple websites open, the tabs in
>> the browser can be rearranged by dragging them. With VoiceOver on it says
>> they're a "tab" widget and then says "double tap and hold, then move left
>> or right to re-order." It actually works pretty well with VoiceOver. VO
>> will tell you the names of the other tabs as you move before or after them.
>> >> >> https://urldefense.com/v3/__http://list.webaim.org/__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKLGBQAeA$
>> List archives at
>> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKtacdyfA$
>> >>
>
--
Detlev Fischer
DIAS GmbH
(Testkreis is now part of DIAS GmbH)
Mobil +49 (0)157 57 57 57 45
http://www.dias.de
Beratung, Tests und Schulungen für barrierefreie Websites
From: Brooks Newton
Date: Wed, Jan 04 2023 8:50AM
Subject: Re: [External Sender]ARIA Drag and Drop Pattern
← Previous message | Next message →
For Glen or anyone else who's got a perspective to share: In instances
where a particular drag and drop interface isn't keyboard accessible, what
instructions (if any) are required to guide users to the accessible version
of the controls? Does this type of scenario fall under the "Conforming
Alternate Versions
<https://www.w3.org/WAI/WCAG21/Understanding/conformance#conforming-alt-versions>"
exception in the WCAG Understanding documentation?
What instructions are required to give users with disabilities a clearly
discernible and accessible path to the page controls that keyboard only
users will be able to use?
Brooks
On Wed, Jan 4, 2023 at 4:19 AM Detlev Fischer < = EMAIL ADDRESS REMOVED = >
wrote:
> That DnD does not have to be accessible for pointer users (mouse, touch)
> may no longer be true if and when the draft WCAG Success Criterion 2.5.7
> Dragging Movements https://www.w3.org/TR/WCAG22/#dragging-movements
> becomes a W3C recommendation. This specfically asks for an alternative
> to DnD where the underlying function can be activated by single pointer
> inputs - independent of the question whether an alternative for keyboard
> operation exists. (When a keyboard-operable alternative such as a
> dropdowen is also pointer operable, it may satisfy both 2.1.1 Keyboard
> and 2.5.7 Dragging Movements).
>
> Am 03.01.2023 um 20:14 schrieb Brian Lovely via WebAIM-Forum:
> > As far as what Glen said:
> >
> > Not a specific answer but keep in mind that DnD does not
> necessarily
> > have
> > to be accessible. If DnD is used to perform an action, say, to reorder a
> > list, then as long as there is a keyboard way to reorder that list, then
> > you're ok. It's nice to make DnD accessible but it's not required.
> >
> > The problem I'm having is that this is already designed, so I have to
> come
> > up with a solution that doesn't look any different. There aren't any
> > up/down buttons in the design, so I'm trying for an accessible drag and
> > drop solution.
> >
> > On Tue, Jan 3, 2023 at 2:10 PM glen walker < = EMAIL ADDRESS REMOVED = >
> wrote:
> >
> >> Not a specific answer but keep in mind that DnD does not necessarily
> have
> >> to be accessible. If DnD is used to perform an action, say, to reorder
> a
> >> list, then as long as there is a keyboard way to reorder that list, then
> >> you're ok. It's nice to make DnD accessible but it's not required.
> >>
> >> With Safari on iOS/iPad, if you have multiple websites open, the tabs in
> >> the browser can be rearranged by dragging them. With VoiceOver on it
> says
> >> they're a "tab" widget and then says "double tap and hold, then move
> left
> >> or right to re-order." It actually works pretty well with VoiceOver.
> VO
> >> will tell you the names of the other tabs as you move before or after
> them.
> >> > >> > >>
> https://urldefense.com/v3/__http://list.webaim.org/__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKLGBQAeA$
> >> List archives at
> >>
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!FrPt2g6CO4Wadw!I6_UZAZLONSqIpvIWhoLV_p8Q8LxGJEUFJSSgmT52nuWKxa0syTa8D3lLLO2G9OqTEA79C23U-7BO7rnYnKtacdyfA$
> >> > >>
> >
>
> --
> Detlev Fischer
> DIAS GmbH
> (Testkreis is now part of DIAS GmbH)
>
> Mobil +49 (0)157 57 57 57 45
>
> http://www.dias.de
> Beratung, Tests und Schulungen für barrierefreie Websites
>
> > > > >
From: Bryan Garaventa
Date: Wed, Jan 04 2023 11:14AM
Subject: Re: [External Sender]ARIA Drag and Drop Pattern
← Previous message | Next message →
Hi,
In case it's of help, there is an old article that I wrote to discuss the various considerations that go into accessible drag and drop, available at: https://www.linkedin.com/pulse/important-considerations-regarding-accessible-drag-drop-garaventa/
Since this was published, Apex 4X has replaced the deprecated TSG examples, so the links within the article no longer lead directly to the relevant test pages.
To access these, there is a keyboard sortable example of a listbox widget here: (matches the sortable listbox referenced within the article)
https://whatsock.com/Templates/Listboxes/Sortable/index.htm
(Does not have mouse drag and drop enabled)
Mouse drag and drop variations are available at: https://whatsock.com/Templates/Drag/index.htm#main
(Navigate between live test pages using the links within "Template Examples".)
Hope this helps a bit.
All the best,
Bryan
Bryan Garaventa
Principal Accessibility Architect
Level Access, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.LevelAccess.com
From: Bryan Garaventa
Date: Wed, Jan 04 2023 11:49AM
Subject: Re: [External Sender]ARIA Drag and Drop Pattern
← Previous message | No next message
Also, as a quick note, when the accessible drag and drop article was written there was no support for ARIA Slider widgets on iOS touch devices. Since that time, support has been added by Apple to pass through the assigned key event when the single finger up/down swipe gesture is used to increment or decrement the slider.
Relevant examples:
Horizontal: https://whatsock.com/Templates/Sliders/Horizontal/index.htm
Vertical: https://whatsock.com/Templates/Sliders/Vertical/index.htm
Bryan Garaventa
Principal Accessibility Architect
Level Access, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.LevelAccess.com