Diseño Universal y accesibilidad
Ejemplos
Accesibilidad
Podemos definir accesibilidad web como la posibilidad de que un contenido de la Web pueda ser accedido por cualquier persona independiente de las características de acceso o las derivadas del contexto de uso.
How People with Disabilities Use the Web?
Auditory: Deaf-blindness: substantial, uncorrectable hearing and visual impairments. Hard of hearing: mild or moderate hearing impairments in one or both ears. Deafness: substantial, uncorrectable impairment of hearing in both ears.
To use the Web effectively:
Transcripts and captions of audio content, including audio-only content and audio tracks in multimedia
Media players that display captions and provide options to adjust the text size and colors of captions
Options to stop, pause, and adjust the volume of audio content (independently of the system volume)
High-quality foreground audio that is clearly distinguishable from any background noise
Cognitive, learning, and neurological:
Cognitive, learning, and neurological disabilities involve neurodiversity and neurological disorders, as well as behavioral and mental health disorders that not necessarily neurological. They may affect any part of the nervous system and impact how well people hear, move, see, speak, and understand information. Cognitive, learning, and neurological disabilities do not necessarily affect the intelligence of a person.
To use the Web effectively:
Clearly structured content that facilitates overview and orientation
Consistent labeling of forms, buttons, and other content parts
Predictable link targets, functionality, and overall interaction
Different ways of navigating websites, such as hierarchical menu and search
Options to suppress blinking, flickering, flashing, and otherwise distracting content
Simpler text that is supplemented by images, graphs, and other illustrations
Physical
Physical disabilities (sometimes called "motor disabilities") include weakness and limitations of muscular control (such as involuntary movements including tremors, lack of coordination, or paralysis), limitations of sensation, joint disorders (such as arthritis), pain that impedes movement, and missing limbs.
To use the Web effectively:
Ergonomic or specially designed keyboard or mouse
Head pointer, mouth stick, and other aids to help with typing
On-screen keyboard with trackball, joysticks, or other pointing devices
Switches operated by foot, shoulder, sip-and-puff, or other movements
Voice recognition, eye tracking, and other approaches for hands-free interaction
Speech
Speech disabilities include difficulty producing speech that is recognizable by others or by voice recognition software. For instance, the loudness or clarity of someone's voice might be difficult to understand.
Comics on Digital Medium
Barriers for people with speech disabilities
Web-based services, including web applications, that rely on interaction using voice only.
Websites that offer phone numbers as the only way to communicate with the organizations.
Visual
Color blindness - includes difficulty distinguishing between colors such as between red and green, or between yellow and blue, and sometimes inability to perceive any color.
Low vision - (in some regions also called "partial sight") includes poor acuity (vision that is not sharp), tunnel vision (seeing only the middle of the visual field), central field loss (seeing only the edges of the visual field), and clouded vision.
Blindness - substantial, uncorrectable loss of vision in both eyes.
Deaf-blindness - substantial, uncorrectable visual and hearing impairments.
To use the Web effectively:
Enlarging or reducing text size and images
Customizing settings for fonts, colors, and spacing
Listening to text-to-speech synthesis of the content
Listening to audio descriptions of video in multimedia
Reading text using refreshable Braille.
Barriers
Images, controls, and other structural elements that do not have equivalent text alternatives.
Text, images, and page layouts that cannot be resized, or that lose information when resized.
Missing visual and non-visual orientation cues, page structure, and other navigational aids.
Video content that does not have text or audio alternatives, or an audio-description track.
Inconsistent, unpredictable, and overly complicated navigation mechanisms and page functions.
Text and images with insufficient contrast between foreground and background color combinations.
Websites, web browsers, and authoring tools that do not support the use of custom color combinations.
Websites, web browsers, and authoring tools that do not provide full keyboard support.
Barriers
Audio content, such as videos with voices and sounds, without captions or transcript
Media players that do not display captions and that do not provide volume controls.
Media players that do not provide options to adjust the text size and colors for captions.
Web-based services, including web applications, that rely on interaction using voice only.
Lack of sign language to supplement important information and text that is difficult to read.
Comics interactivos
Aplicaciones de ayuda para discapacitados
The Boat: Making Of http://www.sbs.com.au/movies/article/2015/04/27/sound-and-vision-boat
Accesibilidad grado en el que cualquier persona puede usar un sistema o acceder a un servicio independientemente de sus capacidades técnicas, cognitivas o físicas; por tanto, para poder levantar las barreras que existen y democratizar el acceso a la tecnología, se hace necesario adaptar los dispositivos de pantalla táctil a las necesidades de los usuarios que padecen alguna discapacidad
webcomics enhanced through the use of the infinite canvas, as proposed by Scott McCloud, those enhanced with videos and/or sound, and lastly those enhanced with interactive and ludic elements.
Three relatively new ‘enhancements’ to the medium of comics are presented in this article: webcomics enhanced through the use of the infinite canvas, as proposed by Scott McCloud, those enhanced with videos and/or sound, and lastly those enhanced with interactive and ludic elements. All of the mentioned push the medium of comics into new waters, and by doing so they add new layers of meaning.
La accesibilidad engloba muchos tipos de discapacidades y situaciones, incluyendo problemas visuales, auditivos, físicos, cognitivos, neurológicos y del habla.
Diseño Universal
Consiste en la percepción y creación de diversos productos, entornos y servicios de manera que puedan ser utilizados por el mayor número posible de personas, sin necesidad de adaptaciones o de proyectos especializados según los usuarios.
El Diseño Universal no debe hacer separación entre las personas sino que busca la adecuación para todos, con el mismo diseño o bien ofreciendo elecciones para diferentes necesidades.
Interfaces
● En el caso de interfaces de acceso a contenidos, se utilizarán estándares que permitan añadir equivalentes de texto a los elementos no textuales.
● Proporcionar audiodescripción, es decir, una narración (ya sea en voz humana o mediante síntesis de voz) que explique con detalle los detalles visuales que no quedan reflejados en el audio y que el usuario necesita conocer.
● Proporcionar una trascripción textual de los contenidos, orientada a que los usuarios la utilicen en conjunción con un lector de pantalla.
● Teniendo en cuenta que uno de los grandes atractivos de estos contenidos es su interactividad, en el caso de interfaces se debe proporcionar control al usuario, independiente del dispositivo, que permita al usuario la navegación por los distintos controles de reproducir, parar, pausar, etc.
Estándares Web https://www.w3.org/
Los estándares web son un conjunto de recomendaciones dadas por el World Wide Web Consortium (en adelante W3C) [W3C, 1994] y otras organizaciones internacionales
acerca de cómo crear e interpretar documentos basados en la Web.
Son un conjunto de tecnologías orientadas a brindar beneficios a la mayor cantidad de usuarios, asegurando la vigencia de todo documento publicado en la Web. El objetivo es crear una Web universal para todos con sitios accesibles a más personas y que funcionen en cualquier dispositivo de acceso a Internet.
El diseñador será el que tome la decisión de cuál utilizar, pero su objetivo debe ser la accesibilidad en todas sus dimensiones y el alcanzar al mayor número posible de usuarios.
La accesibilidad y usabilidad web son conceptos que están muy ligados, pero a su vez claramente distintos. Si nos ceñimos a las definiciones, usabilidad está centrada en conceptos de calidad de uso, de efectividad del uso, mientras que la definición de accesibilidad se centra en posibilidad de uso. Pero los dos aspectos confluyen hacia la misma meta: que todos los usuarios puedan acceder a los recursos del sitio web y su visita sea agradable.
De nada sirve tener una web que sea usable y sin embargo haya usuarios que no puedan acceder a los contenidos por problemas de accesibilidad.
De igual forma, de nada sirve permitir el acceso a todos los recursos y contenidos web y que ésta sea tan poco usable que el usuario quede frustrado en su visita. Son aspectos fundamentales a tener en cuenta en el desarrollo de una aplicación web.
Para diseñar y desarrollar un sitio web accesible hay que seguir un Diseño Universal teniendo en cuenta las necesidades de todos los grupos de usuarios. Para ello es necesario tener en mente la accesibilidad desde el inicio del proceso de diseño y desarrollo web, siguiendo metodologías de Diseño Centrado en el Usuario, contando en todo momento con una participación muy activa de “todos” los tipos de usuarios en todas las fases del proceso.
"...cuando hablamos de personas con discapacidad sensorial, la tecnología está jugando un papel decisivo en su autonomía y accesibilidad.
“La tecnología es la que posibilita a nivel técnico que la inclusión se produzca, pero si hay algo que posibilita más la inclusión es la voluntad humana”
Herramientas de Accesibilidad
Extensión para simular problemas visuales en web:
https://chrome.google.com/webstore/detail/nocoffee/jjeeggmbnhckmgdhmgdckeigabjfbddl
Accesibilidad Google Material Design:
https://material.io/guidelines/usability/accessibility.html#accessibility-color-contrast
Paletas de color accesibles: http://colorsafe.co/