Ensure keyboard focus is indicated visually

Throughout the Sakai environment buttons are utilized that are able to receive programmatic keyboard focus, however there is no clear visual indication that the element has received focus. As such, as a keyboard-only user tabs through the page, they have no way of confirming which particular button is currently focused. This can be extremely confusing for keyboard-only users, and can result in the accidental activation of incorrect controls as the user has to guess where keyboard focus currently is.Developers must ensure that buttons implemented throughout the environment consistently provide a visual indication of focus. These buttons seem to be styled consistently (blue buttons with white text), and do provide a slight visual change when focused with the mouse. However, a visual change to indicate focus must also be provided as the element receives focus via the keyboard.

WCAG 2.0 Level A and AA standards require that sighted keyboard-only users be provided with a visual indication of which element has focus as they navigate through a page. Many elements on the Sakai Project website lack a clear visual indication of focus or are missing from the tab order, making it extremely difficult for these sighted keyboard-only users to know what elements are receiving interaction.