Slideshare uses cookies to improve functionality and performance, and to provide you with relevant advertising. If you continue browsing the site, you agree to the use of cookies on this website. See our User Agreement and Privacy Policy.

Slideshare uses cookies to improve functionality and performance, and to provide you with relevant advertising. If you continue browsing the site, you agree to the use of cookies on this website. See our Privacy Policy and User Agreement for details.

6.
Keyboard Accessibility
is Different When a
Screen Reader
is Running

7.
Source Code Order
=
Navigation Order
and screen reader reading order too!

8.
Navigation Order
• Use CSS (ﬂoat, position, etc.) to control
positioning
• Navigation order should follow visual ﬂow
• Sidebars before or after main content?
• Be careful with “content ﬁrst” approach
• Design reading/navigation order early

26.
Review
• Ensure all interactive elements are links or
form controls, or make them focusable
with tabindex=”0”.
• If using tabindex, detect Enter and Space
key events.
• Ensure non-focusable elements (such as
dialog windows) have tabindex=”-1”
before focusing them programmatically.

27.
Roving tabindex
• Useful for controlling focus within interactive
widgets (menus, tab panels, tree widgets, etc.)
• Set tabindex=”0” on currently active item.This
places it in the tab order.
• Set tabindex=”-1” on all other items.This
removes them from the tab order and makes them
focusable with scripting.
• Use focus() to set focus as user navigates
(arrow keys, etc.)
• tabindex=”0” roves or follows the active item
allowing users to return directly to it later.

35.
Carousels
• The target was the biggest item on the homepage
- the ﬁrst carousel item.“Nonetheless, the user
failed the task.” - Nielsen Norman Group
• “We have tested rotating offers many times and
have found it to be a poor way of presenting home
page content.” - Wider Funnel
• 1% clicked a feature. Of those, 89% were the ﬁrst
position. 1% of clicks for the most signiﬁcant
object on the home page? - Notre Dame
University

36.
Carousels
• “Almost all of the testing I’ve managed has proven
content delivered via carousels to be missed by
users. Few interact with them.” - Adam Fellows
• “Carousels are effective at being able to tell
people in Marketing/Senior Management that their
latest idea is now on the Home Page. In summary,
use them to put content that users will ignore on
your Home Page. Or, if you prefer, don’t use them.
Ever.” - Lee Duddell
• “Carousels are this decade’s <blink> tag.” - Jared
Smith