Accessibility 101

A presentation at Accessibility Club Summit in November 2019 in Berlin, Germany by Núria Peña

Slide 1

Slide 1

Accessibility 101 Radimir Bitsov & Núria Peña

Slide 2

Slide 2

Basics of Accessibility

Slide 3

Slide 3

Web Accessibility

Slide 4

Slide 4

ED IN A PL EX Web accessibility is the level at which digital solutions are effective to as many people as possible, regardless of their physical or functional capacity.

Slide 5

Slide 5

Inclusive Design

Slide 6

Slide 6

ED IN A PL EX Concepts or ways of thinking about design, products, services, and environments that enables and draws on the full range of human diversity.

Slide 7

Slide 7

Semantic Markup

Slide 8

Slide 8

ED IN A PL EX Semantically correct markup refers to the practice of using correct HTML elements for their intended purpose.

Slide 9

Slide 9

Colour Contrast

Slide 10

Slide 10

ED IN A PL EX Colour contrast stands for the difference in perceived brightness between two colours. It’s expressed as a ratio ranging from 1:1 (white text on a white background) to 21:1 (black text on a white background).

Slide 11

Slide 11

Alternative Image Text

Slide 12

Slide 12

ED IN A PL EX Alternative image text provides a textual alternative to image content in web pages via an attribute “alt” on the <img> element.

Slide 13

Slide 13

ARIA

Slide 14

Slide 14

ED IN A PL EX Accessible Rich Internet Applications (ARIA) specifications and their implementation enable us to control the way native or custom elements are translated into the accessibility tree by using standardised attributes.

Slide 15

Slide 15

Accessibility Tree

Slide 16

Slide 16

ED IN A PL EX Accessibility tree is the modified version of the Document Object Model tree (page structure) that most assistive technologies interact with.

Slide 17

Slide 17

WCAG

Slide 18

Slide 18

ED IN A PL EX Web content accessibility guidelines (WCAG) is a standard for web accessibility that meets the needs of individuals, organisations, and governments internationally.

Slide 19

Slide 19

Types of Disabilities

Slide 20

Slide 20

Permanent Temporal Situational

Slide 21

Slide 21

Physical or motor Visual Cognitive & Learning Psycho & neurological Hearing

Slide 22

Slide 22

Physical or motor disabilities

Slide 23

Slide 23

Multiple Sclerosis, Spinal Cord Injury, Empathy Lab Arthritis, Parkinson’s, Essential tremor ED Cerebral Palsy, Muscular dystrophy IN A PL EX A physical disability is a limitation on a person’s physical functioning, mobility, dexterity or stamina

Slide 24

Slide 24

Visual disabilities

Slide 25

Slide 25

Empathy Lab Visual acuity, Low vision, Blurred Vision Colour Blindness Glaucoma, Cataracts, Astigmatism Blindness ED All them IN A PL EX or also known as vision impairment, is a decreased ability to see.

Slide 26

Slide 26

Hearing disabilities

Slide 27

Slide 27

Hard of Hearing (HoH), Hearing Loss Auditory Processing Disorder (APD) Deafness ED Empathy Lab IN A PL EX or hearing impairment, occurs when you lose part or all of your ability to hear.

Slide 28

Slide 28

Cognitive & Learning disabilities

Slide 29

Slide 29

Dyslexia, Dyscalculia, Dysgraphia Asperger’s, ADHD, Autism, Alzheimer’s Down’s Syndrome ED Empathy Lab IN A PL EX Learning difficulties, distractibility, the inability to focus on large amounts of information.

Slide 30

Slide 30

Psycho & neurological disorders

Slide 31

Slide 31

Schizophrenia, Epilepsy, Dementia Anxiety ED Vestibular disorders: Vertigo, Motion sickness, Photosensitivity IN A PL EX Anything that affects the mental health, feelings and mood of a person.

Slide 32

Slide 32

Assistive Technology (AT)

Slide 33

Slide 33

Screen Readers

Slide 34

Slide 34

NonVisual Desktop Access (NVDA) Empathy Lab VoiceOver ED Job Access With Speech (JAWS) IN A PL EX A screen reader is a software application that translates onscreen information into speech or Braille.

Slide 35

Slide 35

Adaptive Switches

Slide 36

Slide 36

Empathy Lab Apple devices built-in: Switch Control Android devices built-in: Switch Access ED Button switches, mouth sticks, cheek clickers, Sip-and-puff. IN A PL EX A tool primarily used by people with motor impairments to access and control digital equipment.

Slide 37

Slide 37

Slide 38

Slide 38

Voice Recognition

Slide 39

Slide 39

Built-in dictation technology: laptops, smartphones and tablets. Apps: Dragon Dictation (iOS) Empathy Lab Chrome Tools: WordQ and Read&Write ED Also known as “speech-to-text” or “speech recognition” IN A PL EX is a dictation tool that transforms voice into written text.

Slide 40

Slide 40

Screen magnifier

Slide 41

Slide 41

OS X built-in Empathy Lab Software: ZoomMe (OS) ED Windows built-in Magnifier IN A PL EX is software that interfaces with a computer’s graphical output to present enlarged screen content.

Slide 42

Slide 42

Slide 43

Slide 43

Thank you!