Are you responsible for the application or web page development cycle? Is one of your goals for it to be intuitive and accessible for everyone to use efficiently? You could be designing or developing an enterprise application installed on a server accessed by a browser by anyone over the internet. Maybe you are designing or developing a consumer or an enterprise application installed on a computer, mobile device, or a web page. Or you may be deploying a digital service and have these same goals of equal access.
As part of your careful design and development process you may have implemented user interface (UI), User Experience design (UX), accessibility and usability techniques to help with this goal.
One valuable resource you may have overlooked to assist is getting some guidance from people with disabilities. Since they may use a variety of assistive technologies, they could provide excellent feedback on User Experience (UX), User Interface (UI), usability as well as accessibility. To be sure you are evaluating for a broad range of assistive technology (AT) I suggest you at least have people evaluate with screen magnification, screen readers and voice recognition AT. Also people with disabilities have other unique and valuable skills that could be beneficial to your design.
Although other people with disabilities or challenges can assist just as well as I can, I will explain some skills a person who is blind may have that can relate to assisting with developing an organized and accessible user interface with some added accessibility tips.
Since I am completely blind it is helpful to keep track of things around the house and in my office. To assist with this goal I attempt to keep things in a familiar and organized location. This organization allows me to easily and quickly locate what I am looking for by utilizing landmarks by touch alone.
The way I locate things and get around in my physical world could be compared to designing a user interface in the digital world where all aspects of the application or web page are usable and accessible. This includes all user elements in the application or web page.
Some examples of user elements are hyperlinks, buttons, radio buttons, check boxes, drop down lists, form fields, navigational elements and additional user elements. This design includes insuring text and all user elements has sufficient contrast in an organized well-designed user interface where all actions can be performed by a keyboard. This user experience design and development attention along with accessibility techniques will aid in creating a positive user experience to help prevent frustration and unintentionally excluding some users.
One example from the physical world might be how some people who are completely blind walk down a hallway. They could know when they reach the fifth doorway on the right side of the hallway from cane tapping, sound differences as they pass doors or if they use a guide dog. If they have been in the room before they may know what the layout of the room is based on past experience. If you translate that to user interface design in the digital world you could think of each doorway as navigating down to the third heading level and know what is within that heading based on the text of that heading and the text of the second level heading.
Another way you can think about designing an effective user interface and creating a positive user experience is by being able to find your way around no matter where you are located within the application or webpage. For example from the physical world if I drop something on the floor and I hear it bounce or slide far away from where I am located I listen for it hit the floor. As it either bounces or slides across the floor I focus on where it stops making the noise to give me an idea of where it might be. I can then locate it by feeling navigational landmarks on the floor such as furniture to help me avoid obstacles and guide me to what I have dropped. This is similar to designing an effective user interface with key landmarks on it that will guide the user to sections, user controls, form fields or other user interaction types. This design will help the user to intuitively use the application or web page successfully.
Another example from the physical world. Just think of a completely blind person attempting to walk alone without the aid of a long white cane or a guide dog in an unfamiliar area. Their chances of locating a glass of water they were told would be on one of the tall cabinets in one of the rooms could be difficult or time consuming.
If you label all like user element types the same throughout the application or webpage and have sufficient descriptive landmarks this will assist users in effectively knowing how to interact with the user elements and move around the user interface with ease.
In addition to the Design, Development and Accessibility Section further down I have a few accessibility and usability tips below. If I use HTML terminology please translate these to whatever coding language you are using.
- Insure every user element in your application or webpage is accessible by a keyboard because not everyone uses a mouse. Designing for keyboard accessibility not only helps the disabled who use specific types of assistive technology it also will help the keyboard only users who do not have a disability.
- Be sure all essential graphics have alternative description to enable the screen reader users to understand the complete content and interact with all user controls.
- Insure all hyperlinks describe the destination and are descriptive when reading out of context and none of them have duplicate names if the destination page is not the same.
- Be sure the tab order and on-screen focus is correct. When you use your tab key to navigate through the interface the focus should mirror the visual order of navigation, links and controls on the page with sufficient visual indication of focus.
- Insure any tables are accessible by identifying the row and column headers and use captions if needed.
- Be sure all aspects of the application or web page have sufficient contrast to help all users.
- Insure like user controls are named the same within the same application or group of web pages that have the same topic to help the user from getting confused. Example: Do not use both buttons and hyperlinks if they both act like hyperlinks.
- Use headings and utilize other landmarks to assist with navigating the user interface to speed up navigation for all keyboard, voice recognition such as Dragon Naturally Speaking, and screen reader assistive technology users.
- The use of proper headings will not only help screen reader users, these will also assist keyboard only users and help with the structure and visual layout.
- Headings will also assist people who use voice recognition assistive technology such as Dragon Naturally Speaking (DNS) since some of the DNS users could speak the concise heading name to jump from heading to heading.
- Leverage proper semantics or the equivalent in your application or web page. If you cannot incorporate HTML in your application utilize the equivalent of semantic elements that are available in HTML in the specific technical requirements for your technology you are using to develop your application. Also use semantic elements when developing webpages. By leveraging semantics you can provide meaningful information regarding the user elements or page structure to the web browser thus to assistive technology users to assist them in using the product effectively.
- Developing a usable and accessible application or webpage does not only assist the disabled it helps everybody. For example you may have heard of people without any disability talking about an application or web page where they were so confused attempting to interact with it they had no way of intuitively knowing how to use it. This leads to extreme frustration and loss of valuable time.
After you complete your design and have a functioning product you are ready for your first pilot and to receive feedback. If you know of a person who uses assistive technology such as a screen reader, screen magnification or voice recognition ask them to try out your application or web page and provide their valuable feedback. If you do not know of anyone, contact a professional accessibility evaluation company to assist. You could also contact a non-profit organization related to people with disabilities and they may be able to get you connected with a person who can assist. In my opinion if they are located near you, you might even watch them use the application or web page in person over having them perform the evaluation remotely since this will benefit you in at least two ways.
- You will see any difficulties they may be experiencing first hand to allow you to resolve the issues in the next revision or better yet on the fly when you are with them.
- You will see a big grin on their face if you’ve developed and designed the application or webpage well and they can easily navigate it. I know personally I have a great big smile on my face if I am using an application or a webpage that is accessible, designed and functions well.
To learn about how people who are blind access information on their PCs or mobile devices read Understanding Assistive Technology: How Does a Blind Person use the Internet and How People Who Are Blind Can Orientate Themselves Using a Screen Reader.
Resources to Assist with Design, Development and Accessibility
User Interface Design Basics-Usability.gov
A Beginner’s Guide to User Experience (UX) Fundamentals-General Assembly
Web Content Accessibility Guidelines (WCAG) 2.1
Does anyone have any tips for User Interface designers, User Experience designers and developers for applications and web pages to help us design more effective applications or webpages that will result in a user friendly experience instead of a user unfriendly experience? Do you have any resources to share that will help us all in designing more effective and accessible user interfaces or techniques to design more intuitive and less cluttered user interfaces?
We all look forward to hearing your valuable thoughts, resources and any other information you want to share to help everyone to showcase talents equally and effectively without artificial limits.
Bill Tipton
Contributing Author,
Global Dialogue Center
http://www.globaldialoguecenter.com/
LinkedIn: http://www.linkedin.com/in/wdtipton
Facebook: https://www.facebook.com/bill.tipton.39
Twitter: http://twitter.com/wdtipton
Great article Bill. I believe your contributions are very valuable for web or application developers, who may unintentionally be excluding certain populations.
Knowledge and awareness drive change!
Posted by: Andrea Vega | September 19, 2019 at 08:18 AM
This is a very nice letter. From your Dad.
Posted by: W. B. Tipton | September 20, 2019 at 09:53 AM