Web design: Web accessibility design guidelines

Web design: Web accessibility design guidelines
Arie Kahn| December 18, 2003

I always feel a certain degree of skepticism when it comes to the concept of universality in Web design. My intuition and usability experience tell me, that a good universal solution does not really exist.

 

Any universal Web site, intended for use by both able and disabled people, can be easily improved, if we optimize it specifically for each target audience. On the other hand, we designers don't usually consider what is best and optimal for the disabled audience. Frequently, disabled people are just out of the picture when it comes to design and any provisions for that audience are generally an afterthought. Ironically, designers and Web masters may find themselves in need of better Web accessibility—repetitive strain injury (RSI) hits the best of us.

This is just a short overview of the Web accessibility field and it is not intended to replace any official accessibility recommendations and guidelines.

Who are the disabled and how do they use a computer?
A partial list of audience disabilities that Web designers should consider includes: blindness; low vision; color blindness; physical and motor disorders; cognitive, neurological and learning disorders; and epileptic seizure disorders (triggered by visual blinking).

Blind people hear textual information through a synthetic voice (text-to-speech) software. They also may use Braille output hardware. People with low vision usually increase system fonts. For example, they may use big yellow fonts on a black background. They may also use screen magnification software. People with physical and motor disabilities usually use special hardware like a head-mouse or a head-pointer, specialized keyboards, or voice recognition software.

How to improve accessibility of Web sites
Below is a list of my top 12 Web accessibility tips, sorted by project management importance:

• Use CSS for layout, instead of <table>.
• Use <table> for Excel-like information only, not for layout.
• Define all font styles via CSS.
• A page must be logical and readable with CSS disabled.
• Use text structure via <H1>, <H2>, <P>, <STRONG>, etc.
• Use text presentation via <B>, <CENTER>, etc.
• Use meaningful links or link "title" attributes, not just "click here".
• Use meaningful alternative image attributes.
• Do not use blinking text because of photosensitive epilepsy.
• Do not use pop-ups.
• Do not use moving text.
• Use an icon in addition to red color in error situations.

Take note: This is not a full list. Please refer to W3Caccessibility guidelines 1.0for a more complete list.

Examples
Blind people access information on a Web page in a linear manner, via text-to-speech translation. The software tries to extract the text from HTML code. When the software meets a <table> tag, it is interpreted like an Excel document with columns and rows. But designers frequently use empty invisible tables for the layout purposes, so there is nothing to read in most of the cells.

Another reason not to use the <table> tag for the layout is the need some users have to visually reformat a page—for a person with low vision for example. Such a person uses software that changes the Web page layout by eliminating its CSS or applying a user defined CSS.

There are common misuses of the structure and presentation tags. Sometimes we use <H1> attributes to increase a font and <B> to make title more visible. But the text-to-speech software reads <H1> as a most important header, and <H2> as a subheader. On the other hand, <B> doesn't carry any structural meaning to the software.

People with color blindness have difficulties distinguishing between red and green, or between yellow and blue. So, when you design error situations in forms, you should use some error-looking icon or picture in addition to a red color.

And finally, people with cognitive, neurological, and learning disabilities will benefit from simple, usable, and clean Web sites.

Conclusion
We are a generation of computer geeks. As we slowly become older people, we should consider our own human frailties. So, when we decide today to deal with Web accessibility issues, we are actually preparing the Internet for ourselves in the not-so-distant future.

 

웹사이트의 접근성 향상을 위하여

Layout 구성을 CSS와 Layer를 활용하고 대신 TABLE은 엑셀 데이터와 같은 표를 만들 때만 사용한다...?

왜?

우리나라의 웹사이트 레이아웃과 같이 다소 복잡한 구성에서 이처럼 개발한다면

문제가 많지 않을까 싶다는 생각이 든다. 쩝...