Web Accessibility

1
Web Accessibility

• CGVC 247 A 5/1/06

2
Goals

• Understanding the Problem
• Understanding the Law
• Designing More Accessible Web Sites
• Links for More Information
• Discussion/Questions?

3
What is accessibility?

• Equal access to web-based information and
  services regardless of physical or developmental
  abilities or impairments
• The web can be accessed many different ways
• browser (e.g. 17in monitor, PDA screen, cell
  phone)
• assistive technology (e.g. screen reader, screen
  magnifier, refreshable Braille display)
• How does your web site/app handle under these
  situations?

4
How do disabled people access the Internet?

• Partial sight users can use a screen magnifier or
  can enlarge text through browser
• Is your web site font size able to be enlarged?
• Blind users can use a screen reader
• reads the content of the web page aloud
• E.g. JAWS for Windows screen reader software

PACmate Portable Braille Display used with PCs
for dynamic output of screen information in
refreshable braille, to read the pages by touch
5
How do disabled people access the Internet?

• IBM's screen reader can be downloaded for a free
  30-day trial at http//www-3.ibm.com/able/solution
  _offerings/hpr.html.
• Once you have downloaded it, go to your website,
  turn your monitor off, and try to navigate your
  website.
• Deaf users access much the same as you and I,
  except cant use audio-only features.
• If providing video or sound files, also provide a
  transcript or closed captioning.
• Keyboard only users try using only a keyboard to
  navigate a website forms are tabs in correct
  order?

6
An Example Color Blindness

• Its estimated that one in 12 men and one in 200
  women have some form of color blindness
• Three main types of color blindness
• Deuteranope (a form of red/green color deficit)
• Protanope (another form of red/green color
  deficit)
• Tritanope (a blue/yellow deficit- very rare)

Statistics from http//www.iee.org/Policy/Areas/He
alth/cvdintro.cfm/
7
An Example Color Blindness

• Shouldnt rely solely on color to convey a
  message
• Certain background and text color combinations
  (not enough contrast) can make it difficult or
  even impossible for some to read your page
• Test your website on VisCheck, http//www.vischeck
  .com/vischeck/vischeckURL.php

8
Competitive Advantage

• When evaluating software products, those with
  proven accessibility have another selling point!
• Contract negotiation can work in accessibility
  into procurement language
• More info http//web.mit.edu/atic/www/accessibili
  ty/policies.html
• Many other countries have laws about
  accessibility must adhere if plan to sell
  product overseas.

9
Understanding the Law
10
Introduction

• The ADA and Section 504 require colleges and
  universities to make their services, including
  Web services, accessible to individuals with
  disabilities.

11
Americans with Disabilities Act of 1990

• Prohibits private employers, state and local
  governments, from discriminating against
  qualified individuals with disabilities in job
  application procedures, hiring, firing,
  advancement, compensation, job training, and
  other terms, conditions and privileges of
  employment.
• It requires that communications with persons with
  disabilities are as effective as communications
  with others
• ADA covers students, employees, and community
  members
• ADA doesnt use the word Internet in its
  statutory language (1990 Internet hardly even
  born yet)
• Federal court cases contradictory

12
Section 504 of the Rehabilitation Act

• Nondiscrimination Under Federal Grants and
  Programs
• no otherwise qualified individual with a
  disability in the United States shall, solely by
  reason of his disability, be excluded from the
  participation in, be denied benefits of, or be
  subjected to discrimination under any program or
  activity receiving federal financial assistance
  (29 U.S.C. Section 794)

13
Section 508

• Section 508 of the Rehabilitation Act of 1997
  provides the legislative language for accessible
  electronic information technology. (took effect
  June 21, 2001)
• By law only applies to federal agencies but has
  come to serve as the baseline/guideline for being
  508 compliant
• Doesnt cover all disabilities
• You can be 100 508 compliant but still have
  some users still having problems

14
Section 508 Checklist - examples

• Text equivalent for every non-text element
  (image, video, audio file)
• Multimedia presentations should have equivalent
  alternatives (captions, transcript)
• All information should be able to be conveyed
  without color
• Should be able to read the page with the style
  sheet turned off
