Tips for creating online courses
Tips and tricks for writing, designing and developing online courses.
Tips for writing
- Page titles are informative and unique
 - Headings are used to convey meaning and structure
 - Hyperlink text is meaningful
 - Alternative descriptions for images are meaningful
 - Transcripts and captions for multimedia elements are available
 - Instructions for interactive elements are clear
 - Instructions are provided to help users prevent and correct errors
 - Content is clear, concise and in plain language
 - Reading order is clearly identified (for the graphic designer and developer)
 
Design tips
- Colour is not used as the only visual means of conveying information
 - Interactive elements are easy to identify visually and when focus is placed on the elements
 - Navigation options are clear and consistently presented throughout all sections.
 - Videos do not start automatically, and all video controls are visible at all times and properly labelled
 - All form elements have clearly associated labels
 - Easily identifiable feedback is provided
 - Headings and spacing are used to group related content
 - Instructions and required fields are clearly identified to help users prevent errors.
 - Error messages are short, clear and specific for users to understand and fix errors.
 - Alternative descriptions for images and media are presented to users
 
Tips for development
- Use the right size for the text; commonly 12px for web and PDF content, and 18px for PPT documents
 - Sufficient contrast between the foreground and background is provided
 - Labels for each form control are well associated
 - Alternative descriptions for images are using proper mark-up; decorative image alt text is set to empty quotations like 
<alt= ""> - Proper language attributes are used for the page language and for any language change within the page (for example French content on an English page)
 - Help users avoid and correct errors by provide clear instructions
 - Mark-up is used to convey meaning and structure
 - The code order reflects the reading order of the content
 - The design is responsive and mobile first
 - The code used adapts to the user's technology
 - All interactive elements are accessible using the keyboard
 
Page details
- Date modified: