22
Fundamentals of Graphic Communication 3.5 Accessible Design

Fundamentals of Graphic Communication

  • Upload
    inoke

  • View
    33

  • Download
    0

Embed Size (px)

DESCRIPTION

Fundamentals of Graphic Communication. 3.5 Accessible Design. Overview. What is accessibility? Why is it important? Design guidelines Types of disabilities Accessibility testing. What is accessibility?. - PowerPoint PPT Presentation

Citation preview

Page 1: Fundamentals of Graphic Communication

Fundamentals of Graphic Communication

3.5 Accessible Design

Page 2: Fundamentals of Graphic Communication

Overview

• What is accessibility?• Why is it important?• Design guidelines• Types of disabilities• Accessibility testing

Page 3: Fundamentals of Graphic Communication

What is accessibility?

• Accessibility is the degree to which technology is usable by people with disabilities

• Universal access is the philosophy of designing technology and information to be usable by all people without specialized adaptations

Page 4: Fundamentals of Graphic Communication

Accessible technology

• Assistive hardware– Allow disabled users to interact with the computer– Examples

• Specialized keyboards• Head trackers• Braille terminals

Matias Corporation

Page 5: Fundamentals of Graphic Communication

Accessible technology

• Accessibility software– Designed to provide an accessible interface between

other software and the user– Examples

• Voice recognition• Speech synthesis• Screen readers• Mouse / keyboard helpers

• We want software to be accessible; that is, to work transparently with accessible technology without sacrificing quality

Page 6: Fundamentals of Graphic Communication

Why’s it important?

• There are millions of disabled people in the US– Non-accessible products limit your audience

• It’s the law– Section 508 requires government-funded websites to

meet accessibility guidelines

• It’s a nice thing to do– Share your creations with the world

• Accessible design often results in good design– Easy-to-use products benefit everyone

Page 7: Fundamentals of Graphic Communication

Good Grips

• Accessible design requires making products easier to use for everyone– Who doesn’t like that?

Good Grips

Page 8: Fundamentals of Graphic Communication

Fred and Ginger

• Accessible technology often requires creative technical solutions– Mainstream products may benefit from these solutions

DEKA

Page 9: Fundamentals of Graphic Communication

Design principles(Web Content Accessibility Guidelines 2.0)

1. PerceivableEnsure that all content can be presented in form(s) that can be perceived by any user - except those aspects of the content that cannot be expressed in words.

2. Operable Ensure that the interface elements in the content are operable by any user.

3. Orientation/NavigationFacilitate content orientation and navigation

4. ComprehendibleMake it as easy as possible to understand the content and controls.

5. Technology Robust Use Web technologies that maximize the ability of the content to work with current and future accessibility technologies and user agents.

Page 10: Fundamentals of Graphic Communication

More principles

• Present information in a clear and straightforward manner– Limit large amounts of text– Structure documents clearly

• Express ideas in multiple media when possible– ALT text for HTML images– Transcripts for audio/video content

• You don’t need to sacrifice visual style for accessibility

Page 11: Fundamentals of Graphic Communication

Types of disabilities

• Visual– Blindness– Low vision– Color blindness

• Hearing• Motor skills• Cognitive disability

– Reading disorders– Attention disorders– Memory impairments

Page 12: Fundamentals of Graphic Communication

Blindness

• User cannot see visual content– Pictures, diagrams, animations, etc.

• May use a screen reader to get information– Cannot scan a page quickly– Must navigate linearly through text

• Solutions– Provide structure to text for easy navigation– Add text or audio descriptions to images/video– Follow standards for maximum compatibility with screen

readers

Page 13: Fundamentals of Graphic Communication

Low vision

• Many types– Poor vision quality– Partially occluded vision

• Very common in seniors

• Low-contrast text difficult to read

• Solutions– Allow font resizing– Allow color schemes to be changed– Add text or audio descriptions to images/video

Page 14: Fundamentals of Graphic Communication

Low vision

• Many types– Poor vision quality– Partially occluded vision

• Very common in seniors

• Low-contrast text difficult to read

• Solutions– Allow font resizing– Allow color schemes to be changed– Add text or audio descriptions to images/video

Page 15: Fundamentals of Graphic Communication

Color blindness

• Inability to distinguish between certain colors– Affects 10% of males– Often have problems with red and green

• Solutions– Allow color schemes to be changed– Don’t differentiate on hue alone

• Saturation• Value• Shape

Page 16: Fundamentals of Graphic Communication

Color blindness

visibone.com

What you see What color-blind users see

Page 17: Fundamentals of Graphic Communication

Is this accessible?

Big Fish Games

Page 18: Fundamentals of Graphic Communication

Better

PopCap Games

Page 19: Fundamentals of Graphic Communication

Hearing impairment

• User cannot hear audio content

• This one is easy to test for– Turn off your speakers!

• Solution– Provide captioning for all audio content

Page 20: Fundamentals of Graphic Communication

Impaired motor skills

• Difficulty using mouse and keyboard– Inaccuracy while clicking– Slow input– May use specialized input device

• Solution– Do not require precise clicking– Allow alternate input methods

• Keyboard• Mouse• Voice

Page 21: Fundamentals of Graphic Communication

Color blindness tools

• Will send these out later

Page 22: Fundamentals of Graphic Communication

Resources

• Dive Into Accessibility– http://diveintoaccessibility.org/

• Web Content Accessibility Guidelines 2.0– http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-20020424.html

• How People with Disabilities Use the Web– http://www.w3.org/WAI/EO/Drafts/PWD-Use-Web/

• UMass Disability Services– http://www.umass.edu/disability/

• Assistive Technologies Center– http://www-pcco.oit.umass.edu/assistive/assistive.html