• Image maps provide redundant text links
• Row and column headers shall be labeled, ltthgt

See full checklist at http//www.webaim.org/standa
rds/508/checklist
15
Designing More Accessible Web Sites
16
Benefits of Web Accessibility

• Using up to date web standards, websites will be
  easier to manage
• using CSS and HTML/XHTML to separate content and
  presentation will save development time and money
• Compatibility and flexibility with new browsing
  technologies
• Higher search engine rankings
• Page load times improve / bandwidth savings
• General usability of the site will be greatly
  improved for ALL users
• Provides level playing field for people with
  disabilities

17
Benefits of Cascading Style Sheets (CSS)

• HTML does what it was meant to do provide
  structural context
• Can easily change site wide visual display
• Can use different CSS files for different display
  media (e.g. screen, printing, PDA)
• Separates content from presentation, which is the
  first step in accessibility
• Properly structured content aids screen readers
• Tableless designs aid keyboard tabbing
• Page size is reduced, faster page download times,
  better user experience
• Site is easier to maintain, shorter development
  time
• Well authored CSS makes pages more accessible!

18
What is XHTML?

• XHTML is just a stricter version of HTML 4.01
• XHTML 1.0 is a reformulation of HTML 4.01 in XML,
  and combines the strength of HTML 4 with the
  power of XML
• First major change since HTML 4.0 was released in
  1997

19
Some of whats new in XHTML

• Must include Document Type Definition, or DTD
• Strict - disallows use of all deprecated tags and
  attributes such as the ltfontgt tag.
• Transitional - is far more forgiving and supports
  all those deprecated yet browser supported tags
  you most likely use every day.
• Frameset - is exactly the same as the
  transitional DTD but replaces the document body
  with frame attributes.
• E.g. lt!DOCTYPE html PUBLIC        
   "-//W3C//DTD XHTML 1.0 Transitional//EN"      
     "http//www.w3.org/TR/xhtml1/DTD/xhtml1-transit
  ional.dtd"gt
• What does it do?
• It tells the browser how to render the page in
  standards compliant mode (which set of rules to
  go against)

20
Some of whats new in XHTML

• Nested elements must be in correct order
• ltstronggtltpgtJohns Hopkins Universitylt/stronggtlt/pgt
  ? WRONG
• ltpgtltstronggtJohns Hopkins Universitylt/stronggtlt/pgt
  ? RIGHT
• Element and attribute names must be lowercase
• Non empty element end tags required
• All attribute names must be quoted
• ltinput typehidden valuefirstnamegt ? WRONG
• ltinput typehidden valuefirstname /gt ?
  RIGHT
• Empty tags must be terminated
• E.g. ltbrgt should now be ltbr/gt
• The id attribute replaces the name attribute
• ltimg src"picture.gif" name"picture1" /gt ?
  WRONG
• ltimg src"picture.gif" id"picture1" /gt ? RIGHT

21
Microsoft Active Accessibility

• Microsoft Active Accessibility 2.0 is a COM-based
  technology that improves the way accessibility
  aids work with applications running on Microsoft
  Windows.
• Provides dynamic-link libraries that are
  incorporated into the operating system as well as
  a COM interface for exposing information about
  user interface elements.
• Active Accessibility is designed primarily for C,
  C, and Microsoft Visual Basic developers.
• More info is available on MSDNs site.

22
Links for More Information - Accessibility

• Sitepoint good article, tutorials on
  Accessibility, CSS and XHTML
• http//www.sitepoint.com/subcat/accessibility
• Section 508 Guidelines
• http//www.section508.gov/
• Web Accessibility Initiative (WAI)
• http//www.w3.org/WAI/
• Web Accessibilty Evaluation Tools / Validators
• http//www.w3.org/WAI/ER/existingtools.htmlEvalua
  tion
• WebAIM
• http//www.webaim.org/

23
Links for More Information Development Specific

• HTML 4.01 Specification
• http//www.w3.org/TR/html4/
• XHTML 1.0 Specification
• http//www.w3.org/TR/xhtml1/
• CSS 2.1 Specification
• http//www.w3.org/TR/CSS21/