Accessibility

1
Accessibility

• CIS 577
• Bruce R. Maxim
• UM-Dearborn

2
What are accessibility concerns?

• Low visual acuity
• Color blindness
• Deafness
• Language impairments
• Cultural differences

3
Why make pages more accessible?

• Reach as many readers as possible
• Automation tools and search engines work better
• Concern over customer alienation
• Business, government, and education may need to
  comply with new regulations requiring purchase of
  accessible applications.

4
Accessibility Strategies

• Adhere to accessibility guidelines
• Test for accessibility
• Provide alternate pages to accommodate users with
  varying needs

5
Certified Windows Logo - 1

• Support standard system size, color, font, and
  input settings.
• This provides a consistent user interface (UI)
  across all applications on the user's system.
• Ensure compatibility with the High Contrast
  option.
• Users desiring a high degree of legibility select
  the High Contrast option.
• When this option is selected several restrictions
  are imposed upon the application.

6
Certified Windows Logo - 2

• Provide documented keyboard access to all
  features.
• This allows the user to interact with the
  application without requiring a pointing device,
  such as a mouse.
• Provide notification of the keyboard focus
  location.
• This requirement enables use of the Magnifier and
  Narrator accessibility aids.

7
Certified Windows Logo - 3

• Convey no information by sound alone.
• Applications that convey information by sound
  must provide other options to express this
  information.

8
Accessible Design Guidelines - 1

• Flexibility.
• Provide your customers with a flexible,
  customizable user interface that accommodates a
  variety of user needs and preferences.
• Choice of input methods.
• Provide users with keyboard access to all
  features and simple mouse click access for common
  tasks.
• Choice of output methods.
• Provide users with the ability to choose discrete
  and redundant output combinations of sound,
  visuals, text, and graphics.

9
Accessible Design Guidelines - 2

• Consistency.
• Make your applications interact with other
  applications and system standards in a
  consistent, predictable manner.
• Compatibility with accessibility aids.
• Whenever possible, build your applications using
  standard and common user interface elements that
  are compatible with accessibility aids.

10
MS Accessibility Guidelines - 1

• Color
• Use color to enhance, emphasize, or reiterate
  information shown by other means rather than as
  the sole means to convey information.
• Exposing keyboard focus.
• Many accessibility aids need to identify the
  location of the keyboard focus in order to pass
  that information to users.
• Screen-magnification utilities pan to include the
  text or object being read, enlarging that portion
  of the screen.

11
MS Accessibility Guidelines - 2

• Exposing screen elements.
• Accessibility aids use Windows messages, Active
  Accessibility, and off-screen models to collect
  information about objects on the screen.
• Accessible applications must expose information
  about their screen content using Windows messages
  or Active Accessibility.
• General user interface.
• A fundamental rule of accessible design is to
  provide a user interface that is flexible enough
  to accommodate the user's needs and preferences.

12
MS Accessibility Guidelines - 3

• Keyboard input.
• Keyboard access is a fundamental part of the
  Microsoft Windows interface standards and is
  expected of all applications.
• A well-designed keyboard interface helps users
  with a wide range of disabilities and those who
  simply prefer keyboard input.
• Layout.
• To assist users who cannot see an object's
  context on the screen, assign each object a
  unique and descriptive label.

13
MS Accessibility Guidelines - 4

• Miscellaneous.
• Avoid making the user insert or swap disks,
  including disks and CD-ROMs.
• Mouse input.
• Well-designed mouse support makes applications
  easier to use for many people.
• Multitasking.
• Applications should be designed to work well with
  other applications, including accessibility aids.

14
MS Accessibility Guidelines - 5

• Size.
• The size of text and graphics affects both
  accessibility and usability.
• Allow users to size objects on the screen and
  follow system metrics for preset user
  preferences.
• Sound.
• Users with hearing impairments, users working in
  noisy environments, and users working in
  environments that require low sound volumes
  require alternatives to sound.

15
MS Accessibility Guidelines - 6

• Timings.
• All timed events should be adjustable by the
  user.
• Users with difficulty reading and reacting to
  briefly displayed information can successfully
  perform tasks related to timings.

16
Accessible Web Design

• Accessible Web design is good Web design.
• Much of the information on the Web is not
  accessible to people with disabilities because of
  poor design.
• While many Web site managers and developers take
  into consideration various browser constraints,
  for the most part Web developers do not realize
  they are developing sites that people with
  disabilities have difficulty navigating.

17
Good ALT text for all graphics

• Every image should have ALT text.
• ALT text should convey the important information
  in the image.
• Use simple text for simple images. For complex
  images, provide a link to a separate page with a
  more detailed description.
• Prevent the ALT text from forming columns put
  images on separate lines, use delimiters around
  the ALT text, or do not specify the image's
  HEIGHT and WIDTH attributes.

18
Proper use of image maps

• Provide text links in addition to any image map
  links, either in-line or at the bottom of the
  page.
• Use meaningful ALT text, such as "Map of campus
  use text links below."
• Use client-side image maps whenever the client
  supports them.
• Use TITLE attributes to name AREA fields in
  client-side image maps.

19
Useful link text

• Link text should be meaningful but brief.
• Use link text that can stand alone, as when the
  user is given a list of the links in the file.
• If this is inappropriate for the link text, use
  the TITLE attribute to provide a more descriptive
  string.

20
Good keyboard navigation

• The TAB key moves between links and image map
  areas in the order they are defined in the HTML.
