Hi, I have been asked to create tools within our course that allow learners to adjust the colours of font and background according to their learning needs. I've followed a tutorial and found a way to allow the learner to control the background colour (on the master slide) but is there a way in which they can control the font colour? I have around 30 slides and would like the learner to be able to choose the font colour from the beginning - any ideas? Is there a guideline for say colour blindness / visual impairment?
Storyline has been created with the visually impaired or color blindness in mind, as you can see in all the available tutorials found in this link (here), particularly the summary section which highlights the Storyline's accessibility features to help learners with disabilities to interact to its courses.
You can only so much control the background color of the player as it gives built-in option for that but not the font. Only the size of the font, which you can make bigger, can be modified or changed in order to a help learners with visual disabilities. But the font colors, sizes, and kind can be modified or changed in the built-in options given in the slides.
It is hard to set a guideline or standards as to what colors can be set for the visually impaired or with color blindness because different learners have different nature of color blindness, but you may find the following suggestions which I found from the web helpful to create a learning environment for your learners:
a) Avoid using color as the only indication of what to do, or the information you are trying to get across. Instead, use color only as an unimportant hint to the user;
b) Define the buttons with labels, such as "Continue," "Help," or "Quit" in addition to the use of colors;
c) Use high-contrasting colors but if it is not possible, use instead the plain black and white font and background; Darkening one color and lightening the other will increase contrast, so let's try keeping the hue of the colors the same while changing their lightness and saturation to provide a better contrast
To build on Jenny's comments, there is a standard, not a guideline, for color contrast and it should be implemented in all courses for all users. It is not best practice for the user to self-identify their disability and make changes to their own course or choose an accessible version of the same course. Courses should be designed based on accessibility standards using universal design principles. Color contrast and font size is a very small part of the accessibility standard for web pages (This is what the standard says).
(This is reality) It is, however, a challenge to meet theses standards because of different style opinions between branding departments (color), graphic designers, developers, instructional designers, SMEs and anyone else. It is also something that people think about retroactively instead of at the beginning of the design. I do plenty of work assessing courses after they are built and then redesigning the courses from the ground up. I have had several instructional designers remark in horror on how their course changed :)
Color contrast is one of many accessibility features and is a good universal design principle to always implement because color contrast impacts people with low-vision, color blindness, and tired computer eyes. Everyone can probably relate to the latter.
Font size is normally taken care of by individuals by increasing the zoom in their browser. This helps low-vision users. However, point size also impacts color contrast. 14 pt. is considered the smallest point size you should use. 12 point can get awfully small on ipads, for instance, and not real easy for tired eyes to read, much less people with a visual disability
There's an awesome color contrast tool at WebAIM https://webaim.org/resources/contrastchecker/. Check it out. Let me know if you have any questions about this tool. The standard can be confusing at first. I try to get my clients to meet the WCAG AA standard, especially if it is a retro fit.
I know this is an older conversation, but I wanted to share an update in case anyone stumbles upon this conversation in the future.
We just released another update for Articulate 360 and included a few new items you'll see in the release notes.
The items you'll be interested in is:
New: Let learners with accessibility needs change the visual appearance of text in a published course to make it more readable. Learn more about accessible text.
New: Text publishes with the proper semantic formatting for headings, links, lists, and other elements so screen reader users can explore content easily.
New: Use text styles to make content easy to navigate with a screen reader. Accessible text styles allow learners with visual disabilities to identify headings, hyperlinks, blockquotes, and paragraphs on each slide so they understand its layout and context. Learners can also use screen reader shortcuts to jump directly to headings and links.
Just launch the Articulate 360 desktop app on your computer and click the Update button for Storyline 360. Details here.
5 Replies
Hi Anita,
Storyline has been created with the visually impaired or color blindness in mind, as you can see in all the available tutorials found in this link (here), particularly the summary section which highlights the Storyline's accessibility features to help learners with disabilities to interact to its courses.
You can only so much control the background color of the player as it gives built-in option for that but not the font. Only the size of the font, which you can make bigger, can be modified or changed in order to a help learners with visual disabilities. But the font colors, sizes, and kind can be modified or changed in the built-in options given in the slides.
It is hard to set a guideline or standards as to what colors can be set for the visually impaired or with color blindness because different learners have different nature of color blindness, but you may find the following suggestions which I found from the web helpful to create a learning environment for your learners:
a) Avoid using color as the only indication of what to do, or the information you are trying to get across. Instead, use color only as an unimportant hint to the user;
b) Define the buttons with labels, such as "Continue," "Help," or "Quit" in addition to the use of colors;
c) Use high-contrasting colors but if it is not possible, use instead the plain black and white font and background; Darkening one color and lightening the other will increase contrast, so let's try keeping the hue of the colors the same while changing their lightness and saturation to provide a better contrast
Hope this helps.
cheers,
JC
Hi Anita,
To build on Jenny's comments, there is a standard, not a guideline, for color contrast and it should be implemented in all courses for all users. It is not best practice for the user to self-identify their disability and make changes to their own course or choose an accessible version of the same course. Courses should be designed based on accessibility standards using universal design principles. Color contrast and font size is a very small part of the accessibility standard for web pages (This is what the standard says).
(This is reality) It is, however, a challenge to meet theses standards because of different style opinions between branding departments (color), graphic designers, developers, instructional designers, SMEs and anyone else. It is also something that people think about retroactively instead of at the beginning of the design. I do plenty of work assessing courses after they are built and then redesigning the courses from the ground up. I have had several instructional designers remark in horror on how their course changed :)
Color contrast is one of many accessibility features and is a good universal design principle to always implement because color contrast impacts people with low-vision, color blindness, and tired computer eyes. Everyone can probably relate to the latter.
Font size is normally taken care of by individuals by increasing the zoom in their browser. This helps low-vision users. However, point size also impacts color contrast. 14 pt. is considered the smallest point size you should use. 12 point can get awfully small on ipads, for instance, and not real easy for tired eyes to read, much less people with a visual disability
There's an awesome color contrast tool at WebAIM https://webaim.org/resources/contrastchecker/. Check it out. Let me know if you have any questions about this tool. The standard can be confusing at first. I try to get my clients to meet the WCAG AA standard, especially if it is a retro fit.
Cheers,
Julie
Hi Articulate Team,
I updated my post but now it is grayed out. Hmmm. How can I fix this? The color contrast is horrible ;)
Hi Julie,
The posts are greyed out when it's flagged as potential spam, but not to worry we check these all through the day and have them released. 😀
I know this is an older conversation, but I wanted to share an update in case anyone stumbles upon this conversation in the future.
We just released another update for Articulate 360 and included a few new items you'll see in the release notes.
The items you'll be interested in is:
Just launch the Articulate 360 desktop app on your computer and click the Update button for Storyline 360. Details here.
Please let us know if you have any questions, either here or by reaching out to our Support Engineers directly.