iDESWEB

TRANSCRIPCIÓN

 

TRANSCRIPCIÓN

 

TRANSCRIPCIÓN

Pasando al tema de la accesibilidad web, pues existen distintas discapacidades y para saber hacer bien las páginas web hay que entender cada una de ellas: que problemáticas presenta cada discapacidad y sobre todo hay que conocer lo que se llaman las tecnologías o productos de apoyo.

Las tecnologías o productos de apoyo son aquellos instrumentos que usan las personas con discapacidad para minimizar o eliminar sus discapacidades, sus problemas.

Por ejemplo, yo llevo gafas, yo tengo una discapacidad, yo soy miope, y sin gafas no veo. Mi producto de apoyo son las gafas, con ello logro que mi discapacidad desaparezca.

Bien, si nos centramos en las personas ciegas, los productos de apoyo que suelen emplear para utilizar el ordenador y navegar por la web son básicamente dos. Por un lado tenemos la línea braille, que es un dispositivo electromecánico que va mostrando los caracteres, el texto que aparece en la pantalla del ordenador, lo va mostrando mediante en braille.

El segundo producto de apoyo que suelen emplear las personas ciegas se conoce como lector de pantallas, en inglés screen reader. Es un software que se instala en la computadora y que va a leer el contenido de la página web. Y no solamente va a leer el contenido del texto, sino que proporciona más información. Por ejemplo, cuando el lector de pantallas esté leyendo una página y se encuentre con un enlace, lo va a anunciar, le va a decir al usuario “Enlace”, le va a indicar el texto del enlace.

O cuando encuentre una lista, le va a decir que ha encontrado una lista y le va a decir cuántos elementos tiene la lista. Y además el usuario podrá navegar por los elementos de la lista fácilmente, el lector de pantalla le dirá “Estás en el elemento uno de tres” o “Estás en el elemento dos de tres” y así con el resto
de contenidos que podemos encontrar en una página web.

También anuncia cuando hay una imagen, cuando hay una tabla, etc.

Existe, como digo, existen diferentes programas lectores de de pantalla para los distintos sistemas operativos.

Para Windows, los dos más famosos son el Jaws, aquí tenemos la página web de su fabricante, Freedom Scientific. El problema es que Jaws es un sistema propietario, es de pago, el precio base son unos mil dólares, es un producto pues un poco caro.

Pero tenemos soluciones alternativas, tenemos soluciones de código abierto, como por ejemplo el lector de pantallas NVDA, que es completamente gratuito.

Bien, ¿cuántas personas con discapacidad hay en el mundo? Porque mucha gente cuando se le dice “tienes que hacer la página web accesible” dice “pues si hay pocas personas con discapacidad o las personas con discapacidad no usan la web, ¿para que me voy a molestar en hacer las páginas web accesibles?”

Bueno, eso demuestra un desconocimiento, porque hay muchas más personas con discapacidad de las que creemos.

Os he puesto aquí un par de estudios. El primero es una encuesta que se hizo en españa en el año 86 y en total un 15 por ciento de la población presentaba algún tipo de discapacidad.

Más recientemente, en este informe del año 2010, por ejemplo si solamente nos centramos en los problemas de visión, pues de los 44 millones de personas que hay en España, un millón presenta graves problemas de de visión, un millón de 44 millones, es un porcentaje pues bastante alto.

Otra idea, otro mito que mucha gente tiene es que un sitio web, si tiene que ser accesible, tiene que ser
entonces feo y aburrido.

Por ejemplo, mucha gente piensa que no hay que poner colores, pues porque las personas ciegas no pueden ver los colores o porque las personas con daltonismo tienen problemas con los colores. O también mucha gente piensa que no hay que poner imágenes.

Al final, mucha gente llega a la conclusión de que hay que hacer una página web de solo texto, y eso no es así, se pueden seguir haciendo las páginas web como se hacen normalmente, con colores con imágenes, lo único es que hay que poner ciertas características para mejorar la accesibilidad.

En este sitio web que os recomiendo Accessites.org podéis encontrar galerías de de sitios web que son totalmente accesibles y tienen un buen diseño, un diseño moderno, un diseño fresco, un diseño agradable.

