According to a National Council on
Education annual survey of college freshmen (2001), at least 9% of college
students have a disability of some sort. It is believed that a higher
percentage have a disability but are not making this known to their
report). Later studies place the rate much higher, with trends showing this figure is increasing.
A good place to start: Getting
Started: Making a Web Site Accessible. Initial
introduction to resources for people new to Web accessibility (Español).
This includes a link to: How People with
Disabilities Use the Web, which explains some of ways that people
with disabilities access and use web pages.
The major categories of disability
- Visual blindness,
low vision, color-blindness
inability to use a mouse, slow response time, limited fine motor
control (includes persons with orthopedic disabilities, or who
have Repetitive Strain Injuries (RSI) such as Carpal Tunnel Syndrome,
Myofascial Pain Syndrome, and others
learning disabilities, distractibility, inability to remember
or focus on large amounts of information.
These can be divided into two groups: visible
and invisible disabilities.
Why accessible web design is important
- Web pages should be made accessible to EVERYONE
regardless of their physical or mental impairment (e.g., Albert Einstein,
- Web pages should be made accessible to EVERYONE
regardless of their computer equipment (age, speed, and connection)
- More resources are moving onto the Web or computing
environment (with less resources being added in print or other non-electronic
- More services are being added to Web and computing
environment creating a greater dependence on computer use
- It makes for higher quality page design
- The purpose of a web page is TO PROVIDE DATA AND
INFORMATION while not confusing or challenging the user (in other
words if the site is too hard to navigate, the user will not use
it or will not get the intended message or data). An unfriendly page
will not be used
- Good page design increases page use
- Good page design makes you and your constituents
look better to users
- Good page design is morally right. Create pages
for others as you would like to have others create pages for you
- It's the LAW!
"The power of the Web is in its universality.
Access by everyone regardless of disability is an essential aspect."--Tim
Berners-Lee, W3C Director.
Important Things to Remember When Designing a Page
- Accessible web pages are not plain, text-only pages.
- Accessible web pages do not have to be boring.
- Accessible web pages should contain the same level and quality of content that any other pages contain.
- Accessible web pages require as much human attention as any other pages.
- Accessible web pages usually are adaptable to more browsers, displays, equipment, and connection speeds.
- If you design all your pages as accessible web pages, then you only need to create one page for everyone.
- If you design all your pages as accessible web pages, then everyone will benefit.
The following are a selection of ways that you can
improve your pages to be more accessible. Not all are going to be available
and you may not have time to do all of them, however, the more that
you can afford to do, the better your pages will be found and used. First, several key points must be stated:
- Consider the content of your page. What is its
message? What are the essential elements of the message?
- Be clear, concise when writing text and arrange
the content on the page in a logical, easy to follow fashion.
Less text is easier to read and comprehend, and will more likely be read.
- Use fonts, type sizes, consistently throughout a page/site and prefer using one or possibly two type faces only. This makes the pages easier to read and to follow.
- Think about how your page might be used, and by
whom. Be as EMPATHETIC as possible (for a real challenge, put on a
blindfold and try to read your page)
- Create pages that help users, not
pages, in which FORM is more important than CONTENT. Avoid trying
to impress users with your "creativity" and "knowledge" of
fancy effects and gimmicks.
- Be consistent with terms, HTML tags/coding, and with how you label
page elements (e.g., images)
- Learn about the HTML commands that will display your data correctly
to screen readers or text readers. In particular learn about:
tags to describe content, to identify content features
- HTML codes and how THEY ARE SUPPOSED TO BE USED
tags and how to create descriptive ones.
There are ALT tags to use for defining acronyms, alternative,
long text descriptions, and others
- CSS style sheets can be used to control text
elements (size, font, layout) as long as CCS does not affect or prohibit access. [See: Roselli, Adrian].
- Various format tags, such as <ACRONYM title="">
and <ABBR title=""> that will display in text-only
or to screen readers with the description (Acronym or Abbreviation). These help to "describe" in a non-visual way
- Form-related tags and codes. Provide
LABELS for input fields
- Tags for quotes in foreign languages (e.g., <span lang ="de"></span> for
a German language quote). (See more: HTML for Translators; LC Language Codes).
- Use the <html lang=""> tag in the <head> tags
to state the language used on the page
- When coding, use code as efficiently as possible and
only use elements such as tables or color when they are necessary.
- If you use tables, code them in PERCENTAGES rather
than PIXELS so that text and other elements can be adjusted by the
- Format text blocks using formatting tags (e.g.,
use <text align:center> rather than <center>.
Use <blockquote> for quotes, not to indent.
- Use graphics, sound and video files sparingly and
only if these will provide information that enhances the content.
Avoid adding animations and sounds if they do not add to the content. Whenever, in doubt, do not use it.
- If you create buttons using image files and
image maps, make the buttons large enough to select without hitting an
exact target (in other words, bigger selection areas are easier for
people to click on).
- If you use radio buttons or other FORM related
selection devices, use them sparingly or only when needed. Small
buttons (or target areas) to select are difficult for some people
to click on.
- When offering a choice or any form of response-required element (e.g., button, link), make this obvious to any user.
- When working with color on a page (backgrounds,
text, links, etc.) make sure to choose colors that truly contrast
(in brightness) or that do not become hard to read when viewed. Printing
the page out in black and white will show some problems, but other
situations can only be judged by researching. View the color
chart to see how colors appear on screen displays. [see also: Arditi].
- When using color for text be sure that
the information is also described using <heading..> tags or
a border. You can also offer an alternate description in your text. [see also: Arditi].
- If you create a page that automatically updates data by refreshing the screen, make sure to provide a user option
to stop this
- Learn how to write scripts that work with adaptive
- Create device-independent pages. Remember
that not all users are using a mouse, or a scroll wheel, etc. Allow
the user to determine which device to use by making sure to not create
codes that are device-dependent (i.e., "on click")
- Check your work using validators and also by performing several simple
- Print your finished page in Black and White (grayscale) to see how it might appear to someone with visual difficulties
- Use validators to find coding errors or deficiencies
- Turn off the graphics on your browser
and view the page as TEXT ONLY. You can see if the page can be "read" well
or if it is confusing
- View the page with the style sheet setting
- Change the text size on your browser to see how the page
- Try to navigate your page using the TAB key
to move about the page. How well does it move through the document?
- Try turning on text-to-speech and listen to how your page is
- Have people test your page, especially those
who might have difficulties with access.
Accept that no matter how hard you work
at it, more can always be done. This also means that you need
to decide how much can reasonably be done with your page. The
Guidelines have different levels of compliance and each is progressively
more complete. The minimum levels however may be more than enough
for your needs.
"Do the best that you can to make your
website as accessible as is possible."
Refer also to: Quick Tips To
Make Accessible Websites.
Guidelines, Standards, and Laws
Section 508 requires that electronic
and information technology that is developed or purchased by the
Federal Government is accessible by people with disabilities. It concludes with a summary section
pegged to the sixteen Section 508 Standards (non-governmental site).
Another useful site is Web
Accessibility for Section 508. This
online course provides an overview of Section 508 and the specifics
of making a web page accessible.
Also useful is the Section
508 Checklist (non-governmental site).
Guidelines For Accessibility
Accessibility Initiative (WAI) W3C (World Wide Web Consortium).
In addition to the guidelines, this site provides extensive help
on the entire process of providing access to web pages. Also
included on the site are:
New York State
University at Buffalo
Accessibility at UB. The University at Buffalo has compiled guidelines
and resources to describe how to comply with official web pages.
The University at Buffalo
Libraries developed the following guides to assist in meeting
the Priority 1 requirements. These work within the framework of the
The Canadian Charter of Rights and Freedoms "guarantees
the rights and freedoms set out in it subject only to such reasonable
limits prescribed by law as can be demonstrably justified in a free and democratic
society." Under: Equality Rights:
15. (1) Every individual is equal before
and under the law and has the right to the equal protection and equal benefit
of the law without discrimination and, in particular, without discrimination
based on race, national or ethnic origin, colour, religion, sex, age or mental
or physical disability
This document is the basis for legal rights of Canadians with disabilities.
The Canadian government has adopted the document Common
Look and Feel for the Internet as its requirements for accessibility.
This is a good reference for American web designers as well.
Evaluating Page Accessibility
Your Markup. A good place to start. Enter your URL and see a summary of how your page fares [documentation online helps to understand the results]. See also Validators in
the QA Toolbox W3C page with validation tools for all sorts of
Web pages. See additional W3C validators:
3.0 Accessibility Tool
- STEP508 page.
(the Simple Tool for Error Prioritization
for Section 508 compliance). You can download
this WINDOWS application for free
and use it to clean up pages for accessibility. Additional web-checking applications links on page.
- WebXACT (formerly WebBobby). Free service (there is also a pay application)
that allows you to test web pages, to identify and fix
barriers to accessibility. Also assists in encouraging compliance
with existing accessibility guidelines. Enter
a URL and WebXACT shows accessibility
problems and offers suggestions on fixing the page. Also gives
concepts to explain why something may need to be explained
using alternate text (e.g., color background).
- UsableNet offers industry-leading
information and expertise in the form of simple, easy-to-use software
tools that automate website usability and accessibility testing.
UsableNet develops Web productivity solutions that target Web designers,
Web developers, Web masters, and IT professionals in the Corporate,
Government, Education, and Graphic Arts markets. Available in the
form of software applications and online services, UsableNet products
enable users reduce website development and maintenance time, improve
the Web experience for site visitors, and standardize Intranet and
Internet content across development teams by helping them to incorporate
usability and accessibility principles.
Other checking systems (and resources) include:
accessibility with W3C WCAG and Section 508.
Opera to Check for Accessibility
does your HTML look like in Lynx? Allows web
authors to see what their pages will look like (approximately)
when viewed with Lynx,
a text-mode web browser.
Web Page Backward
Compatibility Viewer. See how your page looks on older browsers/equipment
TV Viewer. WebTV Viewer simulates the TV browser
on a PC. It can tell you if your Web content
is appropriate for the receiver. It has tools to show you
how content is altered to look the best on a television screen.
There is a special window that shows how tables and images
are scaled, information that is not available on a standard
receiver. It even contains utilities for creating triggers
and sequencing them into a file for use when your links are
incorporated into a broadcast.
Other products to test websites of all sizes
for accessibility issues are found in the accessibility
section on www.watchfire.com. In addition, the following provides help on implementing and maintaining a compliant website:
Validators are not perfect either. See my score on this page. Most "problems" are in the URLs, which use a variety of non-standard conventions. Or view the UB Libraries page, or
The following is a selection of the more useful websites
advocating for, or relating to, accessibility issues.
- American Council of
- National Federation
of the Blind
- Center for Persons
with Disabilities (CPD). One of the 61 University
Centers for Excellence in Developmental Disabilities, Education,
Research, and Services.
- CPB/WGBH National Center for Accessible
Media (NCAM). A research and development facility dedicated
to issues of media and information technology for people with disabilities
in their homes, schools, workplaces, and communities. Note: has
an Access Instructions
for Users with Disabilities page. Useful as an example.
Provides resources on all aspects and the site itself can be viewed
using a number of options (i.e., full graphics, no graphics). Note: "Skip to page content" link.
- EASI -
Equal Access to Software & Information
Technology Technical Assistance and Training Center. ITTATC
promotes the development of accessible electronic and information
technology by providing technical assistance, training and information.
They offer an online web course written for web developers to
teach techniques for creating accessible web sites, in particular,
web sites that comply with the Section
508 Standards for Accessible Web Content. A familiarity with
HTML basics will ensure the best possible foundation for success
with this course.
Center for Disability Resources on the Internet (ICDRI).
I CDRI links to sites that explain issues regarding usability
and accessibility issues for persons with disabilities using
the web, as well as links to information about the legal issues
involved in making a website accessible.
- National Clearinghouse on Postsecondary Education
for Individuals with Disabilities (George Washington University
HEATH Resource Center).
Independence through Computers (LINC)
Department of Health & Human Services.
- Viewable With Any Browser website. Working toward encouraging web designers to create web resources with universal accessibility.
Pages of Related Links
Products for Web and Computer Access
Scanning, reading machines, and other computer add-ons for accessibility, especially to sight-impaired users.
- Sensory Tools. Computing and other devices built specifically for blind, sight-impaired, and color blind users. Some are quite innovative and unique to the field. Includes: reading machines, color readers, PCs for the blind, braille calculators and compasses, and the Aria PDA talking assistant.
Scientific. Makers of hardware and software providing access
for a variety of disability situations. Includes products:
- JAWS® for
Windows, a powerful screen reader software that outputs
through speech synthesizer and to refreshable Braille displays.
screen magnification with true low vision screen reading and
converts printed documents or graphic based text into an electronic
text format using accurate optical character recognition and
Outloud, designed for blind or low vision computer users
to access the Internet through speech and Braille output.
- Hardware includes:
Braille keyboards, readers, printers (embossers), and other
- GW Micro (Window-Eyes).
Screen enlarging for vision-impaired.
Home Page Reader 3.0.4. Powerful Web access tool for
blind and low vision users.
Technology. Listings of products and links, for users, resource selectors,
and lab site planners.
- WebABLE -
A provider of Web accessibility technology, consulting, and training.
- Apple Accessibility page. Assistive technology products and resources.
- Microsoft Accessibility page. Assistive technology products and resources.
Bibliography & Reading Materials
Statement (University at
Buffalo Office of Student Affairs). Offers links
to "helper" applications.
This may be an example of a "statement" that
doesn't state anything it intends. It does have links
to accessible resources that have been mentioned
- Arditi, Aries, PhD. Effective
color contrast for people with partial sight. Explains color concepts, with examples. This page also meets WC3 requirements for accessibility.
Making Text Legible: Designing for People with Partial Sight. Good explanation of working with text to be most visible to all users.
- Benner, Jeffrey. "Disabled
Web Access Made Easier" Wired (May 31, 2001). Has many links to disability
issues and how various situations are treated.
- Bertuca, David J. "Letting
Go of the Mouse: Using Alternative Computer Input
Devices to Improve Productivity and Reduce Injury." OCLC
Systems & Services 17:2 (June 2001):
- Bertuca, David J. "Voice
Recognition Software and OCLC: Technology That Works." OCLC
Systems & Services 16:2 (June 2000):
- Coffee, Peter.
Access Disabled by '90s Design." E-Week.com (October 28, 2002). Not everyone
is concerned about access to their website by diverse
populations and by diverse machines/browsers. Read
- Dimmock, Nora, and Terry Martin. Accessible
Web Page Design & Making Libraries Accessible:
It's the Right Thing to Do. Presentation,
October 15, 2004, WNY/O ACRL Fall Conference. (PowerPoint
file of notes).
Web Access is 'Being Ignored'" The Register. Comments on the legal issues involving website accessibility and liability of content producers.
Web Site Accessibility
Vincent & Michael
Willis. Web Pages That Suck:
Learn Good Design by Looking at Bad Design.
(ISBN: 078212187X). (See author's
website). This is a great resource (Website and book) for
learning about what makes pages better because the author shows
you bad pages and how to improve them.
- Heilmann, Christian. "Seven Accessibility Mistakes (Part 1; Part 2)." Digital Web Magazine (Jan. 31, 2006): accessed 30 September 2006.
- "The Importance of Human Evaluation" WebAim. The real test of a web page for accessibility comes from human testing. Also covers the strengths and weaknesses of software testing applications.
- Krug, Steve. Don't Make Me Think: A Common Sense Approach to Web Usability. Que, 2000 (2nd ed. published: 2005).
- Leduff, Charlie. "The
Web Delivers Light In a Sightless World" NY Times (May
- Nielsen, Jakob, Ph.D. "Accessible
Design for Users With Disabilities" Jakob Nielsen's Alertbox on UseIT.com (October 1996).
- __________. "Flash: 99% Bad" Jakob Nielsen's Alertbox on UseIT.com (Oct. 29, 2000). Using Flash for website design is often misuse of effort, space, and may limit use of content. See more useful articles in his Alertbox.
- Pisocky, Greg. "Whatever Happened to Accessibility?" Discusses the effects of Section 508 on web development.
Review of Free Online Accessibility Tools.
- Roselli, Adrian. "The Wrong Way to Use CSS in Page Layouts" (March 16, 2002).
- Smith, Jared. "Accessibility vs. Visual Design: Why can’t we all just get along?" From a blog on the AIM site. Other articles include: Making Firefox Accessible, Web Axe Interview, Firefox Accessibility, Target.com lawsuit moves forward (legal cases are increasing against web design).
- Stodden, R. A., Conway, M. A., & Chang, K. (2003). Professional Employment For Individuals With Disabilities. Discussion paper.
- Sutton, Jennifer. A
Guide to Making Documents Accessible to People Who
Are Blind or Visually Impaired: An Online Technical
Assistance Guide to Producing Documents in Alternative
Formats American Council of the Blind. Comprehensive
discussion about how to make print and electronic
information available to people with visual impairments
in a variety of accessible formats.
Access to Education for Visually Impaired Students (TAEVIS - Purdue Univ.). Example and resources available for a college setting.
Web Accessibility Policies: A Bridge Not Quite
Far Enough. Comments on how universities are dealing with website accessibility issues.
vs. Cognitive Disabilities
- Walker, Mary O. Designing
Web Pages for the Blind and Visually Impaired (1998).
- World Wide Web Access: Disability Discrimination Act Advisory Notes (Version 3.2),
August 2002. Australia. Human Rights and Equal Opportunity Commission.
Legal Rights to Assistive Technology (Univ. of Iowa, iPat Infotech (Iowa Program for Assistive Technology). See also:
Legal Rights to AT (University of Washington, Center for Technology and Disability Studies). Both provide information on legal rights and for assistance to designers.
See also Additional
Resources. To keep up with the changes in this
topic use a Google search for Web
accessibility (also try: website accessibility and accessible web pages). You may also wish to search various
journal databases, such as: Ergonomics
Abstracts Online. However, there will be articles
published in many fields that relate to Web design,
and accessibility issues, including:
Science, and Business among