Re: Dragging examples

Hi Detlev,

I'm currently part of a team working on drag and drop material for our
company. Is this discussion towards WCAG or A11y standards?


On Tue, Jan 14, 2020 at 10:18 AM Detlev Fischer <detlev.fischer@testkreis.de>
wrote:

> Looking for implementation examples I offer a small collection of links
> unfortunately only number 4 seems to offer a single pointer activation
> alternative. Will continue searching. Have not yet written to other
> lists (or webaim list).
>
> CALL FOR HELP: Anyone coming across implementations of dragging (such as
> drag and drop, list reordering) that offer operation via single pointer
> activation on top of keyboard operability, please contact me!
>
> ------
>
> 1. Key resource: Keyboard-accessible drag-n-drop pattern, Jesse Hausler
> (Salesforce)
>
> https://medium.com/salesforce-ux/4-major-patterns-for-accessible-drag-and-drop-1d43f64ebf09
> Github repo:
> https://salesforce-ux.github.io/dnd-a11y-patterns/#/?_k=znv9pu
> Focus is on keyboard operability (incl. with Screenreader on), no single
> pointer activation
>
> 2. Harris Schneiderman, Smashing magazine: Enter The Dragon (Drop):
> Accessible List Reordering
>
> https://www.smashingmagazine.com/2018/01/dragon-drop-accessible-list-reordering/
> Demo: https://schne324.github.io/dragon-drop/demo/
> Focus is on keyboard operability (incl. with Screenreader on), no single
> pointer activation
>
> 3. Brian Garaventa, Accessible Drag and Drop – Why Foolproof Scripting
> Is Critical When Using ARIA
>
> https://www.levelaccess.com/accessible-drag-and-drop-why-foolproof-scripting-is-critical-when-using-aria/
> Focus is on keyboard operability (with Screenreader on)
> Links to examples currently fail
>
> 4. Barry Smith, Codepen of Drag and drop with number input for vertical
> resorting of list items
> https://codepen.io/barrytsmith/pen/kfiqj
> A bit awkward but this would presumably meet a Dragging SC - number
> input can be focused by single pointer touch, number added via virtual
> keyboard via single pointer touch, new position saved by pressing "Update"
>
> 5. iOS11: ForScore offers a setting that offers alternatives but these
> still seems to involve dragging (have not investigated this more closely)
> https://forscore.co/accessibility-drag-and-drop/
>
> 6. Syncfusion jQuery Kanban Board
>
> https://js.syncfusion.com/demos/web/?_ga=2.242398018.1975078109.1579014604-190772274.1579014604#!/bootstrap/kanban/workflow
> Looks like no keyboard operability, no single point activation
>
> 7. React-beautiful (drag-n-drop)
>
> https://egghead.io/lessons/react-course-introduction-beautiful-and-accessible-drag-and-drop-with-react-beautiful-dnd
> Video intro promises operability with "only a keyboard or a screen
> reader" (haven't verified that)
>
>
> --
> Detlev Fischer
> Testkreis
> Werderstr. 34, 20144 Hamburg
>
> Mobil +49 (0)157 57 57 57 45
>
> http://www.testkreis.de
> Beratung, Tests und Schulungen für barrierefreie Websites
>
>
>

-- 

*Jerry Lee* | SAVI Web Developer | T 917.710.6072
Pronouns | (He/Him/His)
[image: Achieve More. Macmillan Learning.] [image: Certified Accessibility
Specialist. T. X. D. L. A.]

Visit our Student Store <https://store.macmillanlearning.com/>! Questions
about using our digital products? Find answers in our new Support Community
<https://community.macmillan.com/community/digital-product-support>!