Por ejemplo, he puesto el sitio web oficial del gobierno de Suecia y este sitio web es totalmente accesible no plantea ningún problema de accesibilidad y como podéis ver pues tiene imágenes, tiene colores, tiene diferentes tipos de letra, no tiene nada que digamos que está feo porque se ha hecho accesible.

Luego, una cosa muy importante hoy en día con el incesante incremento del acceso a la web a través de los dispositivos móviles es que al tener en cuenta la accesibilidad podemos obtener beneficios añadidos y por ejemplo un beneficio muy importante es que la accesibilidad web, como busca que una página web se vea bien con distintos dispositivos, pues vamos a lograr que nuestras páginas web se vean bien también desde tabletas o desde teléfonos móviles.

Por ejemplo, aquí tenemos un sitio web es de un curso que yo imparto y como he aplicado ciertas técnicas se ve bien con pantallas pequeñas o incluso con la pantalla de un dispositivo móvil.

¿Y cómo se logra que un sitio web se accesible?

“A ver Sergio, dame consejos”.

Pues otra vez vuelvo a decir lo mismo que con la usabilidad: hay cientos de consejos que hay que aplicar y en una presentación como está no lo puedo contar todo, pero sí que os voy a indicar por dónde tenéis que continuar.

Entonces, ¿dónde encontramos información sobre cómo mejorar la accesibilidad de nuestras páginas web?

Pues el punto principal de aprendizaje es el sitio web del World Wide Web Consortium, esta organización internacional que tiene como objetivo desarrollar la Web a su máximo potencial. Dentro del W3C existe un grupo de trabajo llamado Web Accesibility Iniciative que se dedica exclusivamente a la accesibilidad web.

Ellos llevan muchos años estudiando el tema de la accesibilidad web y todo lo que han desarrollado se puede resumir en este gráfico, es un gráfico extraído de de su página web. La accesibilidad web depende de tres pilares básicos, si uno de estos tres pilares falla, la accesibilidad fallará.

En la parte inferior izquierda tenemos a los desarrolladores, los developers. Los developers tienen que usar herramientas de autor, como por ejemplo Adobe Dreamweaver o Microsoft Frontpage, herramientas que generen contenido accesible. Pero no solamente la herramienta es suficiente, la herramienta te facilita el desarrollar contenido accesible, pero el desarrollador tiene que hacerlo. Y eso es el pilar que vemos en la parte superior que pone “content”, el contenido, el contenido tiene que ser accesible.

Y por último, a la derecha tenemos los usuarios. Los usuarios también se tienen que preocupar, tienen que usar productos de apoyo, navegadores y reproductores multimedia que tengan en cuenta las características de accesibilidad que hemos implementado en nuestras páginas web.

Si uno de estos tres pilares falla, fallará la accesibilidad como digo.

El WAI, el Web Accesibility Iniciative, ha desarrollado para cada uno de esos tres pilares, ha desarrollado una serie de pautas. Las más conocidas son las Web Content Accessibility Guidelines.

La primera versión, como podéis ver en esta imagen, apareció en el año 99. Se quedaron un poco viejas tardaron en evitar una nueva versión y por fin casi diez años después en el 2008 publicada en la versión 2.0 que es la que se tiene que aplicar hoy en día estas pautas han sido estandarizadas por el organismo internacional de estándares por iso se estandarizarán
en el año 2012 en el estándar iso iec 40 500 y esto ha facilitado que
diferentes países lo adopten como estándar de accesibilidad en concreto
aquí en ecuador el 28 de enero de este año se publicó que el inem publicaba
el estándar nt inem iso/iec 40 500 que era una trasposición del estándar iso
a los estándares ecuatorianos así que ahora mismo el estándar que rige el
tema de la accesibilidad web en ecuador es éste aún no está desarrollado en
el reglamento de aplicación es decir no hay todavía leyes que obliguen a su
aplicación pero se está trabajando en ello en otros países como por ejemplo
españa francia alemania existen desde hace años leyes que obligan a que
ciertas entidades garanticen que sus
páginas web son accesibles por ejemplo
en el caso de españa que lo conozco bien pues todas las administraciones
públicas deben de garantizar que esos sitios web son accesibles y además
también ciertas empresas de especial relevancia empresas como bancos empresas
como transporte de pasajeros empresas como suministro de servicios básicos
electricidad agua o gas también deben de garantizar un nivel mínimo de accesibilidad en sus sitios web

