![]() This visual indicator is commonly presented as an outline around the element. That’s what focus indicators are for.Ī focus indicator is a visual indicator that “highlights” the currently focused element. Just like mouse users, they need to be able to see where they are on a page as they Tab their way through it, otherwise they won’t be able to identify the elements they are interacting with. This allows them to jump from one interactive element on the page to another. Keyboard users typically navigate their way through Web sites by pressing the tab key. By designing and implementing accessible focus indicators, we can make our products accessible to keyboard users, as well as users of assistive technology that works through a keyboard or emulates keyboard functionality, such as voice control, switch controls, mouth sticks, and head wands, to mention a few. A keyboard user’s cursor equivalent is the focus indicator. Their equivalent of a mouse cursor is usually hidden on too many Web sites, making it almost impossible for them to navigate those sites. Unfortunately, keyboard users experience the Web in a similarly frustrating manner too often. You could try clicking and then finding out, but you can probably already imagine what a nightmare of an experience you’re about to get into. But if you are hovering over one, you don’t know which one it is. You may or may not be hovering over a link or a button or any other form control at any moment. Your hand may be still on the mouse, and you’re moving the mouse across the screen and across the page but you can’t see where it is. And as you move your cursor onto the page, it suddenly disappears. You want to buy something or maybe book a flight somewhere. Imagine you visit a Web site and you want to browse it for some content. This guide is aimed at both designers who want to learn about accessibility considerations for designing focus indicators, as well as developers who want to implement them. I wanted to share this guide to designing accessible focus indicators because focus styles are a recurring discussion I have with designers I work with on most projects, so I thought it would be useful to provide this guide as a helpful reference. This post is a modified, text-only excerpt from my Practical Accessibility video course. This article was published on Aug 13, 2021, and takes approximately 33 minute(s) to read.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |