web accessibility talyah aviran head of ui team. 2 what is accessibility? what is accessibility to...

Web Accessibility

Talyah Aviran

Head of UI team

2

What is Accessibility? What is accessibility to the Web and why is it

important? Impact of the Web on People with Disabilities. Web Accessibility is a Cross-Disability Issue. How many people need Web Accessibility? Why does the Web need to be accessible? What is an accessible site? What is being done in the world? What is WCAG 2.0? Accessibility Guidelines. Screen readers and the Web – Video.

What are we going to talk about today?

3

What is Accessibility?

How many of you know people with hearing or vision impairments, Physical impairments, leaning disabilities, dyslexia, ADHD

Have you ever experienced inaccessibility?

AccessibleNot Accessible

4

What is Web Accessibility?

Before we start…

Try to use only your elbow to dial the following number:

052-4380822

5

Why is Web Accessibility an Issue?

Web accessibility is important for the following reasons:

Use of the Web has spread into all areas of society; There are barriers on the Web for many types of

disabilities; Millions of people have disabilities that affect access

to the Web; Some Web sites are required to be accessible; Web accessibility also has carry-over benefits for

other users.

6

Impact of the Web on People with Disabilities

The Web has become a key resource for:

News, information, commerce, entertainment,classroom education, distance learning,job searching, workplace interaction,government services and more.

It is displacing traditional sources of information and interaction -- schools, libraries, print materials;

An accessible Web means unprecedented access to information for people with disabilities.

7

Web Accessibility is a Cross-Disability Issue

Examples of design requirements for people with different kinds of disabilities include: Visual:

described graphics or video; tables or frames; keyboard support, screen reader compatibility;

Hearing: captioning for audio, illustration;

Physical, Speech: keyboard or single-switch support; alternatives for speech input on voice portals;

Cognitive, Neurological: consistent navigation, appropriate language level;

illustration; no flickering.

8

How many people need Web Accessibility

MICROSOFT - Majority of Working-Age Adults (62%)Likely to

Benefit from the Use of Accessible Technology

9

So, Why does the Web need to be accessible?

Legal aspect - Section 508 of the Rehabilitation Act in the US, The Equal Rights for People with Disabilities Law,

Israel; Moral aspect; Social aspect - reducing the digital gap; Economical aspect – increases potential users; Standardization – W3C and Government standards; Usability – accessibility increases usability; Organizational Perception Search – Better results in SEO (Search Engine

Optimization). Google is blind.

10

What is an accessible site?

An accessible site is a site where as many people as possible find it:

Perceivable - Information and user interface components must be presentable to users in ways they can perceive

Operable - User interface components and navigation must be operable

Understandable - Information and the operation of user interface must be understandable

Robust - Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies

11

Examples of accessible sites

12

Examples of accessible sites

13

What do I need to develop an accessible web site?

To develop an accessible web site one needs to have:1. a basic understanding of how people with

disabilities use the Web;2. a basic understanding of assistive

technologies and the adaptive strategies that people use

14

What is being done in the world

W3C - World Wide Web Consortium defines the standards for the Web, such as HTML and

CSS. WAI - Web Accessibility Initiative - a group within

W3C a technology consortium that focuses on accessibility

Groups in WAI: Guidelines groups - Web Content Accessibility Guidelines

Group; Protocols and Formats Working Group; Evaluation and Repair Tools Working Group; Education and Outreach; Research and Development Interest Group.

15

What is WCAG ? WCAG 2.0?

The Web Content Accessibility Guidelines (WCAG) - explain how to make Web content accessible to people with disabilities

Web "content“ - information in a Web page or Web application, including text, images, forms, sounds, and such.

WCAG is part of a series of accessibility guidelines, including:• the Authoring Tool Accessibility Guidelines (ATAG);

and• the User Agent Accessibility Guidelines (UAAG).

16

What is WCAG ? WCAG 2.0?

Essential Components of Web Accessibility explains the relationship between the different guidelines.