Ya para finalizar, me gustaría recordarte algunos de los sitios web en los que puedes encontrar más información sobre mí y sobre mi trabajo, y dos formas para contactar conmigo, a través de mi correo electrónico sergio.lujan@ua.es y a través de mi cuenta en Twitter @sergiolujanmora.

Recuerda que este vídeo forma parte del curso “Introducción al desarrollo web” que está disponible en la dirección idesweb.es.

Muchas gracias por tu atención.

TRANSCRIPCIÓN

Vamos a entrar ahora ya en el tema de la usabilidad y la accesibilidad web.

En internet podéis encontrar páginas de todo tipo, páginas que son fáciles de usar y páginas que son difíciles de usar. Seguramente todos habréis sentido mucha frustración en muchas páginas, páginas que entráis, no sabéis usar, no sabéis lo que tenéis que hacer y seguramente al final, en poco tiempo, las abandonáis.

Aquí os he puesto un ejemplo de una página horrible, una página que incumple pues prácticamente todos los principios básicos de cómo hacer una página bien. Es una exageración, os pongo aquí, os dejo la dirección de este sitio web para que lo que visitéis, incluso tiene música, lo que nunca hay que hacer en un sitio web, poner música a una página web, pues este sitio lo tiene.

Pero no hay que irse a casos tan extremos. Aquí por ejemplo os he puesto pues un problema grave que tiene un sitio web de una compañía ferroviaria importante de España. En realidad, ya estoy diciendo el nombre de la empresa, es Renfe porque no hay otra empresa ferroviaria en España y esta web tiene graves problemas de usabilidad. En concreto, aquí os he puesto cuatro capturas de cuatro formularios para buscar o comprar un billete de tren. ¿Y qué es lo curioso de estos cuatro formularios? Pues que en cada uno de ellos, la introducción de la fecha en la que queremos realizar el viaje se introduce de una forma distinta.

Podemos ver que en en la primera captura, la de la parte superior, se tiene que elegir el día, el mes y el año por separado, existen tres listas desplegables para cada una de las partes de la fecha.

En la segunda imagen, la que está el centro a la izquierda, pues se introduce a través de un calendario que se muestra. Ahí hay un icono donde se pulsa y se activa un calendario del mes y se elige la fecha.

A la derecha vemos, otra vez lo mismo, pero con otro icono y con otro calendario y en la parte inferior volvemos a ver lo mismo, con otro icono distinto.

Tenemos como digo cuatro formas distintas de seleccionar una fecha.

Además vemos también que las etiquetas para introducir las fechas cambián de una página a otra. En el primer formulario vemos que pone “día, mes y año”; en el segundo pone “entrada, salida”; en el tercero pone “salida regreso”; y en el cuarto por último pone “ida y vuelta”.

El usuario de esta web tiene que aprender, tiene que ir viendo en cada formulario cómo introducir los datos, porque no se lo está pidiendo de una forma coherente, de una forma consistente. Como digo, esto es un error tremendo.

¿Los problemas de usabilidad suponen un coste para las empresas? Pues sí, desgraciadamente sí.

Y aquí os he dejado dos ejemplos claros de ello.

El primero es de la empresa Expedia, la empresa Expedia se dedica al viaje, a la compra de billetes, reserva de hoteles por internet y hace un par de años salió esta noticia de como Expedia pues se ahorró o ganó 12 millones de dólares más simplemente eliminando un campo de un formulario.

Esta es la web de Expedia y en concreto era este formulario. A la izquierda podéis ver el formulario original y a la derecha podéis ver el formulario modificado una vez que se eliminó ese campo. El campo lo he marcado aquí, es el campo “Company name”. Se solicitaba junto con el nombre de la persona se solicitaba el nombre de la empresa y esto se solicitaba cuando éste tenía que introducir los datos de la tarjeta de crédito para realizar el pago.

