Skip to content
  • There are no suggestions because the search field is empty.

Enabling WCAG/Section 508 compliance

Where to activate WCAG/Section 508 accessibility functionality for users in CourseMill.

CourseMill is compliant with the standards set in Section 508 - 1194.22 of the Rehabilitation Act and Web Content Accessibility Guidelines (WCAG) 2.0 - Level AA. To comply with WCAG 2.0 - AA, courses must also meet the 2.0 Level A standards. This allows you to activate the WCAG/Section 508 functionality for disabled users requiring content to be accessible.

These standards govern the requirements that must be met to enable Web-based content to be accessible to individuals with disabilities. View information about these standards at http://www.section508.gov and http://www.w3.org/TR/WCAG20/.

Where to activate WCAG/508 compliance

CourseMill WCAG assistance behavior

Interaction differences: non-WCAG and WCAG users

The following interactions differ between WCAG and non-WCAG users across the application. The course player is completely unaffected regardless of the student's WCAG setting. WCAG behavior only applies to the student, reporter, and instructor roles. It does not apply to restricted admin, admin, or sadmin accounts.

  • Expand row
    • Non-WCAG: Click on icon/link; JS toggles .hidden.
    • WCAG: Rows are pre-expanded, no interaction needed.
    • Examples: On My Courses, non-WCAG uses an arrow icon to toggle the SCO list; WCAG hides the icon and the SCO list is already visible. In Curriculums, WCAG hides the folder-expand icon; all sub-courses are pre-expanded in the DOM.
  • Upload file
    • Non-WCAG: SWFUpload Flash widget.
    • WCAG: Native <input type="file">, Tab + Enter.
    • Example: For batch import of students on the Manage Users page, non-WCAG shows a Flash upload button; WCAG users get a standard <input type="file">.
  • Sort column
    • Non-WCAG: Click link in header.
    • WCAG: Tab to link in header, Enter key.
    • Examples: A non-WCAG user hovers over "% Complete" and sees "Click to sort." A WCAG student tabs to the header and the screen reader says "Hit enter to sort."
  • Error messages
    • Non-WCAG: Injected HTML redText().
    • WCAG: Native alert(); screen readers announce it.
    • Examples: Access Code: when a student enters a wrong code, WCAG triggers a native browser alert instantly; for non-WCAG users the message is displayed as red text. Modal lock: a WCAG student must press Enter/OK to clear the error. Workflow: a non-WCAG student can keep typing in fields while the red error text is still visible.
  • Row hover effects
    • Non-WCAG: onmouseover / onmouseout.
    • WCAG: Skipped entirely; no visual hover state needed.
    • Examples: A non-WCAG student sees a background color change on hover. A WCAG student uses :focus styling on divs for visual feedback instead of mouse events.
  • Focus
    • Non-WCAG: No change.
    • WCAG: Focus is moved to the header on tab change.
    • Example: When a WCAG student switches tabs, focus moves to the heading automatically with no extra keystrokes. A non-WCAG user sees the content, so auto-focus isn't forced.

Known issue: reporter/instructor Gradebook permission

When the WCAG box is checked for an Instructor/Reporter role and that role is given Gradebook permissions, the user appears unable to click on a course to view or change its Status, Score, or Completion Date.

This is because there is an issue with mouse-event support for WCAG users in this scenario. While accessibility compliance depends on keyboard navigation rather than mouse usage, most of the affected tables currently lack keyboard support as well.

Related articles