| Panel |
|---|
|
ID&D KB How-to GuideWorking together to enhance teaching & learning. If you need additional assistance, please reach out to the ID&D team. |
...
DesignPLUS offers several tools to help with making content more accessible for students. The tools include the Contrast Checker, Headings Checker, Image Alt Checker, Link Checker, Math Checker, and the Table Checker tool. Each of these checkers and tools have easy ways to quickly adjust your content to make it more accessible, creating a much more user-friendly learning experience for all your learner types.
View this tutorial video to explore the capabilities of the accessibility tools offered in DesignPLUS.
| Iframe |
|---|
| src | https://play.vidyard.com/JUQuTySAMK8WXcDEb3dNXR.html |
|---|
| width | 530 |
|---|
| title | DesignPLUS Sidebar: Accessibility & Usability |
|---|
| class | vidyard_iframe |
|---|
| height | 305 |
|---|
|
This article provides step-by-step instructions on how to use the most frequently used accessibility tools in the DesignPLUS Sidebar (scroll down or click on the link to view a specific section):
...
| Expand |
|---|
| title | Click to continue Step-by-Step instructions... |
|---|
|
When the tool opens:
At the top you will be provided some guidelines on the contrast ratios that make content viewable
The error that is present will be displayed under the tab marked with a red exclamation point
You will be shown where the color contrast that is affecting viewability (Here it is affecting both large and normal size text sizes)
Looking at the page, you can see that the yellow font color selected for the list is not viewable for most people
Adjust the color of the text using the slidebar under the ratio boxes, Slide the button to the left to increase contrast As you adjust the color, the ratio will change When the ratio is acceptable the text error box will change to green
When the contrast ratio is acceptable for both Normal and Large text, the Apply button will appear.
 Click the Apply button (a check will appear) and the text in your page will be corrected.
|
Back to Menu
| Anchor |
|---|
| Heading-Check |
|---|
| Heading-Check |
|---|
|
Heading Checker Tool
...
| Expand |
|---|
| title | Click to continue Step-by-Step instructions... |
|---|
|
When the tool opens, You will see a listing of the headings in the order they appear, and an indicator of their level. Headings that are not in the right hierarchical order or position will be identified in red.
Click the appropriate arrow in front of the heading to move it higher or lower in order.
 The heading and the style applied to that level of heading will be corrected and be identified in the tool.
|
Back to Menu
Image Alt-Text Checker Tool
...
| Expand |
|---|
| title | Click to continue Step-by-Step instrucitons... |
|---|
|
When the tool opens, At the top you will be provided a short explanation of what Alt-Text is used for The images that appear on your page will be displayed in a column under the guidance For each image a warning message will appear if you have either not provided alt-text or marked the image as decorative If you have entered a file name as the alt-text, the tool will remind you that this is not a good practice
To correct this issue, enter the appropriate selection: If the image is purely decorative, you can check the tick box on the upper right side If the image is something relevant to the content on the page, enter a description in the Alt-Text box
When you have made your entries, the error message will disappear, and the page will be ready for a screen reader to interpret the images for a student.
|
Back to Menu
| Tip |
|---|
Tip! Avoid using the phrase “An image of” in your alt-text description. Do not use the file name in the alt-text. |
...
Related articles
...
| Page Tree |
|---|
| root | DesignPLUS Tools for MyClasses |
|---|
| startDepth | 1 |
|---|
|
...
Visit the DesignPLUS Training Series Tutorials for more videos. For more step-by-step guides, visit the DesignPLUS User Guide. (These links will overwrite this page.)
...