¿Y qué se descubrió? Pues mucha gente, en el campo “Company name” introducía el nombre de su banco, creía que le estaban pidiendo el nombre del banco de la tarjeta de crédito. Y luego en la parte inferior, que pone “Primary billing address” pensaban otra vez que había que introducir la dirección de su banco, no su dirección, sino la dirección del banco.

¿Qué ocurría? Esto confundía a la gente, muchos usuarios, muchos clientes, introducían esos datos y luego cuando se iba a validar la tarjeta de crédito con la dirección introducida, como no coincidía, se anulaba la compra y por eso, la empresa esta, Expedia perdía dinero, perdía compras.

Al eliminar ese campo logró aumentar su facturación en 12 millones de dólares como digo.

Otro caso muy famoso y más exagerado es el que se conoce como “el botón de los 300 millones de dólares”. Este es un poco más complejo de entender, pero he hecho un gráfico para explicarlo.

Ocurría lo siguiente. Este caso es de una tienda de venta de productos online y cuando ya se tenía que hacer el “check out”, finalizar la compra, el usuario se tenía que registrar.

Muchos usuarios estaban ya registrados y al tener que identificarse, meter el usuario y la contraseña, no se acordaban de la contraseña.

El formulario ofrecía la opción de solicitar un nuevo password, resetearlo.

El 40% de los usuarios que finalizaban la compra no se acordaban del password y activaban la opción de resetear el password. Pero, como era un proceso complejo, de ese 40% sólo el 25% lograba resetear el password.

Estamos ya con un 10% del 100% total. Y de ese 25% que lograba resetear el password, solamente un 20% finalizaba la compra, el resto pues abandonaba.

Podemos ver entonces al final que de ese 40% de personas que tenían problemas porque no se acordaban de el password, sólo un 2% finalizaba la compra; luego un 38% de los usuarios que tenían intención de compra, al final no compraban por la complejidad del sistema, por tener que recordar la contraseña y no lograr resetear la contraseña.

¿Qué hicieron en este sitio web? Cambiaron el sistema y permitieron la compra sin tener que identificarse, es decir, comprar como usuario invitado y al cambiarlo, en la primera semana del cambio aumentaron sus ventas en seis millones de dólares. Y en el primer año, los 300 millones de dólares. Simplemente un cambio que se debía a entender cómo se comportaban los usuarios, qué problemas tenían los usuarios.

¿Qué consejos os puedo dar para mejorar la usabilidad web?

Bueno, necesitaríamos horas y horas porque hay infinidad de consejos y sobre todo hay algo muy difícil, y es que los consejos no los tenéis que tomar como leyes que siempre hay que aplicarlos: hay que ver el contexto y decidir si conviene o no conviene usar los consejos.

Lo que sí que os puedo decir, os vuelvo a repetir el consejo de piensa en los usuarios, pero sí que os pueda recomendar dos gurús que os aconsejo que consultéis, que leáis artículos de ellos, que leáis libros y aprenderéis bastante.

El primero se llama Jakob Nielsen, lleva ya 20 ó 30 años dedicándose a la usabilidad y casi 20 años a la usabilidad web.

Tiene una página web muy famosa donde podéis encontrar casi 500 artículos, donde os van a explicar multitud de cosas y cientos de consejos. Y además también ha publicado varios libros.

Por ejemplo, aquí tenemos “Priorizando la accesibilidad web”.

Os pongo simplemente dos consejos. El primero nos dice “Pregúntate si alguien que sólo lea las dos primeras frases de tu página obtendrá la información que quieres transmitir”. La gente no dedica minutos y minutos a visitar una página web, la gente tiene cosas más interesantes que hacer. En una página web hay que vender claramente la idea, el objetivo, el propósito.

Si por ejemplo lo que queremos es vender un producto a través de una página web, lo que se llama la llamada a la acción, es decir, la llamada a la compra, tiene que estar claramente distinguida, se tiene que ver y además repetirla por muchas partes de la página.

El otro consejo nos dice “Con pocas excepciones, la gente visita la Web por su utilidad, no por su belleza. Tener un sitio visualmente atractivo es bueno, por supuesto, pero el contenido es sagrado. Después de todo, cuando la gente escribe sus preguntas en los motores de búsqueda, no pregunta por los atributos estéticos – está buscando información”.

