• Practice Perfect

    How to Boost Website Accessibility for Those With Low Vision or No Vision

    Written By: Leslie Burling-Phillips, Contributing Writer, interviewing Brad Martin and Stephen M. Sullivan, PhD

    Download PDF

    For people with low or no vision, the computer is a powerful means of gaining independence, said Brad Martin, who has been blind since birth. “Before modern web technology, I had a much harder time paying bills, buying things from a catalog, or reading a newspaper without sighted assistance. Now I can do all of those things.”

    Websites can help—or hinder—patients with low vision. “When you make your website accessible, you open the door to allowing people like me to access the content you are offering,” said Mr. Martin, who works with the United Way of Southwest Alabama in Mobile. “Conversely, if your site is inaccessible, I am likely to abandon it and move on to another that meets my needs.”

    Getting Started

    Can your practice website do more to accommodate those with low vision and blindness? Here are some steps to take.

    First, evaluate your site. One of the quickest and easiest ways to determine whether your website is accessible to low vision and no vision visitors is to use the free online Web Accessibility Evaluation Tool (WAVE).

    Simply type in the URL of the page you want to assess, and the results are displayed within seconds. WAVE identifies:

    • the total number of “errors” found,
    • the type of error,
    • where on the page the error is located, and
    • how it should be corrected.

    “This is a great way to determine what improvements can be made, and it is where the Alabama Institute for the Deaf and Blind started when restruc­turing their website,” said Stephen M. Sullivan, PhD, who has been teaching about computers at the Institute for 25 years. Dr. Sullivan also speaks from experience, as he has low vision.

    Seek guidance from reliable re­sources. The Web Content Accessibility Guidelines (WCAG) were developed by the Worldwide Web Consortium (W3C), and they provide the foundational recommendations for web accessibility around the world. You can make your website more accessible by following those guidelines, which are based on the POUR principle of web design:

    • Perceivable: The content is available to the senses either through the browser or through other assistive technologies (e.g., screen readers or screen magni­fiers).
    • Operable: Users can access all controls and interactive elements using a mouse, keyboard, or other assistive device.
    • Understandable: The content is clear, without confusion and ambiguity. Keep your wording simple and concise.
    • Robust: If you follow best practices when building web pages—by, for instance, following HTML/XHTML specifications and using form labels and frame titles appropriately—then you will make it easier for screen readers and other tools to convey your infor­mation to the user.

    Busting 2 Myths About Online Accessibility

    Myth 1: Practices can’t afford to optimize their web pages for low (and no) vision. It is a common misconception that it is expensive and time-consuming to make web content accessible to those with low vision. A few minor tweaks may be all that is needed to make your practice “visible” to all of your pa­tients.

    Myth 2: Sighted people will be turned off by web pages that are opti­mized for low (and no) vision. “A good website can incorporate certain com­ponents that help those with low or no vision, and these will be completely undetectable to the sighted user,” said Mr. Martin. “Although these elements make a website easier for people with low vision to read, you can still build a perfectly attractive, usable, and popular website.”

    Create a User-Friendly Website

    Stick with the basics. According to Dr. Sullivan, the most significant, least expensive improvements a practice can make involve (1) implementing minor adjustments to contrast and font and (2) creating a concise and clutter-free organizational pattern on the practice’s website.

    You don’t need to add expensive accessibility tools. An organization doesn’t need to incorporate accessibility tools—such as magnification options or audio feedback—for those with low or no vision. Adding such tools “can be an expensive endeavor, and it is totally unnecessary. Anyone coming to the web with low or no vision will already have the tools they need to navigate your site. If you incorporate this addition­al functionality, I have an entire new system to learn, and it is a redundant addition,” said Dr. Sullivan.

    Facebook Boosts Accessibility

    Loss of vision is often associated with feelings of isolation and depression. Social media can potentially provide people with visual impairments a lifeline, helping them stay connected to their friends.

    Surmounting the image barrier. Now that cameras are ubiquitous on smartphones, images frequently play a key role in social media posts. And while people may comment on an image, they rarely describe what appears in that image. For people with low vision (or no vision), image-based posts presented a huge stumbling block. To address this, Facebook launched a tool—Automated Alternative Text—that uses object recognition technology to generate descriptions of photos in Facebook posts. When somebody uses a screen reader, they will hear that caption, which will provide valuable context for any comments associated with that post. 

    Facebook’s accessibility FAQs. Get your patients started by directing them to Facebook’s dedicated accessibility page.

    Focus on Legibility

    Contrast is key. It is difficult for in­dividuals with low vision to navigate websites with color combinations that are not easy to differentiate. Some users, for example, prefer white letters on a black background rather than black letters on a white background; others prefer a black font on a yellow background because it produces less glare. These options can be adjusted by the end user via their web browser. You can help, said Mr. Martin, by using “text and background colors that allow for easy reading. Don’t, for example, use black letters on a blue background just because the blue matches the color in your logo.”

    Use an easily readable font. Text should be displayed in a clear font that is universally available such as Times New Roman or Arial. Other fonts may be used, as long as they are not unnec­essarily complicated and as long as the letters are easily distinguishable.

    Features to Avoid

    From flashing images and fancy fonts to elaborate borders and pop-ups, “developers tend to frill things up and try to make their sites look cool. While these may be visually appealing to some, they actually divert [the visitor’s attention] away from the information that you are trying to deliver,” said Dr. Sullivan, who added that the premise of KISS—keep it simple, stupid—is a good rule of thumb to follow. Adding too much embellishment “only mud­dies the water, and these elements are not important to the end user.”

    Avoid pop-ups. Pop-ups are an an­noyance to just about everyone online, but they can be particularly problem­atic for individuals with low vision. For example, they can be difficult to navi­gate away from. Many pop-ups can be closed by clicking on an “x.” Someone who is sighted can readily recognize that a pop-up has appeared and swiftly get rid of it by clicking on the “x,” said Dr. Sullivan. However, if you are using a screen magnifier, and can see only a small section of the Web page—per­haps even just a few words—it might not be easy to find out how to close the pop-up. Indeed, you might not be aware that a pop-up has appeared.

    Do not use sliders. When seeking input from your patients and website visitors through surveys, avoid us­ing sliders to gain feedback. “There is no way to manipulate them with a keyboard, and a blind person cannot effectively control a mouse,” said Mr. Martin.

    Avoid using captchas. A captcha is a submission tool that is used to prove that a visitor is a human rather than a malign software application (or “bot”). A captcha might, for example, ask you to discern letters from a distorted image. “There is nothing worse than filling out an entire form and then getting stuck at the end because you cannot complete the captcha, particularly when there is no one home who can see to get you out of the jam,” said Mr. Martin. “If you must use a captcha, consider the type that asks the submitter to solve a simple math problem; for instance, ‘What is 3 added to 5?’ or ‘What is 5 take away 3?’”

    Use Alternate Text

    Provide alternate text for images. Websites commonly fail to use a simple helpful tactic: labeling images and buttons with alternative text that can be read by a screen reader. This is done using an HTML element called an “alt tag.” A basic descriptor is enough—for example, a photo of a Snellen chart should include alternate text within the source code that states the photo is of a Snellen Chart. And this isn’t just helpful for users with screen readers; if somebody has a slow connection, the alternative text might appear instead of the image.

    Provide alternate text for buttons. Alt tags are especially important for buttons (e.g., Home, About Us, Blog, and Contact Us) on your website. Mr. Martin explained, “When a designer uses a button with text in it and then saves that button as an image file—such as a JPEG image—the screen reader does not know how to interpret that information without an alt tag.” The result is that the screen reader reads the image as “Graphic” and then reads the URL that the button links to (e.g., “graphic/forms/contact.php”). “But when an alt tag is incorporated, the blind user hears the words provided in the tag, such as ‘Contact Us,’ which the sighted user does not see because the image is displayed instead.”

    ___________________________

    Mr. Martin is a program coordinator for the United Way of Southwest Alabama in Mobile. Relevant financial disclosures: None.

    Dr. Sullivan is case manager and project director for the Alabama Institute for Deaf and Blind in Mobile. Relevant financial disclosures: None.

    Patient Resources

    The Academy’s initiative in vision rehabilitation includes a handout for patients that can be downloaded for free.

    The handout explains common types of vision loss, offers reassur­ance that the impact on daily activi­ties can be minimized, lists resources, and explains how occupational ther­apy through a rehabilitation program can help patients remain active.