Archivo del Autor: Manuel Razzari

Clase 02. Lectores de pantalla

Esta clase comenzó cuando Pablo Vázquez nos contó desde cero como utiliza JAWS para usar la computadora en general, y la web en particular. Utilizó JAWS 18 e Internet Explorer 11 en Windows 7, destacando que si bien hay versiones más nuevas, hay mucha resistencia al cambio, ya que los usuarios están muy acostumbrados a la idiosincrasia de su versión, sus atajos de teclado, etc. Más aún en el caso de cambiar de un lector a otro. Remarcó la necesidad de generar “caminitos” o “estrategias de navegación” para enfrentar los sitios más complejos.

A continuación vimos una introducción al mundo de los lectores de pantalla: cómo es ese mercado, cuáles son los favoritos de los usuarios en combinación con diferentes navegadores. Empezamos a ver cuáles son los principales problemas que encuentran los usuarios de lectores de pantalla al usar la web, y la necesidad de incluir al lector de pantalla en nuestra matriz de navegadores soportados.

Comenzamos a practicar el uso de NVDA y VoiceOver para evaluar la accesibilidad, familiarizándonos con su utilización, la forma en que presenta los elementos de HTML, los atajos de teclado, y cómo se comporta en diversos sitios Web.

Clase 07. Visible y legible

Comenzamos entendiendo de qué forma ven las personas que se encuentran limitadas en su capacidad de visión, ya sea por diversos problemas oculares, neurológicos, o por las características de su entorno de trabajo.

Comprendiendo ésto, vimos cómo desde la accesibilidad Web es necesario tamizar las referencias a información de carácter visual, evitar la dependencia del color como modo exclusivo de transmitir información, garantizar niveles mínimos de contraste, escalabilidad y legibilidad en el texto.

Por último y también relacionado con la cuestión visual, evitar que los destellos, flashes y animaciones rápidas en pantalla sean potencialmente desencadenantes de convulsiones en personas con epilepsia fotosensible y otros desórdenes de fotosensibilidad.

Clase 05. Navegación por teclado

Discutimos en esta clase la importancia de que toda la funcionalidad del sitio esté disponible para ser recorrida, activada y utilizada solo con un teclado, entendiendo ante todo cómo se utiliza el mismo para navegar, y a quién beneficiamos con esto.

Vimos el concepto de “1D” (una dimensión) para referirnos a la entrada de datos por teclado como un flujo continuo y consecutivo de caracteres, para diferenciarlo del mouse que es “2D” al recorrer la pantalla en los ejes vertical y horizontal. Establecimos el paralelo con el lector de pantalla, que lee el documento como un punto recorriendo una línea (y no un plano).

Conocimos el atributo tabindex para controlar el orden de tabulación, cuáles son las principales trampas para el foco y cómo evitarlas, y destacamos la importancia de pensarlo dos veces antes de aceptar que ciertas funciones no pueden ser controladas sin el mouse (por ejemplo arrastrar y soltar, o un programa de dibujo vectorial).

Clase 04. Marcado semántico

En esta clase trabajamos el tema del marcado semántico, y cómo la publicación de documentos en la Web debe pensarse esencialmente en 4 capas: contenido (texto plano), estructura semántica (HTML), presentación visual (CSS)  y comportamiento (JavaScript). Vimos el concepto de mejora progresiva como forma de separar en forma apropiada estas capas; de forma tal que se complementen sin entremezclarse

Nos detuvimos con especial cuidado en los encabezados, por ser claves para la comprensión, navegación y estructura de una página. Éstos tenderán a formar un árbol jerárquico, a partir del encabezado de nivel 1. También repasamos la importancia de seguir las convenciones para el texto plano a modo de “semántica de nivel cero”.

Entendimos por qué es bueno que un enlace contenga siempre URLs, y no eventos “onclick“, pseudo-protocolos “javascript:...“, o indicadores de fragmento “#“. Por último comenzamos a ver formas de aumentar la semántica provista por HTML mediante microformatos, RDFa, microdata y en especial WAI-ARIA, que veremos en detalle más adelante.

Clase 03. Alternativas textuales

Presentamos el problema del texto como imagen, su contexto histórico y su rol crítico en la accesibilidad web, detallando las distintas formas de usar el atributo alt según el rol de la imagen  en la página y su contexto.

Vimos el uso de alternativas textuales en mapas de imágenes, en gráficos interactivos SVG, y presentamos algunas opciones modernas a la técnica de reemplazo de imágenes, incluyendo el uso de @font-face, el uso de CSS3 para evitar maquetar con imágenes, y la necesidad de educar a nuestros colegas y clientes en que no es necesario que la página se vea igual en cada navegador.

Por último comenzamos a introducirnos en las WCAG 2.0, pautas que veremos a lo largo del curso,  analizamos las relevantes a alternativas textuales, y la diferencia entre cada nivel de conformidad.

Clase 01. Prestaciones, limitaciones y topografía

En la primera parte de la clase vimos las definiciones de HCI, Usabilidad y Experiencia de usuarios. Luego vimos, porque UX no es solo UI. Por último estuvimos revisando los principales conceptos de Donald Norman.

En la segunda parte estuvimos viendo algunos los casos con los conceptos que vimos en la clase anterior. Luego se realizó una práctica de prototipado sobre formularios.

Los slides tienen una definición amplia de prototipo, y recomendaciones para el diseño de formularios tomadas del libro de Luke Wroblewski: Web Form Design, Filling the Blanks.

Clase 01. Situando la accesibilidad

El objetivo de esta clase fue comenzar a comprender como las personas con discapacidad usan la Web, las características de los problemas se presentan, y las soluciones que podemos darles.

En principio se introdujo la temática de discapacidad y accesibilidad en general, cómo ha evolucionado la visión de la sociedad al respecto a lo largo de la historia, y el concepto de brecha entre las capacidades de la persona y las expectativas de la sociedad. Finalmente cómo esta brecha puede achicarse mediante accesibilidad y ayudas técnicas.

A continuación presentamos videos de usuarios de distintas ayudas técnicas y estrategias de adaptación, para comenzar a entender en qué consisten las más usadas y de qué forma ayudan a las personas con discapacidad.

Vimos un ejemplo de búsqueda de trabajo como prioridad a nivel humano, y los problemas de accesibilidad que presenta en un conocido portal.

Aclaramos algunas dudas de la clase anterior con respecto a las diferencias y puntos en común entre Usabilidad y Accesibilidad como disciplinas; y despejamos algunos mitos que rondan las discusiones sobre accesibilidad.

Finalmente pensamos un poco en por qué es importante para un diseñador o programador web el hacer páginas accesibles, y vimos algunas tendencias a nivel mundial que incentivan el trabajo en accesibilidad web.