1

2 ¿Cómo hacer unas diapositivas? Texto y elementos visuales suficientemente grandes Fuente fácil de leer: grosor uniforme Contraste de color adecuado No abusar de animaciones Numerar las páginas Material accesible de antemano 2

3 Todo con el teclado Mal: Campus Virtual 3

4 Todo con el teclado Mal: Dropbox 4

5 Todo con el teclado Bien: Google Drive 5

6 Orden lógico de tabulación Mal: Agencia Tributaria 6

7 Orden lógico de tabulación Bien: Social Security in USA 7

8 Claro y conciso Mal: Ling’s Cars 8

9 Claro y conciso Bien: Universidad de Cambridge 9

10 Sencillez es rapidez 10 Mal: Facilit@ de MECD

11 Sencillez es rapidez Bien: stackoverflow 11

12 Contrasta los elementos Mal: Squarespace 12

13 Contrasta los elementos Bien: Contrast Rebellion 13

14 Personalizable Mal: Wikipedia 14

15 Personalizable Bien: 4chan 15

16 Agranda los botones 16 Mal: El País

17 Agranda los botones 17 Bien: noxevieja.com

18 Ayuda con sonidos 18 Mal: Captcha

19 Ayuda con sonidos Bien: Captcha 19

20 Única columna seleccionable Mal 20

21 Única columna seleccionable Bien: El Mundo 21

22 Etiqueta el contenido 22 Mal:

23 Etiqueta el contenido 23 Bien:

24 Tablas 24 Mal: …

25 Tablas 25 Mal: horarios en Geaportal

26 Bootstrap Framework para diseño de sitios y aplicaciones web Contiene plantillas con tipografía, formularios, botones, etc basados en HTML y CSS, así como JS Licencia MIT 26

27 Bootstrap 27 Diseño flexible y dinámico

28 Herramientas de testing WebAIM Color Contrast Checker/WAVE: ratios de contraste WebAIM Color Contrast CheckerWAVE Google’s Accessibility Developer Tools: auditoría Google’s Accessibility Developer Tools Capybara-accessible: Ruby on Rails Capybara-accessible Tab navigate: reto para el programador JAWS/Voice Over: revisores de pantalla JAWSVoice Over 28

29 Realizado por Daniel Báscones García Víctor Adolfo Gallego Alcalá Ana María Martínez Gómez Iñigo Zunzunegui Monterrubio Bajo licencia: Creative Commons Reconocimiento-CompartirIgual 4.0 Internacional 29