• Be sure it generally moves from left to right and
  top to bottom, but does not skip back and forth
  between groups of items.
• Use the TABINDEX attribute to specify proper
  keyboard navigation order when necessary.
• Use the ACCESSKEY attribute to provide access
  keys for all controls and for links that act like
  controls.
• Underline the access key in the control's label.

21
Alternatives to all controls and applets

• Provide an alternate page that uses static text
  and graphics for displaying information and
  standard links for input.
• Use either LABEL or TITLE tags to associate a
  name with every control.
• ActiveX controls should use Active Accessibility
  to be compatible with accessibility aids.

22
Alternate pages that do not use frames

• You can use the NOFRAMES tag to show a link to a
  page that does not use frames.
• Be sure to label frames with the TITLE attribute.

23
Proper use of tables and their alternatives - 1

• Provide alternate pages that do not use tables,
  except for simple tables that do not lose
  information or change order when the table tags
  are ignored, and text does not form multiple
  columns.
• Make sure that tables make sense when read from
  left-to-right, top-to-bottom.

24
Proper use of tables and their alternatives - 2

• Use the TITLE attribute to provide appropriate
  names for rows and columns, such as "Navigation
  Bar" or "Sales for June."
• Use the TITLE attribute to provide an appropriate
  name for individual cells when a single cell
  serves a unique purpose, such as "Navigation Bar."

25
Support the reader's formatting options

• Do not rely on specific fonts, colors, or sizes.
• Use real heading tags not formatted text.
• Do not require a specific window size.
• Do not assume things will line up vertically
  because horizontal distances may change.

26
Do not require the use of style sheets

• Make sure your page is usable when style sheets
  are turned off. For example, check to see that
  strings are not duplicated and that objects
  appear in the correct order.
• If a page is not usable without style sheets,
  provide an alternate page that does not use them.

27
File formats the reader can use

• Provide closed captions for all audio content
  that contains useful information.
• If closed captions are not possible, try to
  provide transcripts for all audio content.
• Provide ASCII or HTML alternatives to any private
  formats, except when the material is only
  relevant to readers on specific platforms.
• Use text fields for embedded objects, such as the
  comment records in GIF and PNG files.

28
Avoid scrolling marquees

• Avoid using scrolling marquees wherever possible
  otherwise, provide an alternate page.
• Provide alternate pages with static text when the
  client has animation turned off.
• Never use marquees as links.

29
Provide titles for most objects

• Use the TITLE attribute to provide user-friendly
  names for the following objects
• A, APPLET, AREA
• BGSOUND, BUTTON
• CODE, COL, COLGROUP
• DIV, EMBED
• FORM, FRAME, H1-H6, IFRAME
• IMG, INPUT, LABEL, MARQUEE
• OBJECT, OPTION, SELECT
• TABLE, TD, TEXTAREA, TR

30
WebEx Exampleshttp//www.engin.umd.umich.edu/CIS
/course.des/cis577/ppt/webex.ppt
31
IBM Exampleshttp//www-03.ibm.com/able/guideline
s/web/accessweb.html
32
Testing for Accessibility - 1

• Turn off graphics
• Turn off sound
• Turn off style sheets
• Turn off features
• (i.e. Javascript, frames, plug-ins, etc.)
• Choose "high contrast" option
• Use largest font size
• Re-size browser window
• Navigate using keyboard without using mouse

33
Testing for Accessibility - 2

• Select all text and copy into clipboard, paste
  elsewhere
• Check your pages with monochrome settings
• (look for sufficient contrast among elements)
• Use a specialized browser or analysis tools
• Save pages as text only and make sure the are
  readable in linear form
• Validate and preview pages using tools

34
MS Active Accessibility

• Microsoft Active Accessibility is a developer
  technology that improves the way programs and the
  operating system work with accessibility aids.
• Using Active Accessibility, software developers
  can make their programs more compatible with
  accessibility aids, and accessibility aid
  developers can make more reliable and robust aids.

35
MS Active Accessibility

• Active Accessibility provides a standard way for
  accessibility aids to get information about user
  interface elements and for programs to expose
  that information to the aids.
• For example, Active Accessibility provides these
  individual pieces of information
• Type of object
• Name of object
• Location of object
• Current state of object

36
Active Accessibility Developers - 1

• Active Accessibility helps developers by
• Providing built-in support in the operating
  system.
• Making available a COM interface and API elements
  that help replace the unreliable and less
  portable techniques developers had to use in the
  past.
• Providing the framework for programs and
  operating systems to cooperate with accessibility
  aids.

37
Active Accessibility Developers - 2

• Providing the framework for programs and
  operating systems to cooperate with accessibility
  aids.
• Providing methods for exposing information about
  custom controls.
• Exposing information about most system-provided
  user interface elements (objects).
• Providing a mechanism for accessibility aids to
  be notified when the user interface changes.

38
Resources - 1

• Bobby Accessibility validation service
• http//webxact.watchfire.com/
• Lynx Viewer text-only browser simulator
• http//www.delorie.com/web/lynxview.html
• UsableNet Accessibility validation service
• http//www.usablenet.com/
• Vischeck Color-blindness simulator
• http//www.vischeck.com/

39
Resources - 2

• WAVE Accessibility validation service
• http//www.temple.edu/instituteondisabilities/pro
  grams/eit/wave.htm
• W3C HTML Validation Service
• http//validator.w3.org/
• W3C CSS Validation Service
• http//jigsaw.w3.org/css-validator/