Web designers are usually faced with the challenge of finding workable tips to design for visually impaired web surfers. As web designers, we strive to create and design web interfaces that are user friendly, but many times there is a minority group for whom we fail to make adequate preparations.
The visually impaired are often not given full consideration when web interfaces are designed. Yet, this small percentage of the population needs to access the web just as the much the larger visually-able populace.
- Enhancing the Usability of Your Website
- Tips to Evaluate Design User Experience
- How to Design for Your Target Audience
- How to Build User-Friendly Website
- Five Tips For Better Website Typography
- Designing Websites for a Better Mobile User Experience
- Nine Fonts to Use and Avoid in Design
- DOs and DON’Ts of a Website Background
Creating an awareness among web designers.
The visually impaired need to use the Internet for garnering information, socializing, working and getting updates on what is happening in the world around them. This group consists of those who are fully blind, color blind and those experiencing deterioration of their sight.
It is best that you be aware of each group within the visually impaired group and learn about their special needs. Check How to Design for Your Target Audience.
- Surfers who are color blind.
- Surfers who are partially blind or fully blind.
- Surfers who are dyslexic or suffer from similar conditions that hinder their ability to properly read and understand text.
- Surfers who have difficulty reading small text.
Tips to design for visually impaired users
Step 1. Use clean and semantic coding to support alternate browsing.
The visually impaired have difficulties accessing information from websites that were not designed using clean coding practices. The accuracy and proper operation of the software used by this special group for internet activities heavily relies on the developer’s use of clean coding practices.
In simpler language, a poorly designed website creates difficulty for alternate browsers used by the visually impaired that would translate the website’s information to Braille output or speech output.
The browser will not be able to read the source code correctly and reproduce the material in a manner that will make sense to the visually impaired. Convince the Average User to Change to a Non-IE Browser.
Step 2. Validate your website’s code.
Use standard HTML syntax to validate your website’s code. This will prevent the occurrence of errors appearing in the source code. If a syntax error should occur, it will prevent alternate browsers from interpreting the source code, and create difficulties for the user to access the information.
Step 3. Avoid linking text.
A linked text is of no benefit to the visually impaired as they cannot read it. Their software will speak the text for them as it is not visual, but audio. If web designers are to make their web sites compatible with this software they will need to state the destination of the linked text.
Step 4. Give the text adequate space so that it is still readable if the surfer needs to enlarge it for reading.
The borders of some websites are too close and does not allow for sufficient enlarging of the text. Avoid designing your website in such a manner that prohibits users from selecting their browser preferences, check How to Build a Better Design Experience.
Some surfers may opt to use the CTRL + shortcut to increase the text size, only to find that the text overlaps and makes reading even more difficult. This happens because there is an overlap in the columns and grid boxes. To prevent this, the designer should make the size of the layout large enough to accommodate font sizes from 10 to 16 points. Run a test on each size upgrade to ensure that the text is clear and readable. If you are working with limited space, it is ok to go up to 14 point.
Step 5. Pay special attention to how table cells and rows are written into the source code.
Avoid arranging text in vertical columns as the source code will first display those cells that are in a row, then go on to read the second column cell.
Step 6. Create keyboard shortcuts for the visually impaired.
The visually impaired will have difficulty seeing the cursor as it moves over the page. It is also tiresome to have to tab one’s way throughout the page content. Create a set of shortcut options for the visually impaired that are basic and easy to use and remember.
It is much easier for anyone with vision difficulties to navigate across content pages using the arrow buttons and a few other shortcuts. Facebook made excellent use of this technique, making their site very user friendly for their visually impaired and disabled users.
Step 7. Provide adequate color contrast for the visually impaired, and have your site tested for color-blind friendliness.
In order to facilitate the visually impaired, a web designer should use colors that produce a high contrast. Individuals with a sight problem will not be able to read material where the content and background are close in shade.
Additionally, web sites that are designed with a high color contrast tend to trend heavily on the web. Websites that use a number of different colors can be a challenge for the individual who is color blind. Test your site to ensure it is readable to the colorblind user. There are sites available for conducting these tests.
It is not easy to design a website that is user friendly to the visually impaired, but using these tips to design for visually impaired users will get the job done.