Desgraciadamente, muchas veces prima el diseño visual, llega el diseñador e impone su gusto estético por encima del contenido, por encima de la información. Hay que buscar un equilibrio, pero como digo desgraciadamente muchas veces triunfa el diseñador.

Otro gurú que os recomiendo que consultéis y que sigáis se llama Steve Krug. También tiene varios libros, el más famoso es “No me hagas pensar”, eso podría ser otro consejo, no hagas pensar al usuario que visita tu página web. Y, recientemente publicó su segunda edición “No me hagas pensar revisitado”, de aquí os destacó tres consejos.

No me hagas pensar.

No importa cuántas veces tengo que hacer clic, siempre y cuando cada clic es una lección inconsciente e inequívoca.

Deshágase de la mitad de las palabras de cada página, a continuación, deshágase de la mitad de las que quedan.

Hay que ser breves, simples en lo que escribimos en una página web, porque vuelvo a decir, la gente no se detiene a leerlo todo. Así que, hay que ser directos y expresar claramente las ideas y el propósito de
las páginas web.

Ya para finalizar, me gustaría recordarte algunos de los sitios web en los que puedes encontrar más información sobre mí y sobre mi trabajo, y dos formas para contactar conmigo, a través de mi correo electrónico sergio.lujan@ua.es y a través de mi cuenta en Twitter @sergiolujanmora.

Recuerda que este vídeo forma parte del curso “Introducción al desarrollo web” que está disponible en la dirección idesweb.es.

Muchas gracias por tu atención.

TRANSCRIPCIÓN

Así un poco para resumir, muchos autores dicen que la usabilidad se compone de tres factores. Se compone del sentido común, que a veces es el menor de los sentidos, se compone de simplicidad y se compone de un buen diseño.

Cuando tenemos en cuenta estos tres factores, sentido común, simplicidad y diseño, y nos preocupamos de lograr lo mejor en cada uno de ellos, pues estamos logrando una buena usabilidad.

Veamos ahora qué es la accesibilidad.

Asociado a la accesibilidad existen otros conceptos que significan más o menos lo mismo: diseño inclusivo, diseño universal o diseño para todos.

Es muy típico esta situación: unas escaleras, unas gradas para acceder a cierto sitio, a un edificio. ¿Y qué ocurre?

Pues estas gradas no son accesibles para muchas personas con discapacidad. Por ejemplo, una persona que vaya en silla de ruedas. Para solucionar este problema, este problema de falta de accesibilidad, pues ¿qué se suele hacer?

Se suelen construir rampas. Pero en muchas situaciones ocurre como he puesto en esta imagen: la rampa es una entrada secundaria, se indica de forma explícita en este caso acceso para personas de silla de ruedas en un lateral. Y esto lleva implícito una discriminación, un trato distinto a las personas con discapacidad. Es una solución, pero no es
la mejor de las soluciones. Como he dicho antes, hay que intentar realizar un diseño inclusivo, un diseño para todos, no soluciones parciales para distintas personas, sino un diseño que englobe a todas las personas ya sus particularidades.

Por lo menos esta rampa que muestro aquí en esta imagen la puede usar una persona en silla de ruedas. Pero a veces se llega a situaciones tan estúpidas y tan poco útiles como esta rampa que vemos aquí, con una pendiente excesiva que una persona que use en silla de ruedas no la va a poder usar. Si intenta bajar por esta rampa se va a matar. O encontramos otras situaciones igual de estúpidas, como esta otra rampa que sí, va saltando, va salvando los escalones, pero el último tramo no hay rampa, ¿entonces para qué sirve esta rampa?

Como digo, son soluciones estúpidas, soluciones inútiles que ocurren más de lo que se cree en la la vida diaria.

¿No se puede hacer mejor, no se pueden plantear soluciones inclusivas para todos y que realmente sean buenas?

Sí, lo único que hay que hacer es pensarlo un poco mejor.

Aquí por ejemplo, podemos ver unas imágenes de unas escaleras, unas gradas que llevan incluidas las rampas y queda además bastante elegante y bastante bonito.

