A Model for Accessible LMS Discussion Boards November 2013 Accessing Higher Ground Part of EASI Session Series

Presenters  Hadi Rangin IT Accessibility & Collaboration Coordinator Disability Resources and Educational Services (DRES) University of Illinois at Urbana-Champaign  Michael McKelvey Coordinator of Engagement Technology & New Media Office for Mathematics, Science, and Technology Education (MSTE) University of Illinois at Urbana-Champaign

Overview  Background on discussion board accessibility  Overview of our design model  Demo of our design model  Demo of U of I temporary solution  Demo of Moodlerooms solution

Background  Why discussion boards are powerful tools  How some discussion boards are more capable and consequently more complex  Understanding Forum, Thread, and Post dynamics  D2L’s additional layer: Topic

Current LMS Discussion Board Examples Blackboard Thread listing Moodle Thread Displayed in Nested View D2L Discussion Reading View

General Problems  Too many layers to deal with  Multiple nesting threads are a big issue  Discussion may easily venture off the topic  Massive, overwhelming information on the interface  Screen reader users cannot easily determine the relationship/context for messages.

Vendor Response  Vendors have tried to improve the accessibility of their discussion tools  Discussion tools are currently technically accessible  Discussion tool interaction remains difficult, cumbersome, and ineffective

Problems with Existing Models  Too much flat information on each page  Tool cannot be detached from application framework to reduce clutter  Many irrelevant elements/functions for common tasks  Lack of a mechanism to customize the interface  Too much noise for screen readers that read only one element at a time  No intuitive way of moving between major sections of the interface  No well-organized grouping of relevant functions  Incorrect use of elements—e.g., links instead of select, radio, button  Big problem: Use of basic HTML instead of advanced ARIA techniques

Highlights of our Suggested Model  ARIA landmarks to provide semantic structure for each section of the application  ARIA menu for intuitive keyboard navigation in the menu.  Select box for selecting the desired forum  ARIA tree view to browse and select desired thread  HTML headings to structure message content logically  Action toolbar for each post to access applicable functions  F6 key to switch focus between landmark regions (theoretical)

Notes on our Suggested Model  This design is optimized for Firefox and Chrome. We have not worked on cross-browser compatibility yet  Use NVDA with Firefox to test for screen reader accessibility; do not use JAWS  Go to the following link and see the model in action:   View a blog post describing the model: 

Technical info on our Suggested Model  Heavy use of open-source JavaScript frameworks/widgets:  jQuery (core JS framework)   jQuery UI (menu, menubar, modal dialog, datepicker)   (dev site)  OpenAjax Alliance (Treeview widget)   Accessible Select List: capturing keydown, change events & overriding default functionality until user hits

Disclaimer  We don't claim this design is the ultimate interface  It is a good, clean, functionally accessible interface  It can be offered along with other views  No branding for this view yet; maybe Illinois View?  We tried to group relevant functions together, but it may not be perfect  Vendors are welcome to borrow the design/code & remember to give credit to the team

A quick and incomplete enhancement  Institutions don't necessarily upgrade to latest version of vendor products  We need a quick (work-around) solution for current implementation  Collaborative work with Moodle developers at University of Illinois  Developed a quick patch  Big help navigating within the posted messages page  Incorporated ARIA Region and headings  Demo: U of I temporary solution Demo: U of I temporary solution

About Moodle/Moodlerooms  Moodle: “open-source community-based tools for learning”  Collaboration in an open-source community is not easy  Distributed developers with various technical skills  Very limited knowledge of accessible design within the Moodle community  Martin Dougiamas (father of Moodle) is seriously looking into making Moodle more accessible  Moodlerooms (now part of Blackboard) is one of the major contributors to Moodle core

Moodlerooms Implementation  Impetus:  Outstanding complaint about discussion board at University of Montana  A working solution needs to be delivered by end of 2013  Progress:  Moodlerooms started with our suggested design  Moodlerooms has been incorporating Moodle Core feedback, concerns, and suggestions  Demo: Moodlerooms implementation Demo: Moodlerooms implementation

Acknowledgements  Marc Thompson, Instructional Designer, University of Illinois  Dan Hahn, ELearning Professional, University of Illinois  Ken Petri, Program Director, Ohio State University

Questions?  Contacts:  Hadi Rangin  Michael McKelvey  URL for this presentation: 