Colours
Colour Use for Learning
The Basics
For online learning content, the use of a limited number of colours is the best practice. This evidence-based suggestion is rooted in cognitive load theory, and research which shows that:
- "readers like additional color; and
- color can help learning (see Dwyer, 1978); but
- extra colors have to be used sparingly and consistently if they are not to confuse the readers;
- some colors stand out more than others, so it is unhelpful to use a range of colours on the same page" (Hartley, p.921)
Limiting extraneous visual information, such as colour, can help learners focus on learning.
UBC Canvas Colours
Most often you will see that the Learning Management System (LMS) has adopted institutional colors. The UBC Canvas LMS uses the following UBC brand colours.
These colors are used in the main navigation menu, bread crumbs, visited links, and other areas in the Canvas learning environment. The colors selected are versatile and the contrast ratio of these colors is in compliance with the Web Content Accessibility Guidelines Links to an external site..
Using black for text and standard dark blue for buttons and other shapes ensures that your course looks professional and part of the UBC brand.
ETS Canvas Template Recommendations
In addition to the UBC Canvas colours, any customized formatting in the ETS templates uses neutral greys.
Limiting the additional colours to neutral shades of grey helps learners as it reduces visual complexity. A light grey and a dark grey are used in the template and sample pages so that the text and background colour combos are readable; background combos using medium tones can often reduce legibility.
Literature on the design of online learning materials also supports the need for consistency, as students may feel lost as they navigate from course to course if colour schemes or even course layouts change.
Universal Design for Learners
This color scheme is designed with consideration for students with visual disabilities, cognitive challenges caused by ADHD, and anxiety. While this change may be made for some, they in fact benefit all learners.
Please note some program areas, such as MET, ECED, and NITEP have customized templates, which are different than this style guide.
References
- Hartley, James. (2004). Designing instructional and informational text. Handbook of research on educational communications and technology.
- Richardson, R. T., Ed, M., Drexler, T. L., Delparte, D. M., & D, P. (2014). Color and contrast in E-learning design: A review of the literature and recommendations for instructional designers and web developers. Download Color and contrast in E-learning design: A review of the literature and recommendations for instructional designers and web developers. Journal of Online Learning and Teaching, 10(4), 657.
- Universal Design for Learning (n.d.) UBC Wiki. Retrieved from:
https://wiki.ubc.ca/Documentation:Universal_Design_for_Learning