Aquí podemos ver otra imagen de la misma escalera, de las mismas gradadas y no es únicamente de este edificio, este edificio está en Chicago, es un edificio museo, aquí pues claro, han intentado hacerlo bastante elegante. Pero hay situaciones en la calle. Este es otro edificio, en otra ciudad y podemos ver cómo se ha integrado correctamente la rampa con las escaleras.

Una pregunta que mucha gente se hace es: ¿la accesibilidad es sólo para las personas con discapacidad? Por ejemplo, las rampas que hemos visto, ¿ayudan solamente a las personas que van en silla de ruedas?

Pues no, evidentemente no. Una rampa la pueden usar otras personas que no sean discapacitadas bajo ciertas situaciones. Entonces, es un error, como se suele hacer y cómo se pone aquí en esta imagen, pues señalar las ayudas para las personas con discapacidad, señalarlas como que son ayudas solamente para ellos, pues es un error. Aquí volvemos otra vez un poco al tema de la discriminación.

¿En qué situaciones se podría usar una rampa por personas que no sean discapacitadas?

Aquí os he puesto tres ejemplos, pero seguro que podemos encontrar muchos más. A la izquierda tenemos pues una mamá que va con el carrito de bebé y que le va a venir muy bien el que haya una rampa para salvar las gradas de un edificio.

O en la fotografía del centro tenemos a una repartidora que va con una carretilla y que también le va a venir muy bien la rampa.

O a la derecha tenemos a un señor que va con muletas porque ha tenido un accidente y también le va a venir muy bien subir por la rampa en vez de por la gradas.

Como vemos, las ayudas para las personas con discapacidad también ayudan al resto de personas en ciertas situaciones. Y podemos encontrar más ejemplos.

Este es el acceso a un sistema de transporte urbano, donde tenemos pues un pequeño elevador para salvar estas gradas. Otra vez, no solamente ayuda a una persona que vaya en silla de ruedas, sino que también ayuda pues a esta mamá que va con el cochecito de bebé.

O aquí tenemos por ejemplo unas fuentes a dos alturas, una fuente pública de agua y tenemos a la derecha una que está otra vez mal señalada porque indica que solamente para una persona con discapacidad, una persona que va en silla de ruedas, pero seguro que a todos vosotros se os ocurre que la fuente de la derecha que está más baja también va ayudar pues a los niños, por ejemplo.

Para resumir un poco lo que hemos visto de usabilidad y accesibilidad, ¿qué consejos os podría yo dar para mejorar la accesibilidad y usabilidad de cualquier cosa, no solamente de páginas web?

Ahora después hablaré de las páginas web, pero de cualquier cosa, cualquier diseño de un objeto, de un servicio, de un producto, ¿qué tres consejos básicos os puedo dar?

Pues son tres consejos muy sencillos de entender, lo difícil es aplicarlos. El primero es piensa en el usuario, el segundo es piensa en el usuario y el tercero es piensa en el usuario. Es decir, lo primero que debes hacer cuando te plantees el diseño de algo es pensar en el usuario que lo va a utilizar, ponte en su piel, mira a ver cuáles son sus requisitos, sus necesidades e intenta hacerlo para que el usuario no tenga dificultades en su uso. Y así tendrás usuario felices, usuarios contentos.

Si estamos, por ejemplo pues en una empresa, pues tendremos a usuarios felices que comprarán, seguirán comprando nuestros productores.

Si por ejemplo estamos en el caso de educación, yo soy profesor, pues yo tendré alumnos que seguramente estudiarán mejor, aprenderán mejor y estarán contentos conmigo.

Lo podemos hacer en cualquier contexto, pensar en el usuario. Y por tanto no pienses en ti, no pienses en hacer las cosas más fáciles desde tu punto de vista, sino piensa en el usuario final que va a usar tu producto o servicio.

Ya para finalizar, me gustaría recordarte algunos de los sitios web en los que puedes encontrar más información sobre mí y sobre mi trabajo, y dos formas para contactar conmigo, a través de mi correo electrónico sergio.lujan@ua.es y a través de mi cuenta en Twitter @sergiolujanmora.

Recuerda que este vídeo forma parte del curso “Introducción al desarrollo web” que está disponible en la dirección idesweb.es.

Muchas gracias por tu atención.