Storyline 360: Adding Accessibility to 360° Images

Everyone learns differently. We process information at our own pace, use different devices, and interact with content in ways that suit our needs. That’s why we want to help you create immersive 360° experiences that are accessible to all learners.

Check out the list of available accessibility features for 360° images below.

• Adding Alt Text to Media and Buttons
• Keyboard Navigation
• Screen Reader Support

Adding Alt Text to Media and Buttons

Alt text helps learners understand the value of media files and buttons, and is especially important for people who use screen readers and other assistive technologies.

It’s easy to add alt text to the media and button in a marker or hotspot label in your 360° interaction. Just install the January 2022 update or later, then follow the steps below.

1. Select the image, video, or button in a marker or hotspot label.
2. Go to the Label tab on the ribbon, click Alt Text, and enter descriptive text in the dialog that appears, as shown below. (The short description defaults to the name of the media file and is customizable. The long description field is grayed out for buttons.)
3. Click OK.

Short Descriptions
Short descriptions (alt text) are essential for screen reader users and announced when learners tab to images and videos. (You can also manage short descriptions in the media library.)

Long Descriptions
Long descriptions are optional and announced when learners interact with the image or video. Reserve long descriptions for complex images (e.g., graphs, maps, tables, and charts) when brief alt text isn’t enough to convey information. Leave this field blank for simple, informative images and videos.

Alt Text Tips

Keep these tips in mind to write effective alt text.

• Make alt text meaningful. Describe the purpose of the media and what happens when learners activate a button. The same content could have different purposes in different contexts, so be sure to use alt text to tell learners why it’s there.
• Be concise. Aim for 150 characters or fewer.
• Exclude “image of” or “video of.” Screen readers announce “graphic” or “video” by default.

Keyboard Navigation

As of October 2021, learners can navigate 360° images with a keyboard. Accessible navigation is built right into the published output—just create your course and publish!

The following table lists the keys for navigating 360° images and the behavior of each key.

Tab/Shift+Tab	Press the Tab key to move from one interactive element, such as a marker or hotspot, to the next. Press Shift+Tab to move in reverse order. For example, press the Tab key to jump from one marker to the next in the 360° image. press Shift+Tab to jump back to the previous marker in the 360° image.
WASD Keys	Press the WASD keys to move the camera angle around the 360° image. (These navigation keys are also used on other popular platforms, such as YouTube and video games.) W moves up A moves left S moves down D moves right Note: You can use the WASD keys on QWERTY and non-QWERTY keyboards. However, there currently isn’t a way to change these keys. If you’re using the NVDA screen reader, you can also use its navigation keys (e.g., Down and Up arrows) instead to move around the 360° image.
Enter/Spacebar	Press the Enter key or spacebar to activate the selected interactive element (similar to a mouse click).
Esc	Press the Esc key to close a marker or hotspot label.

Screen Reader Support

Starting with the October 2021 update, 360° images are screen reader accessible. Learners with visual disabilities can easily explore 360° interactions and know exactly where they are. 

When a screen reader encounters a 360° image, it announces the following information:

• Alt text for the 360° image, if available
• Navigation mode—free navigation or guided tour
• Learner progress (i.e., the number of interactive elements in the 360° interaction and how many the learner visited)
• How to move the camera angle around the 360° image
• How to interact with interactive elements, such as markers and hotspots