Application Tab Key Navigation

There are a few settings to be aware of when using the keyboard on a Mac. There is a Keyboard System Preference to allow full tab key navigation. The setting is in the keyboard pane at the bottom of the shortcuts tab panel. It is labeled, “Full Keyboard Access: In windows and dialogs, press Tab to move keyboard focus between:”. There are two radio options, “Text boxes and lists only” and “All Controls”. Select “All controls” to use the tab key to access all of the controls in an application user interface and dialogs.

Safari Content Tab Key Navigation

Just changing this setting used to be enough to allow tab key navigation in browser content as well but since OS X Mountain Lion, there is an additional setting in Safari preferences. Open Safari preferences and navigate to the Advanced Panel. Under the Accessibility section check the checkbox to “Press tab to highlight each item on a webpage”. This will allow navigation to all controls and links on the page by pressing the tab key.

If you want Tab key navigation within the Safari user interface AND within the browser content you must enable both preferences, the System Preference Keyboard setting and the Safari Advanced Accessibility Preference.

Chrome Content Tab Key Navigation

There is also a setting in Chrome to allow tab key navigation to links and controls. Open Settings either via the menus or by entering chrome://settings in the navigation field. Scroll to the bottom of the page and select the “show advanced settings..” link. Then navigate to Web content section and select the checkbox labeled, “Pressing Tab on a webpage highlights links as well as form fields”.

Like in Safari, if you want tab key navigation within the Chrome user interface AND within the browser content you must enable both preferences, the System Preference Keyboard setting and the Chrome advanced Web content setting.

Firefox Content Tab Key Navigation

Firefox does not have a separate option for tab key navigation to links and form controls. In Firefox the OS X system preference takes precedence. Thus in Firefox you must have the OS X System Preference for “All Controls” selected in order for tab key navigation to work within the content and the user interface.

Firefox does have a preference in the Accessibility section of the General tab of the Accessibility pane to, “Always use the cursor keys to navigate within pages”. When this is checked the arrow keys can be used to navigate through the content line by line and character by character. However, this setting has no effect unless the OS X System Preference for Keyboard shortcuts is also set to “All Controls”.

VoiceOver Content Navigation in Safari

The OS X System preference doesn’t really affect how VoiceOver works. With the Safari preference to “Press tab to highlight each item on a webpage” selected the tab key navigation to links will work with or without VoiceOver running. However, with VoiceOver the user can use the VoiceOver key + arrows to navigate within HTML content. The VoiceOver key navigation works irregardless of the OS X or Safari preference.

Conclusion

In Safari and Chrome the browser preference for tab key navigation takes precedence. In Firefox the user must modify the OS X system preference for tab key navigation to links and controls within the content. VoiceOver navigation within HTML content via the VoiceOver + arrow keys works no matter how the OS X system preference is set.