Accessibility, Usability and Web Standards
description
Transcript of Accessibility, Usability and Web Standards
Accessibility, Usability and Web Standards
David RobinsNORASIST Annual Meeting
September 17, 2007
9/17/2007 NORASIST Annual Meeting 2007 2
Purpose Explore the relationship, if any, between
accessibility issues and usability issues Discuss strategies for achieving both
9/17/2007 NORASIST Annual Meeting 2007 3
Agenda Accessibility Issues: Standards and
Laws Usability Issues and Guidelines Design for both: Web Standards Converting to Web Standards
9/17/2007 NORASIST Annual Meeting 2007 4
Accessibility Case: Target.com Target.com Suit by a blind student at UC Berkeley Suit alleges that site denies equal
access to goods and services, e.g.: Lacks “alt” text for images Uses image maps for navigation
Brought forth through ADA interpretation
9/17/2007 NORASIST Annual Meeting 2007 5
A Quick Study… Sites using Web Standards
Quirks Mode
Stds Mode
XHTML 1.0 S
XHTML 1.0 T
HTML 1.0 S
HTML 1.0 T
E-Comm 10 10 2 2 1 5
Acad Lib 6 14 2 8 1 3
Public Lib 9 11 0 8 0 1
Total 25 35 4 18 2 9
% 42% 58% 7% 30% 3% 15%
9/17/2007 NORASIST Annual Meeting 2007 6
Accessibility Issues Guidelines and Law
508 Section 508 of the American Rehabilitation Act
WAI Web Accessibility Initiative of the World Wide
Web Constortium (W3C)
9/17/2007 NORASIST Annual Meeting 2007 7
The Text-Only Question Users may be luke warm to text-only sites Many text-only sites are not fully accessible
Cannot tab among links Link text may be confusing Many text-only forms are not accessible
May marginalize disabled users Loss of branding
9/17/2007 NORASIST Annual Meeting 2007 8
Accessibility: Section 508
Technical Standards Software applications and operating systems Web-based intranet and internet information and
applications Telecommunication products Video and multimedia products Self contained, closed products Desktop and portable computers
Functional Performance Criteria Information, Documentation, and Support
9/17/2007 NORASIST Annual Meeting 2007 9
Accessibility: Section 508
Alternatives must be available to those with disabilities
Tables for data only Graphically based information (images,
flash, color, etc.) must have alternative rendering
Document must be readable without style sheets
9/17/2007 NORASIST Annual Meeting 2007 10
Accessibility: Section 508
Client-side image maps are preferable to server-side image maps
Try to find balance between redundancy and moderation (navigation, etc.)
Scripting or forms should not interfere with assistive technology
When all else fails, create a parallel text site
9/17/2007 NORASIST Annual Meeting 2007 11
508: Functional Performance
At least one alternative to visual interaction People with sight impairments. People with visual acuity of worse than 20/70, or the device
should have the ability to incorporate assistive technology At least one alternative to auditory interaction
(“operation and information retrieval”) should be provided, or the device should allow for the inclusion of assistive technology appropriate to the hearing impaired.
9/17/2007 NORASIST Annual Meeting 2007 12
508: Functional Performance
Auditory enhancement for critical auditory content (or allow for assistive technology that will allow a user to hear the information).
At least one alternative to systems requiring human speech should be provided for people with speech impairments.
At least one alternative must be provided to systems that require fine motor control (e.g. mice or tablets) to operate.
9/17/2007 NORASIST Annual Meeting 2007 13
Exceptions to 508
Equipment purchased or systems designed before 1998
Equipment and systems designed for intelligence or other operations critical to national security need not be altered for accessibility.
Organizations receiving federal money when the purchase is “incidental to a contract.”
9/17/2007 NORASIST Annual Meeting 2007 14
Help with 508 Compliance
W3C – Web Accessibility Initiative (WAI) http://www.w3.org/WAI/
Section 508 Site (US Government) http://www.section508.gov/
Validation: Use Firefox Web Developer Toolbar
9/17/2007 NORASIST Annual Meeting 2007 15
WAI ATAG (Authoring Tool Accessibility
Guidelines) UAAG (User Accessibility Agent
Guidelines) WCAG (Web Content Accessibility
Guidelines)
9/17/2007 NORASIST Annual Meeting 2007 16
WCAG: Priority 1 General guidelines such as clarity of writing,
descriptive text for non-text content, use of color as content, and dynamic content
Use of images and image maps (use redundant text links for server-side maps)
Use of appropriate table markup Use of frame identification Ensure that applets, scripts and multimedia produce
usable content Use of alternative pages that are accessible if the
primary page content is not
9/17/2007 NORASIST Annual Meeting 2007 17
WCAG: Priority 2
Appropriate text/background contrast Limiting use of images where text is sufficient Use of style sheets rather than mark up for content
presentation Division of large text blocks into smaller where possible Use of consistent navigation tools Recommends against the use of tables as layout and
visual formatting tools Proper positioning and association of labels and
controls in forms More specific guidelines on the use of scripts and
applets
9/17/2007 NORASIST Annual Meeting 2007 18
WCAG Priority 3 Specifying acronyms when first used Identifying the document’s primary natural language Use of keyboard shortcuts to links Use of navigation bars Placing defining content in headings and the tops of
paragraphs Use of consistent style throughout pages Use of redundant text links for client-side image maps Provide summaries for tables and abbreviations for header
rows Use of default text in form controls
9/17/2007 NORASIST Annual Meeting 2007 19
Usability Overview Part of large process of system
development Involves the analysis of users using
systems Determines the effectiveness of
interfaces Usually involves the analysis of tasks Not limited to computers
9/17/2007 NORASIST Annual Meeting 2007 20
Usability Overview AKA
Human-Computer Interaction (HCI) Computer-Human Interaction (CHI) Human Factors Interface Design
Related to User Experience Interaction Design
9/17/2007 NORASIST Annual Meeting 2007 21
Usability Overview Two main interests
Ease of learning Ease of use
9/17/2007 NORASIST Annual Meeting 2007 22
Web Standards Separation of content and presentation Content is structured according to
syntactic and semantic elements Presentation is accomplished through
external style sheets Use of tables for layout is discouraged Use of formatting elements is
discouraged
9/17/2007 NORASIST Annual Meeting 2007 23
Why should we separate content and presentation?
Issues Accessibility Section 508 Assistive technology File sizes Download speeds Simplicity “Future-proofing”
9/17/2007 NORASIST Annual Meeting 2007 24
Web Standards: Design Layers
Content/Structure Presentation/Style Behavior/Programming
9/17/2007 NORASIST Annual Meeting 2007 25
Accessibility and Usability in Web Standards Content Layer
Primarily an accessibility layer Presentation Layer
Primarily a usability layer Behavior Layer
Both accessibility and usability are issues here
9/17/2007 NORASIST Annual Meeting 2007 26
Migrating to Web Standards There is no one model for doing so No magic bullet It will be expensive and labor intensive Different considerations for different
situations Different considerations for different
systems
9/17/2007 NORASIST Annual Meeting 2007 27
Steps in Web Standards Design Content/Structure Layer
Assess your audience and content Determine the types of content needed How can this content be broken down? What elements are necessary to present the content to your
audience? Structure your content
Group content into logical categories Determine logical names for your content categories
Markup your content (decide logical flow) Apply XHTML markup using categories in divisions This markup should written in such a way that it does not
have to be altered in the future Markup one time—style many times
9/17/2007 NORASIST Annual Meeting 2007 28
Steps in Web Standards Design Design/Style Layer (Template Development)
Wireframe your design (information design) For any presentation of your site, decide on a design Create a wireframe that shows where each element will be
positioned Make notes of color, typography, alignment,
Gather necessary graphics Construct Style Sheets
Based on your wireframe, write necessary rules for each element
Establish selectors and rules Determine the extent to which your styles are inline, embedded,
externally linked, or imported This is where boxes are sized and positioned
Test in various browsers
9/17/2007 NORASIST Annual Meeting 2007 29
Steps in Web Standards Design Behavior Layer
Script development Database design and implementation Content Management Systems
9/17/2007 NORASIST Annual Meeting 2007 30
Migration Issues Culture Management Technical Resources
Questions?