SkipTo 5 Script

The SkipTo Script Version 5 is a replacement for the old school “Skip To Main” link, (so please use it as such)! The SkipTo script creates a drop-down menu consisting of the links to important landmarks and headings on a given web page. Once installed and configured, the menu makes it easier for keyboard, voice recognition and screen reader users to quickly jump to the desired location by simply choosing it from the list of options.

Benefits of SkipTo

• All users can get an outline of the major content areas on the page.
• Screen reader users can get a higher level navigation menu without having to use the screen reader landmark and header navigation commands which typically include longer lists of lower level headings and less used landmarks.
• Keyboard only users can more efficiently navigate to content on a page.
• Speech recognition users can use the menu to more efficiently navigate to content on a page.

Websites using SkipTo

There are two main ways to include the menu button for SkipTo in a page. In the default configuration the menu button is always visible making it useful to everyone to easily find and navigate to the important content regions identified by the author. This is similar to how curb cuts help more than just people using wheelchairs. It is also easier for people using voice recognition to activate the button using the “click skip to content” command and use similar voice commands to activate SkipTo menu items. The “popup” option is the more traditional approach to fulfilling the “bypass bocks” requirement of the Web Content Accessibility Guidelines, but this option makes the feature less visible to people who might benefit.

Visible Menu Button (default)

• DRES Accessible IT Group
• College of Applied Health Sciences
• Illinois Webcon

Popup Menu Button

• Nightingale Design Research
• cPanel Web Hosting Service @ Illinois
• Functional Accessibility Evaluator (FAE)
• Study Abroad Program for College of Education

NOTE: Popup menu button option is available through configuration of SkipTo when it is loaded.

How it works

1. The SkipTo menu button should be the first tabable element on the page, and if it is configured not to be visible when the page is loaded, the menu button becomes visible when it receives focus.
2. Once the keyboard focus is on the menu button, pressing the ENTER, SPACE, DOWN ARROW or UP ARROW keys will pull down the list of important landmarks and headings on the page. The button is based on the ARIA Authoring Practice design pattern for menu button.
3. Use arrow keys to select your choice and press ENTER to move focus to the section of the page.
4. If you decide to reach the menu again, simply press the built-in access key (0 by default). See the notes on Access keys for More information on how to use them.

Shortcut keys

Shortcut keys allow you to open the SkipTo menu from anywhere on a web page and have been standardized in version 5 to be the same across all browsers on the same operating system.

• Windows/Linux – Alt+0
• macOS  – Option+0

Give It A Try

• SkipTo Version 5 is used in this website, and is the “Skip To Content” button on the top of the page.
• SkipTo Version 5 information on installation and configuration.