Learning management systems (LMS) like Canvas or UTSOnline are the tools we rely on most for housing learning content. Even before the rapid shift to remote teaching, these systems have long been essential for sharing readings, subject outlines, various assessments and more. And so it’s especially important that the information we store in an LMS is accessible to all who need it. So how can we eliminate barriers to learning for students who have specific access requirements, such as captions or compatibility with screen reader software? Here are four basic principles for online accessibility to pay attention to when you’re creating your subject sites.
Links
- Link text should clearly describe the purpose of the link. For example, when a link leads to a document that’s not a web page, but to other resources, that should be clarified in the link text.
- A proper descriptive text for a link also allows a more meaningful experience for a person using a screen reader. If the link text doesn’t indicate the destination or purpose of the link, screen-reader users have to rely on listening to the surrounding text for context.
- Instead of linking with ‘click here’, try something like ‘Read the Sydney Morning website article on accessibility features before your lecture’. If you need to share a document, a link like ‘Assignment Cover sheet (PDF 30KB)’ signals that the link will launch the download.
Images
We often use images to convey ideas, and it’s easy to forget that some students may need a text version to access the same information. This is where alternative text (alt text) comes in.
- Non-text content on webpages, such as images or animations, should have an alt text tag. This is helpful in two ways: firstly, for screen readers users, the alt text is read in place of the images. Secondly, if an image is not downloaded due to slow Internet speed, or an incompatible browser, the alt text information is available in place of the image.
- The amount of information you provide for alt text depends on the content and function of the image. For example, say you have an image of students sitting in a classroom, looking at a whiteboard filled with equations. If the function of the image is to show students in a maths lesson, your alt text tag could be ‘students sitting in front of a whiteboard with equations on it’. If the purpose of the image is just to show students learning and the equations aren’t relevant, the alt text might be ‘students in a classroom’. If the image has no clear relevance to the information you need to convey, you can tag this as a decorative image, which saves time for the users.
- Generally, alt text should be no more than 100 characters. Most screen readers cut off alt text at around 125 characters.
Colours
The way that you use colour in your web content can have a range of implications for students with accessibility requirements for vision.
- While colour can be useful to convey information, it should not be the only way information is conveyed. For users who cannot differentiate multiple colours, this may mean that your intended message will not be clear. You can mitigate these issues by providing additional identification cues, such as symbols. Here are some accessibility guidelines for using colour.
- Colour contrast is important too. Good design means ensuring there is sufficient contrast in foreground and background colours. Web tools such as whocan.use.com can help you figure out whether or not your colour contrast is accessible.
Formatting
- Headings are vital for helping all users to navigate the content on a web page. They allow sighted users to skim over the content of the page and navigate to the content they’re looking for, while screen reader users can easily skip through the headings.
- Headings provide a logical structure or narrative for your content, and so should be in a hierarchical order. Here’s an example of a web page with a clear heading structure from Web Accessibility Initiative.
H1: Clear Layout and Design
H2: What is “Clear Layout and Design”?
H2: Who depends on this feature?
H2: What are the additional benefits?
H2: What needs to happen for this to work?
H3: Design
H4: Clear Structure
H4: Consistent presentation
H3: Accessibility principles
Small changes can make a big difference
Online accessibility can be confusing, whether you’re new to the concept or have previous experience. But by considering principles of accessibility like the ones in this post, you’re contributing to creating a better online experience for all of your users, even those who may not have specific accessibility requirements. For more information, check out our guide for creating accessible content on LX Resources.