Slide 1

Slide 1 text

deanbirkett Accessible Design

Slide 2

Slide 2 text

165 cm - 178 cm 5’4” - 5’10” Sample average height of 23 European countries source: Wikipedia - http://en.wikipedia.org/wiki/Human_height

Slide 3

Slide 3 text

Counter accessibility - http://www.ehow.com/about_6743476_standard-kitchen-countertop-height.html source: Wikipedia - http://en.wikipedia.org/wiki/Door (UK size) 91.4 cm 198 cm 6’6” 165 cm - 178 cm 5’4” - 5’10”

Slide 4

Slide 4 text

Sample of 23 countries across Europe extremes extremes

Slide 5

Slide 5 text

Counter accessibility - http://www.ehow.com/about_6743476_standard-kitchen-countertop-height.html Step stool- http://s.shld.net/is/image/Sears/spin_prod_724972901

Slide 6

Slide 6 text

Counter accessibility - http://www.ehow.com/about_6743476_standard-kitchen-countertop-height.html Step stool- http://s.shld.net/is/image/Sears/spin_prod_724972901

Slide 7

Slide 7 text

Counter accessibility - http://www.ehow.com/about_6743476_standard-kitchen-countertop-height.html Step stool- http://s.shld.net/is/image/Sears/spin_prod_724972901

Slide 8

Slide 8 text

Real World Solutions to Real World Problems source: Wikipedia Commons - http://commons.wikimedia.org/wiki/File:Earth_Western_Hemisphere.jpg

Slide 9

Slide 9 text

0100111010101110010100101001010010010101101010 1110010101010101110010100101001010010011010101 1100101001010010100100110101011100101001010010 1001001101010111001010010100101001001101010111 0010100101001010010010101101010101011100101001 0100101001001101010111001101010111001010010100 1010010011010101110010100101001010010010100101 0010100100110101110010100101001010010011010111 0010100101001010010010010100100110101011010101 1100101001010010100100111000000101001011010101 1100101001010010101010101110010100101001010010 0101001001010010010111001011010101110010100101 0010100100110101011100101001010010100100110101 0111001010010100101001001010111001010010100101 1010101110010110101011100101001010010100100110 1010111001010010100101001001001010010100100110 1010111001010010100101001001001001101001010010 1001001101011100101001010010100100110101011100 Digital World Solutions to Digital World Problems

Slide 10

Slide 10 text

The major categories of disability Visual Blindness, low vision, colour blindness Hearing Deafness Motor Inability to use a mouse, slow response time, limited fine motor control Cognitive Learning disabilities, distractibility, inability to remember or focus on large amounts of information icons: Wikimedia Commons information source: WebAIM - http://webaim.org/intro/

Slide 11

Slide 11 text

Assistive technology

Slide 12

Slide 12 text

I don't care about accessibility. People with disabilities are not in my target audience. quote: W3C - http://www.w3.org/QA/2002/04/Web-Quality

Slide 13

Slide 13 text

Around 10 percent of the world’s population, or 650 million people, live with a disability. They are the world’s largest minority. -- The United Nations “ source: http://www.un.org/disabilities/default.asp?id=18

Slide 14

Slide 14 text

DISABILITY DISABILITY

Slide 15

Slide 15 text

DISABILITY DISABILITY

Slide 16

Slide 16 text

Ideally, of course, all websites, interfaces and apps would be fully accessible; not just these essential public services. And indeed I hope that the momentum from our initiative will spill over into some of those other areas -- Neelie Kroes, Vice-President of the European Commission “ source: http://blogs.ec.europa.eu/neelie-kroes/web-accessibility/

Slide 17

Slide 17 text

The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. -- Tim Berners-Lee, W3C Director and inventor of the World Wide Web “ source: http://www.w3.org/WAI/

Slide 18

Slide 18 text

What can we do?

Slide 19

Slide 19 text

Annette has asked me to look into the possibility of having some kind of visual representation of the European aggregation landscape... This has come out of feedback from the aggregators and new potential contributors who are having difficulty finding the National Initiative or aggregator in their respective countries. Is this something that is possible and can you help us with it? All I had in mind was a Google map or just an image with all the aggregators and initiatives marked and details appearing when they were clicked on. -- David “ source: http://pro.europeana.eu/web/guest/about/partners

Slide 20

Slide 20 text

“ DAVID WANTS A MAP! -- Me source: http://pro.europeana.eu/web/guest/about/partners

Slide 21

Slide 21 text

source: http://pro.europeana.eu/web/guest/about/partners

Slide 22

Slide 22 text

Then you go on an accessibility workshop

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

How can we fix this?

Slide 25

Slide 25 text

source: https://developers.google.com/maps/documentation/javascript/reference

Slide 26

Slide 26 text

The other routes • Leaflet JS • Leaflet.label • Leaflet.Pancontrol • Leaflet.Locate • Fitmaps JS Leaflet: http://leafletjs.com/ Fitmaps: http://www.waywayway.nl/handig-en-leuk/tutorials/responsive-google-maps-embeds/

Slide 27

Slide 27 text

source: http://deanbirkett.name/playground/europeana/accessible_map/

Slide 28

Slide 28 text

So what now?

Slide 29

Slide 29 text

Annette has asked me to look into the possibility of having some kind of visual representation of the European aggregation landscape... This has come out of feedback from the aggregators and new potential contributors who are having difficulty finding the National Initiative of aggregator in their respective countries. Is this something that is possible and can you help us with it? All I had in mind was a Google map or just an image with all the aggregators and initiatives marked and details appearing when they were clicked on. -- David “ This has come out of feedback from the aggregators and new potential contributors who are having difficulty finding the National Initiative of aggregator in their respective countries.

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

So is this accessible?

Slide 32

Slide 32 text

No content

Slide 33

Slide 33 text

But.... what can I do?

Slide 34

Slide 34 text

• Think of disability to help with accessibility • Write better links • Click here • Register Now for the Europeana Network • Write better ALT text • Here is a picture of a cute cat playing with a ball of wool • Cute cat playing with a ball of wool cute cat: http://animals.desktopnexus.com Token cute cat picture • Consider accessibility when defining personas • Supply close captioning on videos and transcripts

Slide 35

Slide 35 text

What is accessible design?

Slide 36

Slide 36 text

Accessible Design = Better Design

Slide 37

Slide 37 text

Thanks! I write about this sort of stuff quite a lot on my blog - check it out if you’re interested: http://deanbirkett.name Dean Birkett - Dec 2012 - CC BY - http://creativecommons.org/licenses/by/3.0/ (and thanks Dan Entous for your Javascript wizardry, and Chris Mills for all of your accessibility links and read through!)