Keyboard navigation

Publicado: 20 octubre, 2018 |

Keyboard navigation

There are many different ways to use the web besides a mouse and a pair of eyes.Users navigate for example with a keyboard only or with their voice.

All the functionality, including menus, links and forms should work using a keyboard only. This is essential for all assistive technology to work properly. The only way to test this, at the moment, is manually. The best time to test this is during development.

How to keyboard test:

Tab through your pages, links and forms to do the following tests:

  • Confirm that all links can be reached and activated via keyboard, including any in dropdown submenus.
  • Confirm that all links get a visible focus indicator (e.g., a border highlight).
  • Confirm that all visually hidden links (e.g. skip links) become visible when in focus.
  • Confirm that all form input fields and buttons can be accessed and used via keyboard.
  • Confirm that all interactions, buttons, and other controls can be triggered via keyboard — any action you can complete with a mouse must also be performable via keyboard.
  • Confirm that focus doesn’t move in unexpected ways around the page.
  • Confirm that using shift+tab to move backwards works as well.

Resources




Otros artículos de la categoría Uncategorized


SMiLE-v6

Hello world!

Welcome to WordPress. This is your first post. Edit or delete it, then start writing!


Publicado: 22 abril, 2024

Horizontal Featured Image

Template: Featured Image (Vertical)

This post should display a featured image, if the theme supports it. Non-square images can provide some unique styling issues. This post tests a vertical featured image.


Publicado: 15 marzo, 2012

Horizontal Featured Image

Template: Featured Image (Horizontal)

This post should display a featured image, if the theme supports it. Non-square images can provide some unique styling issues. This post tests a horizontal featured image.


Publicado: 15 marzo, 2012

SMiLE-v6

Template: More Tag

This content is before the more tag. Right after this sentence should be a «continue reading» button of some sort on list pages of themes that show full content. It won’t show on single pages or on themes showing excerpts.


Publicado: 15 marzo, 2012

SMiLE-v6

Template: Excerpt (Defined)

This is a user-defined post excerpt. It should be displayed in place of the post content in archive-index pages. It can be longer than the automatically generated excerpts, and can have HTML tags.


Publicado: 15 marzo, 2012

SMiLE-v6

Template: Excerpt (Generated)

This is the post content. It should be displayed in place of the auto-generated excerpt in single-page views. Archive-index pages should display an auto-generated excerpt of this content. Depending on Theme-defined filters, the length of the auto-generated excerpt will vary from Theme-to-Theme. The default length for auto-generated excerpts is 55 words, so to test the […]


Publicado: 14 marzo, 2012

SMiLE-v6

Template: Sticky

This is a sticky post. There are a few things to verify: The sticky post should be distinctly recognizable in some way in comparison to normal posts. You can style the .sticky class if you are using the post_class() function to generate your post classes, which is a best practice. They should show at the […]


Publicado: 7 enero, 2012

SMiLE-v6

Template: Comments

This post tests comments in the following ways. Threaded comments up to 10 levels deep Paginated comments (set Settings > Discussion > Break comments into pages to 5 top level comments per page) Comment markup / formatting Comment images Comment videos Author comments Gravatars and default fallbacks


Publicado: 3 enero, 2012

SMiLE-v6

Template: Comments Disabled

This post has its comments, pingbacks, and trackbacks disabled. There should be no comment reply form, but should display pingbacks and trackbacks.


Publicado: 2 enero, 2012

SMiLE-v6

Template: Pingbacks And Trackbacks

This post has many pingpacks and trackbacks. There are a few ways to list them. Above the comments Below the comments Included within the normal flow of comments


Publicado: 1 enero, 2012