Content Hover

 

Additional content that appears or disappears in coordination with focus/hover can lead to accessibility issues. When receiving and removing pointer hover or keyboard focus triggers additional content to become visible, then the following must be true.

Dismissable: An option is available to dismiss additional content without moving the focus (unless that additional content communicates an input error or does not obscure/replace other content).

Hoverable: If pointer hover can trigger additional content, then the pointer can be moved over additional content without said content disappearing.

Persistent: Additional content remains visible until hover or focus trigger is removed, dismissed, or information is no longer valid.

Authors who cause additional content to appear or disappear must design the interaction so that users can perceive any additional content, and dismiss it without disrupting their experience.

 

 

Focus Order

 

If a web page can be navigated sequentially, focusable components receive focus in an order that preserves meaning and operability. When a user navigates through content, they should be met with information in an order that is consistent with the meaning of the content. This should be the case, especially for keyboard users.

When a user uses the keyboard tab function to navigate through a web page, the focus order should be preserved and followed properly as they move through content.

The way that navigation order is determined is defined by the content. If no scripting or tab index attributes are used, the navigation order is determined by the order that components appear in the content stream.

In some cases, there may be more than one order that preserves meaning and operability. Authors should carefully consider all users as they design their web pages, as if the order of content differs from a determined reading order, it may make it difficult to understand.

 

 

Focus Visible

 

Any keyboard operable user interface has a mode of operation where the keyboard focus indicator is clearly visible. The reason for this is to help the user identify, out of multiple elements, which specific element has the keyboard focus. This focus indicator must not be time limited and must remain present the entire time an element is in focus.

 

 

On Focus

 

When any component that can trigger an event receives focus, it should not initiate a change in context. Examples of this would include:

• Forms submitted automatically when a component receives focus
• New windows launched when a component receives focus
• Focus is changed to another component when that component receives focus