How we modified the Adaptable Moodle theme to make UCL Moodle more accessible.

1. Accessible Moodle
Making UCL Moodle more accessible
April 2017
Jessica Gramp
Digital Education Advisor
j.gramp@ucl.ac.uk

2. Accessibility, usability and inclusive design
“Accessibility, usability, and inclusive design are closely related. Their
goals, approaches, and guidelines overlap significantly.”
“In practice, basic accessibility is a prerequisite for usability.”
https://www.w3.org/WAI/intro/usable

3. Background
• Project money to improve accessibility of Moodle.
• Focus groups with disabled students and staff.
• Using Adaptable theme as it already solves many of the issues raised.
• Working with Blazie to develop recommendations.
• Coding the focus group data in Nvivo to establish key themes.
• Many of the concerns raised are around general usability that cause
additional problems for those with disabilities.
• Making Moodle more accessible for people with disabilities will
improve usability for all.

4. Disabilities
There are four broad areas that are covered by a number of disability
charities (AbilityNet):
• Hearing: Auditory Disability (deafness).
• Vision: Blindness and Visual impairment.
• Cognitive: Cognitive and Neurological Disability (Dyslexia, Autism etc.).
• Motor: Physical Disability.
https://abilitynet.org.uk

5. 10 main areas of accessibility concern
• Clutter - difficult to find information amongst irrelevant links and content.
• Emphasis – difficult to understand what is the most important information.
• Layout - page elements are not configurable, there is too much visible at once and the blocks are too wide.
• Navigation and Orientation - long, disorganised pages, with links to external services not being signposted.
• Usability - some interfaces, especially for assessments, are particularly difficult to use.
• Awareness - useful features (skip links) and services (Moodle snapshot) remain unknown.
• Personalisation - a lack of configurable page elements (blocks, fonts, font sizes and colours) or information
about how to do this independently with browser plugins and other assistive technologies.
• Text - Problems reading text that is overly long, too small, in a difficult to read font with poor contrast and
in difficult formats both in Moodle and the resources it contains.
• Consistency - inconsistencies between Moodle courses and conversely some courses not being adequately
distinguishable from others.
• Graphics - heavy reliance of written information that could be expressed more simply with icons and
images, with appropriate alternative text for those using screen readers.

6. Login
• Alerts
• Course search
• Announcements
• Feature blocks

7. Navigation
• Docked blocks
• Hide/show blocks
• Full screen toggle
• Customisation
• Help Menu

8. Dashboard
• Course overview
• Some find the extra info confusing.
• Reports of items remaining after action.

9. Editing a course
• Drag drop files notice
when editing turned on.
• This course menu:
• People
• Grades
• Activity Links
• Dyslexia considerations:
• Grey background.
• FontAwesome icons.

10. OpenDyslexi font applied via Chrome addin

11. Summary
• alter settings such as fonts, colours and css from the site admin interface.
• menus can show only to particular role types (e.g. student/staff).
• full screen mode, which slides into place.
• hide blocks mode, which slides them out of view.
• alerts that appear top of the page (although there's a current bug with
rendering more than one ticker item).
• alert when you ‘turn editing on’ that slides down from the top of the page
to inform editors to being able to drag and drop files.
• supports Dockable blocks.

12. Questions?
Jessica Gramp
Digital Education Advisor
j.gramp@ucl.ac.uk