Accessibility

SkillTree is committed to providing an accessible learning experience for all users. This guide outlines the accessibility features and best practices to enhance your experience with the platform.

Please Note

If you're interested in creating gamified training experiences rather than earning credits in existing trainings, please check out our Administrative Accessibility Guide for more details.

Basic Navigation

  • Use Tab to move forward through interactive elements
  • Use Shift + Tab to move backward
  • Press Enter or Space to activate buttons and links
  • Use arrow keys to navigate through menus and dropdowns
  • Use Escape to close modals and popups
  • Use Alt + Left Arrow to navigate to the previous page in the browser history
  • Use Alt + Right Arrow to navigate to the next page in the browser history

Productivity Shortcuts

On the Skill Page:

  • Ctrl + Alt + p (p for previous): Navigate to the previous skill
  • Ctrl + Alt + n (n for next): Navigate to the next skill

Please check back in often as we continue to add productivity shortcuts to the platform.

Landmark Navigation

The heading structure is organized hierarchically to facilitate easy navigation using screen reader landmark navigation.

For example, on a single training entry page, the heading levels are organized as follows:

  • The training title serves as the main heading (Level 1)
  • Progress metrics and subject sections are organized under Level 2 headings:
    • Overall Points
    • My Level
    • Current Level Progress
    • My Rank
    • My Badges
    • Subjects (Level 2 heading that groups all subjects)
      • Each subject is a Level 3 heading

This heading hierarchy enables efficient navigation through screen readers. For example, using JAWS Screen Reader:

  1. List all headings with INSERT+F6
  2. Navigate directly to the first subject by pressing 3 for the first Level 3 heading
  3. Press 3 again to move to the next subject heading
  4. Once you reach your desired subject, press Tab to access the View button

Skip to Main Content

The "Skip to content" feature helps you quickly access the main content by bypassing repetitive navigation links. This button appears when you first press the Tab key on any page.

To use this feature:

  1. Press Tab when the page loads
  2. The "Skip to content" button will appear in the top-left corner and be automatically selected
  3. Press Enter to jump directly to the main content area

Tips

You can access this feature at any time by refreshing the page with F5 and then pressing Tab.

Screen Reader Support

  • Decorative images and icons are labeled to be skipped by screen readers
  • Many actions are announced to screen readers for better accessibility, this is in addition to the default announcements provided by the browser
  • All form fields have associated labels
  • Clicking on a form field label will focus the field
  • Required fields are clearly indicated
  • Error messages are announced by screen readers
  • Buttons have descriptive text
  • Interactive elements are keyboard accessible
  • Focus indicators are visible for keyboard navigation

Visual Adjustments

  • The application supports browser zoom up to 200%
  • Text and interactive elements maintain a minimum 4.5:1 contrast ratio
  • Color is not used as the sole means of conveying information
  • All color combinations meet WCAG 2.1 AA level compliance

Video, Multimedia and Images

Please note that training content is managed by the creators who are responsible for ensuring their content is accessible. This is particularly important for skill descriptions, uploaded videos, multimedia, and meaningful images.

SkillTree Platform provides features to enhance accessibility for training creators to utilize:

  • Add descriptive alt text to meaningful images
  • Add captions to uploaded videos
  • Add transcripts to video and audio files

If you encounter any accessibility barriers, please contact either your training's creators or the SkillTree support team.

Rich Text Editor

The Rich Text Editor enhances text entry across various pages, including self-reporting justifications and text input quiz/survey questions. It supports both tab-based navigation and keyboard shortcuts for text editing:

FeatureShortcutExplanation
Copy & PasteCtrl+C / Ctrl+VPaste anything from browser, screenshot, excel, powerpoint, etc.
HeadingsCtrl+Alt+tSupports 6 different sized headings
BoldCtrl+BApply bold formatting to text
ItalicsCtrl+IApply italic formating to text
StrikeCtrl+SApply strike-through formating to text
Font SizeCtrl+Alt+sApply a specific font size to text
LineCtrl+LInsert a horizontal line seperator
BlockquoteAlt+QApply quote formatting to line(s) of text
Unordered ListCtrl+UA bulleted list
Ordered ListCtrl+OA numbered list
IndentFn+TabWhen creating a list, this will indent the list one level
OutdentFn+Shift+TabWhen creating a list, this will outdent the list one level
ImageCtrl+Alt+iInsert an image. Images may be chosen from a local file, a URL, or copy and pasted.
LinkCtrl+Alt+rA hyperlink to an external resource
AttachmentsCtrl+Alt+aAttach a file to the description. Attached files will be stored on the SkillTree server and a link for downloading the attachment will be provided.
Inline CodeCtrl+Shift+CApply code style formatting inline
Code BlockCtrl+Shift+PApply code style to a multiline section

Feedback

At SkillTree, we're committed to making our platform accessible to everyone. We regularly test our system using both automated tools and manual reviews. Your feedback is incredibly valuable to us! If you encounter any accessibility barriers or have suggestions for improvement, please don't hesitate to reach out.