- From: Gez Lemon <g.lemon@webprofession.com>
- Date: Wed, 26 May 2010 18:43:00 +0100
- To: HTML Accessibility Task Force <public-html-a11y@w3.org>
Hi, I've gone through HTML5's drag and drop mechanism and have outlined some accessibility issues. This topic will be discussed in an upcoming Thursday teleconference, so comments and suggestions are very welcome. WAI-ARIA defines an aria-grabbed state (values true or false) to determine if an element has been selected to take part in a drag and drop operation. If aria-grabbed is not provided, the element cannot take part in a drag and drop operation. HTML5 defines a draggable attribute to determine whether an element may take part in a drag and drop operation. The attribute defines the values true, false, or auto (browser's default). The draggable property does not determine whether the element is currently selected for the drag and drop operation, but does determine if the element can take place in a drag and drop operation. Recommendation: Either define a native grabbed state with values true or false, or use the aria-grabbed property: <li draggable="true" aria-grabbed="true"> WAI-ARIA defines an aria-dropeffect property with the following values: * copy * move * link * execute * popup * none HTML5 defines a dropEffect attribute for the DataTransfer object with the following values: * none * copy * link * move The execute and popup values are not defined in HTML5. Recommendation: Add execute and popup to the list of attribute values support by the dropEffect attribute. Ensure an Accessible Workflow This is the most problematic area for HTML5's drag and drop mechanism. WAI-ARIA defines a workflow for drag and drop [1] in the Authoring Practices document. The recommendation is made up of seven key points: 1: Identify draggable objects 2: Allow the user to initiate the appropriate drag operation using the keyboard 3: Mark the drop targets 4: Implement keyboard functionality to assist the user and AT with executing the drop. 5: Cancelling a drag operation 6: Clean-up after drag/drop 7: Document non-recommended keyboard navigation The DataTransfer object is a property of an event, so there is no way of creating the object without raising an appropriate event (for example, dragenter, dragover - events that are required in the HTML5 drag and drop procedure). As far as I could determine, these events can only be raised by physically moving the source over a target using a pointing device. It is possible to identify draggable objects in HTML5 and initiate the drag and drop operation using the keyboard, but it's not possible to complete the operation using the keyboard alone. Some people have suggested that drag and drop operations can be completed using the Copy and Paste API. This needs more research, but the user would still need to know which items were copyable, and what the effect would be of pasting the source in the target. I can't find any mention of a copy and paste API in the HTML5 specification, but it must have been included at one point, as I've found several references to the URL: http://dev.w3.org/html5/spec/Overview.html#copy-and-paste, but that section doesn't appear to exist now. If copy and paste is able to adequately define what can be achieved using drag and drop, then it could be recommended that HTML5 defines a copy and paste API in their current work. Otherwise, the recommendation should be that the drag and drop API is amended to allow the workflow suggested for drag and drop [1] in the WAI-ARIA Authoring Practices document. [1] http://www.w3.org/WAI/PF/aria-practices/#dragdrop Regards, Gez -- _____________________________ Supplement your vitamins http://juicystudio.com http://twitter.com/gezlemon
Received on Wednesday, 26 May 2010 17:43:29 UTC