Visual Acuity
- Description
- Design Practices
- Coding
- Tools
Visual acuity problems also create complications involving accessible web design, because people with these kind of impairments are usually too nearsighted or too farsighted to see the text on a website. Problems with a person's visual acuity include conditions such as Hyperopia and Myopia. Myopia, also known as nearsightedness, affects roughly 60 million people in the U.S. alone, and Hyperopia, also known as farsightedness, affects about 75 million people in the U.S.
As far as web accessibility is concerned, most problems related to Hyperopia and Myopia can be fixed by changing the size of the font on the computer. Also, ensuring high color contrast between the background, foreground, and font colors will aid the visibility of the text on the screen. There are more tips below such as good web design practices, good elements of coding, and tools available to those with visual acuity problems to view the web.
Consider Contrast – Contrast is a measure of how well colors can be distinguished from others. When making a website, contrasting colors should always be used, but especially for the visually impaired. As far as visual acuity problems are concerned, color contrast can help them decipher words on the web page.
Use Less Graphics – In general, using less graphics causes less load time, but also, it creates less content for people with visual acuity problems to have to struggle to decipher because of their disability.
Ensure Flexibility – When making a site accessible to those with visual acuity problems, flexibility in the design should always be practiced. Flexibility means that the font size should be able to be changed in the browser without affecting the design of the website.
Watch Page Length – For any website, pages should not be too long. People get bored too easily, but especially for the visually impaired, pages should be made as short and concise as possible. If there are long pages, punctuate them with headings. This way, the various sections are identified easily.
Text Size – You always need to make sure that you don't put font into absolute size such as pixels or points. The best practice is to use relative sizes such as em, ex, or percentages. This allows the browser to be utilized for the resizing of the text as specified by the user, usually that is small, medium, or large.
HTML Validation – You should always validate your code. This will stop screen readers and other alternate browsers from misinterpreting the source code. A Doctype identifies how you validate your code. Always make sure you have the right Doctype for the html page you are designing.
Alt & Title Tags – Using alt and title
tags for images and other elements are very helpful
for the visually impaired since screen readers use the
descriptive text to tell them what they cannot see.
Also, be sure to use fairly long descriptions for complex
images.
Color Links Correctly –Many people forget the background and font colors included for links when they have not been used, are hovered over, or have been used. Always pay attention to these colors, and again, check the contrast.
Add Links for Pictures – Many software
programs used by the visually impaired do not read image
maps, so it is important to make text links available
in your content also.
For Developers
-Cynthia Says- This tool, created for web developers, tests one page of a website at a time to check accessibility according to Section 508 regulations and World Wide Web Consortium standards. It validates one page at a time and is meant for educational purposes. It is one of the top tools used by web developers to ensure accessibility.
-CSS Analyzer- This tool allows web developers to test the
validity of the CSS used in their web pages against the
World Wide Web Consortium (W3C) validation service. This
tool also provides a color contrast test for fonts and background
colors to ensure the colors are distinguishable from one
another. Lastly, this service checks the specified units
of measurement for relevant fonts to make sure they are
relative and not absolute. This means that the fonts can
be easily adjusted within the browser.
-Image Analyzer- This tool, made for web developers also,
examines the images on web pages to make sure appropriate
values are used for the alt and longdesc attributes. This
ensures that the images have descriptions, which is a must
for visually impaired accessibility.
-AccessColor- Made for web developers, this tool tests the
color brightness and color contrast between background,
foreground, and text in a web page. It will not only flag
sections of a page with color combinations that would prove
problematic but also provide relevant color combinations
for developers to use within their HTML and CSS documents.
-aDesigner- This tool, also made for web designers, ensures
that the content and applications on web pages are usable
and accessible by the visually impaired. To do this, it
checks the color contrast between foreground and background
objects, the flexibility of font size, the use of alternate
text for images, and the ability of links on the page to
show navigability.
For Visually Impaired
-Web
Accessibility Toolbar- Made for both web developers and
the visually impaired users, this toolbar can do a variety
of things. It can change the color and size of text for
users, but it can also validate HTML and CSS for designers.
-LowBrowse- This tool, created for people with vision problems,
presents text in an easy-to-see way when you mouse over
the text. The tool provides a special reading frame which
includes the text in a single line with customizable font
size, font, color contrast, and letter spacing without the
necessity of zooming in and out. Also, this service includes
a speech output system to further aid the accessibility
for the visually impaired.
-MozBraille-
This tool is not only a tool, but an extension onto the
Mozilla Firefox browser. It turns the normal Mozilla Firefox
browser into a completely new browser designed for blind,
color-blind, and other visually impaired users. It includes
a Braille output, a text-to-speech output, and a view in
order to increase character size. Still in beta form, this
is a great new browser for those who are visually impaired
to access the internet.