Drag and Drop Help

May 10, 2023

Hi all,

I am trying to create a drag-and-drop activity that is 508 compliant. There was a template that I copied from, but the variables/triggers are a mess right now, and I'm struggling to set up the slide so that it functions properly. The learner needs to be able to drag any answer more than once. I'm not sure how this would work. For example, if the correct answer for both tiers DI and CO is “MP," can the interaction be set up so that MP can be dragged and dropped to both without there being more than one MP box? I've attached my SL file with the slide I'm working on.

Here are the instructions:

508 Compliant - Drag and Drop

On-screen text options:

TP
PA
MP
MI
MO

[Inverted pyramid graphic with five labeled tiers, Correct answers are in bold]
Smallest tier labeled “BA” - PA
2nd smallest tier “BR” - PA
3rd tier labeled “DI” - MP
4th tier labeled “CO” - MP
Largest tier labeled “TH” – TP

The learner should be given 2 opportunities to answer correctly. If the learner answers incorrectly the first time, it should show the Try Again popup.  If they answer incorrectly a second time, it should show the Incorrect popup and then show the correct answers in green (as a feedback state) when the learner clicks "close". When they answer correctly, it should show the Correct popup. The learner should be able to use any answer more than once.

2 Replies
Eric Santos

Hi Hannah,

Welcome to the E-Learning Heroes Community! I want to share this article which provides insights into the accessibility limitations of drag-and-drop interactions and how to design keyboard-accessible drag-and-drop interactions:

Drag-and-drop interactions require a mouse for navigation, making them difficult or impossible to use for learners with mobility impairments. If you add them to your course, provide text-based or keyboard-controlled alternatives. For example, you might use a keyboard-accessible interaction, such as a matching question or a slider interaction. You could also give learners a detailed text description of the information they need to know from the interaction.

Want to design a keyboard-accessible drag-and-drop interaction? Check out Sarah Hodge's downloadable example and the free webinar where she explains how to build it.

But I'd also love to hear what other folks in the community have to say regarding your concern here! Happy developing!