Web Content Accessibility Guidelines 1.0 was published in May 1999. WCAG 2.0 was published on 11 December 2008.

WCAG 2.0:• applies broadly to more advanced technologies; • is easier to use and understand; • is more precisely testable with automated testing and

human evaluation;• works for technologies today; intended to work for

W3C technologies, for non-W3C technologies, and for technologies in the future.

17

Assistive Technology

People with disabilities use assistive technology – a software or hardware to by-pass the disability:

Mouse, keyboards, magnifiers… Screen readers such as JAWS

Braille Monitor Braille printer Reading Machine Desktop&Pocket Magnifier

18

WCAG 2.0 Accessibility Guidelines

Four main principles:1.Perceivable

2.Operable

3.Understandable

4.Robust Under each principle there are

guide lines. Under each guide line there are

success criteria classified tothree levels of conformance:A (lowest), AA, and AAA (highest)

1.Principle1.1 Guide line1.1.1Success Criteria1.1.2 Success Criteria1.2 Guide line1.2.1 Success Criteria1.2.2 Success Criteria2.Principle2.1 Guide line2.1.1Success Criteria2.1.2 Success Criteria1.2 Guide line2.2.1 Success Criteria2.2.2 Success Criteria

19

WCAG 2.0 Accessibility Guidelines

1 Perceivable

Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.

1.1

Provide alternatives for time-based media. 1.2

Create content that can be presented in different ways (for example simpler layout) without losing information or structure.

1.3

Make it easier for users to see and hear content including separating foreground from background.

1.4

20

WCAG 2.0 – Principle 1 Perceivable

1.1 Alternative Text

21

WCAG 2.0 – Principle 1 Perceivable

1.1 An Alternative for Captcha

22

WCAG 2.0 – Principle 1 Perceivable

1.2 Alternatives for time-based media

Captions and audio descriptions:

Example

23

WCAG 2.0 – Principle 1 Perceivable

1.3 Content can be presented in different ways without losing information or structure.

Instructions for operating content should not rely on sensory characteristics such as shape, size, visual location, orientation, or sound:

24

WCAG 2.0 – Principle 1 Perceivable

1.3 Content can be presented in different ways without losing information or structure.

Tables, Headings (Hierarchy of)

Example for a data table Example for headings

25

WCAG 2.0 – Principle 1 Perceivable

26

WCAG 2.0 – Principle 1 Perceivable

1.4 Make it easier to see and hear content

Color is not used as the only visual means of conveying information.

Allow the user to turn off music or to enlarge text

27

2 Operable

WCAG 2.0 Accessibility Guidelines

Make all functionality available from a keyboard. 2.1

Provide users enough time to read and use content. 2.2

Do not design content in a way that is known to cause seizures.

2.3

Provide ways to help users navigate, find content, and determine where they are.

2.4

28

2.1 Make all functionality available from a keyboard: Navigation using tab order; On Click = On Press

2.2 Provide enough time to read and use content: Example

2.4 Help users navigate, find content, and determine where they are.

Example

WCAG 2.0 – Principle 2 Operable

29

3 Understandable

WCAG 2.0 Accessibility Guidelines

Make text content readable and understandable:Providing a glossary, Human language, link to definitions, simplicity, Providing sound files of the pronunciation…

3.1

Make Web pages appear and operate in predictable ways:do not open a new window automatically, notify the user, consistent navigation.

3.2

Help users avoid and correct mistakes:Identifying errors in a form submission, Providing multiple cues

3.3

30

4 Robust

WCAG 2.0 Accessibility Guidelines

Maximize compatibility with current and future user agents, including assistive technologies:Correct HTML tagging, standard markup, follow the W3C standards.

4.1

31

Alternatives.

Visual and auditory equivalents.

User control over time, presentation and audio.

Separation of content from presentation.

Consistency and predictable behavior.

Prevention of errors and user assistance.

Standards.

WCAG 2.0 – Summary

32

A Video

Screen readers and the Web