Top Banner
DESIGN FOR ALL Dap01s, Mehtiö Reija
19

DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Dec 21, 2015

Download

Documents

Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

DESIGN FOR ALLDap01s, Mehtiö Reija

Page 2: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Agenda

•Introduction

•Different types of disabilities -what to consider?

Page 3: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Introduction

•Internet is a good thing

•Not only for disabled, instead for everybody

•Is t necessary for all sites?

•Compromises

Page 4: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

•Visual

•Blindness -screen reader, keyboard

•Low visions -screen magnification, higher contrast, change the default text and background color

•Color blindness

•Hearing

Different types of disabilities

Page 5: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

•Motor -voice recognition software, one-handed keyboard, mouth-stick, head-wand, single-switch access

•Cognitive

Different types of disabilities

Page 6: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

First issues to consider

•The information should be given in more than one way, supporting multiple senses

•What information is worth to show everyone?

Page 7: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Organizing the content

The header

1. navigation2. navigation3.navigation

.

.

Banner

Content

•Title to all pages appropriate

•Navigation, where to put it?

Page 8: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Organizing the content

•Important / simple / introduction first

•No sounds starting automatically

Page 9: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Practical issues

Page 10: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Text

•Spell check!

•Proof read

•Cut it to smaller/understandable parts

Page 11: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Links

•No click here, content independent

•Too many links makes it hard to understand the text

•Let the user know if the link takes to some other type of document than html

Page 12: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Images / Graphics

•Support the text

•alt -definition,

•alt=”|” , alt=”.” , alt=”*”

•Phone testing

•Longdesc / invisible link / [D] -link

•Image text, where to put it?

Page 13: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Tables•Big tables, impossible to remember

•Table with 10 columns and 7 rows. Department Code, Class Number, Section, Max Enrollment, Current Enrollment, Room Number, Days, Start Time, End Time, Instructor, BIO, 100, 1, 15, 13, 5, Mon,Wed,Fri, 10:00, 11:00, Magde, 100, 2, 15, 7, 5, Tue,Thu, 11:00, 12:30, Indge, 205, 1, 15, 9, 6, Tue,Thu, 09:00, 10:30, Magde, 315, 1, 12, 3, 6, Mon,Wed,Fri, 13:00, 14:00, Indge, BUS, 150, 1, 15, 15, 13, Mon,Wed,Fri, 09:00, 10:00, Roberts, 210, 1, 10, 9, 13, Mon,Wed,Fri, 08:00, 09:00, Rasid.

Page 14: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Tables•Explanation / summary -attribute /

invisible link

•use of <th> , scope =”row/col” -attribute or id-attribute, headers -attribute, abbr -attribute and <caption>

Name Age Birthday

Jack 15 22.10.

Maria 19 7.3

Page 15: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

<tbody><tr> <th scope="col">Name</th> <th scope="col">Age</th> <th scope="col">Birthday</th> </tr><tr> <th scope="row">Jackie</th> <td>5</td> <td>April 5</td></tr><tr> <th scope="row">Beth</th> <td>8</td> <td>January 14</td></tr></tbody></table>

in html:

Page 16: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Forms•An alternative option should be

offered

•Clear instruction what information is desired before the field

•If checkboxes or radio buttons used don’t brake them up with any block element

•accesskey -attribute

Page 17: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Standards

Page 18: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

The Web Accessibility Guidelines

•Web Content Accessibility Guidelines

•Authoring Tool Accessibility Guidelines

•User Agent Accessibility Guidelines

Page 19: DESIGN FOR ALL Dap01s, Mehtiö Reija. Agenda Introduction Different types of disabilities - what to consider?

Section 508 Web Accessibility

•Actually a law that concerns the Federal Goverment