viernes, 30 de diciembre de 2016

La era de los coches autonomos

No nos damos cuenta pero la accesibilidad tiene un amplió mercado, vamos siempre detras de los avances y hasta que no demos un paso adelante siempre seremos del furgon de cola, este es un video de promoción del evento CES 2017 en el se tratará sobre el coche autónomo. Pues las grandes empresas se han percatado de que el numero de personas con algún tipo de discapacidad esta creciendo y es un mercado cada vez más grande.


Cómo crear formularios accesibles

Los formularios son una de las partes más atractivas de su sitio web. Se utilizan para la recopilación de datos e interactuar directamente con tu visitante. Lo más practico de ellos, es que permiten que tu sitio es que puede comercio electrónico. Naturalmente lo que se desea es que esté se pueda rellenar por tantos usuarios como sea posible, y así no excluir a ningún grupo particular de usuarios tengan acceso a estas áreas de generación de ingresos de su sitio web.
HTML 5  está bien para la accesibilidad y, de hecho, los lectores de pantalla están preparados para los nuevos elementos. Vamos a repasar los puntos de partida básicos para cualquier estructura formulario.

Etiquetas

 Cada entrada o grupo de entradas en el formulario deben tener su etiqueta.
<Label for = "nombre"> Nombre </ label>
<Input id = "nombre">

es muy accesible, siempre y cuando se respete que la etiqueta "for" se vincula con el atributo "id" de la entrada.
 Suele ocurrir que en el desarrollo se elimina el input y usan placeholder esto no es aconsejable pues placeholder  tiene un contraste muy liviano otra desventaja es que los lectores de pantalla no leerán su contenido. 

<input id="nombre" aria-label="Introduce tu nombre">

Instrucciones

Es común que un sitio web para incluir instrucciones de entrada para un campo. Por ejemplo, un campo de fecha puede tener ayuda de formato:


<label for = "fecha"> Fecha </ label> 
<input id = "fecha" /> <span> (año / mes / día) </ span>


El ejemplo anterior arroja luz sobre uno de los problemas de los formularios y la accesibilidad
Muchos de estos usuarios emplean el teclado como el único medio para desplazarse por sitios Web. Esto se hace usando las teclas de tabulación, abajo, arriba y las teclas de flecha para leer a través de su contenido. Las teclas de flecha con bastante usadas pues permiten al usuario acceder a todo el contenido con el teclado. Cuando se trata de formularios, las teclas de flecha no bastan, ya que no puede desplazarse dentro de una entrada de texto, área de texto, o una lista, y por lo tanto el usuario se puede quedar atrapado.
Para ayudar se use ARIA exactamente ARIA-LABEL.

<label for="date">Date</label>
<input id="date" aria-label="Introduce tu año, mes y dia"><span>(año/mes/dia)</span>

Cómo hemos dicho anteriormente muchos usuarios rellenan los formularios con el teclado por eso es recomendable usar un orden lógico de tabulación, para ello usa la etiqueta tabindex, tén en cuenta que si pones tabindex = "0" al comienzo dejaras el orden de tabulación sin un orden.
asegúrese de que todas las instrucciones se colocan por delante de donde más se necesitan.:

<form> 
... 
 <div tabindex = "0"> Rellene el formulario  </ div>  
    <input type = "submit" value = "Enviar formulario"> 
   
... 
</ form>

Mensajes de error


Los mensajes de error se debe realizar en tiempo real, antes que los usuarios completen el formulario. Es decir, no se debe basar en la espera de que el usuario envía el formulario, sino que el usuario debe ser informado inmediatamente si cometió un error. Este mensaje debe hacerse de tal manera que un lector de pantalla pueda recoger el error. Esto se puede lograr por tener un div de error designado que tiene el atributo "aria-live" y que se actualiza a través de JavaScript:


<Div id = "mensaje_error" aria-live = "polite"> Su mensaje de error aquí </ div>

Elementos deshabilitados


Típicamente, estos elementos deben tener disabled="true" incluido en sus atributos. Es bastante común que los formularios utilicen un sistema pasivo para asegurar que todos los campos requeridos se han completado correctamente. El botón de envío permanecerá desactivado hasta que el usuario complete todos los campos obligatorios. Este tipo de interfaz es muy probable que pierda a los usuarios que dependen de los lectores de pantalla, o los usuarios que tienen problemas para distinguir el color.


jueves, 29 de diciembre de 2016

Aplicación para conocer el aire de Madrid

Yo cómo madrileño y ciudadano de Madrid apruebo la medida de restringir la circulación a vehiculos con matricula par pero no puedo aprobar la aplicación que tiene el ayuntamiento para conocer el estado de la contaminación.


Cómo yo digo la accesibilidad web es pensar en los demás, yo no tengo discapacidad visual grave pero otra persona si y si necesita conocer o tiene curiosidad por conocer el estado del aire en Madrid, el escuchar enlace aquí se puede preguntar ¿aquí?, ya sé que la asignatura de usabilidad y accesibilidad es un Maria en la carrera pero existe gente que precisa la accesibilidad.

miércoles, 28 de diciembre de 2016

Emoji y la accesibilidad

Antes de nada explicar que es un Emoji, un Emoji es una palabra compuesta que significa lo siguiente: imagen (e, 絵) + letra (moji, 文字). Son utilizados como los emoticonos principalmente en conversaciones de texto a través de teléfonos inteligentes.
Emoji más frecuestes


A diferencia de una imagen que se visualiza desde un archivo (.png, .gif o .jpg), un emoji se muestra utilizando un código Unicode. En la web esto se hace a menudo con el hexadecimal o representación decimal del carácter Unicode. Por ejemplo:

<span>&#9731;</span>

Puedes ver por tu navegador un Emoji sonriente pero si tu estas usando un lector de pantalla ni te enteraras , que esiste.El problema es que aparece en el código cómo <span>, la solución esta en el uso de WAI-ARIA, Utilice la ARIA role="img"

<span role="img">&#9731;</span>

A continuación, utiliza el aria-label:

 <span role="img" aria-label="Snowman">&#9731;</span>

martes, 27 de diciembre de 2016

Proyecto de smartphone EziSmart

Hace algunos años, la madre de Richard Chan tuvo un derrame cerebral y se convirtió en una discapacidad física. Ella vivía en Inglaterra, mientras el se encontraba en Noruega. Después de la carrera, se hizo difícil comunicarse por teléfono. En una ocasión se cayó, y yacía en el suelo durante varias horas, incapaz de pedir ayuda. Chan, que es ingeniero de telecomunicaciones, comenzó a preguntarse si había algún tipo de teléfono que podría hacer la comunicación más fácil y también hacer la vida de sus usuarios más facil. Puesto que no podía encontrar nada en el mercado, comenzó a trabajar en el desarrollo de un nuevo producto a sí mismo. En el verano de 2015, se puso en contacto SINTEF para averiguar si podrían estar interesados.El proyecto recibió financiación a través del sistema del fondo regional de investigación de Noruega, y un año después del lanzamiento del proyecto EziSmart, tiene un nuevo sistema que ha sido probado por numerosos usuarios, la mayoría de ellos ancianos, sino también las personas que son ciegas y el Parkinson.
teclado ampliado del ezismart


ezismart abierto y util


Los botones tienen un diseño ergonómico en forma de pequeños platillos, lo que los hace más fáciles de usar, incluso para las personas que puedan tener las manos temblorosas o problemas con las habilidades motoras.



Fuente: New supersmart phone makes communication easier for people with vision disabilities

viernes, 23 de diciembre de 2016

¿Por qué utilizar lang?

Estabá releyendo la entrada de la W3C sobre la necesidad de usar el lang en un documento HTML, este articulo es del 2014 (ya a llovido) pero viene bien repasar el motivo.

Identifying the language of your content allows you to automatically do a number of things, from changing the look and behavior of a page, to extracting information, to changing the way that an application works. Some language applications work at the level of the document as a whole, some work on appropriately labeled document fragments.

Lectores no son de texto
La información sobre el idioma ayuda a los sintetizadores de voz y traductores de Braille producir resultados útiles. Estas aplicaciones necesitan saber si pueden producir una salida del texto, o si tal vez tienen que cambiar a un modo de idioma diferente.

Traducción
Herramientas de traducción pueden utilizar los atributos del idioma para reconocer páginas o secciones de texto en un idioma determinado y ajustar automáticamente el proceso de flujo de trabajo.

La ortografía

Las herramientas pueden adaptarse ortográfica y gramatical basan en el idioma del contenido, o ignorar el contenido que no está en el idioma del corrector ortográfico. Esto puede mejorar significativamente la eficiencia durante la revisión ortográfica.

Selección de fuente

Agentes de usuario pueden (y lo hacen) utilizan la información de idioma para seleccionar las fuentes de idiomas apropiados, lo que mejora la experiencia del usuario de la página.



jueves, 22 de diciembre de 2016

Legible en los textos de las apps

En 2010, investigadores de la Universidad de Alberta encontraron que la comprensión de lectura se altera cuando el contenido se presenta en una pantalla de tamaño móvil frente a una pantalla de ordenador más grande. Una simple explicación para este resultado fue que, con una pequeña pantalla, los usuarios veían menos del texto, por lo que tuvieron que confiar más en su memoria para acceder a la información . En otras palabras, la pantalla  pequeña resultó más difícil pues tenias que memorizar.
El enlace anterior pertenece a un estudio del 2010, en un reciente estudio se a comprobado mejoría., la mejoría viene dada con la evolución de los dispositivos.

Las principales directrices para asegurar la legibilidad son:


  • Permiten a los usuarios cambiar el tamaño de la fuente.
  • Tener un alto contraste entre los caracteres y el fondo. Preferiblemente, emplear un fondo liso en lugar de uno con textura.
  • Use un tipo de letra limpia . Con monitores de alta resolución de hoy, el tipo serif está bien, pero las fuentes tienen formas extrañas (por ejemplo, emulando la escritura o el estilo gótico) han reducido la legibilidad.

martes, 20 de diciembre de 2016

Bookshare la biblioteca en línea accesible

El objetivo de la iniciativa Bookshare es hacer accesible la lectura a todo el mundo. Bookshare es la mayor biblioteca en línea accesible del mundo que sirve a más de 400.000 miembros con dificultades para leer . En Septiembre del 2016 se publico la noticia de 10 millones de descargar con la existencia de 460.000 titulos ,  Brian Meersma, miembro de Bookshare. "Empecé a usar Bookshare en la escuela media. El impacto fue impresionante. Podría completar las tareas por mi cuenta, mantenerse al día con mis compañeros de clase y realmente ser parte en la escuela. Ahora voy a la Universidad de Cornell y ayudar a otros a liberar el poder de Bookshare. Es mi esperanza de que todas las personas con discapacidad para la lectura como la dislexia son capaces de utilizar Bookshare para seguir en el aula y convertirse en aprendices de por vida ". Benetech.(empresa que lleva Bookshare) "Nuestra iniciativa Bookshare se centra en el uso de la tecnología para hacer que los individuos seguro de que no pueden leer letra estándar puede ejercer ese derecho. El hito de hoy es una celebración de lo que es posible cuando se utiliza la tecnología para el bien social ".

Listado de navegadores

Dillo:
 Este sencillo navegador saltó a la fama hace años por ser muy liviano y encajar perfectamente en distribuciones pues apenas necesita 128 Mb de ram. Sin embargo es un navegador web muy básico que no permite tener ningún complemento y sólo leerá los últimos estándares HTML. Lo malo de Dillo es que el proyecto está parado y las últimas tecnologías web no funcionan bien.

Ubuntu Browser
Ubuntu hace tiempo que lanzó su navegador web, un proyecto al que no ha dado mucha publicidad pero podemos decir que es un navegador web bastante interesante, útil y bonito a la vista. Este navegador es compatible con cualquier distribución basada en Ubuntu y soporta las últimas tecnologías web.

Epifanía
Es un sencillo pero potente navegador web desarrollado por la comunidad de GNOME. Sus principios son la sencillez y cumplimiento de las normas. La sencillez se consigue mediante una interfaz de usuario bien diseñada que integra estrechamente con el escritorio GNOME.

Tor Browser
Es una versión de Mozilla Firefox que se conecta con la Red Tor que además está configurada para la máxima seguridad en nuestra navegación web.

SeaMonkey
Es un navegador web que se basa en Mozilla Firefox pero que está orientado a equipos con menos recursos, sus complementos son menores y su potencia también, algo que hay que pagar por consumir menos recursos. Si realmente exigís poco a vuestro navegador web, SeaMonkey puede ser una gran opción, una opción ideal para equipos con pocos recursos.

Konqueror
Es un navegador web de código abierto que soporta los estándares web actuales.

Midori
Es un navegador web ligero  basado en WebEquipo. A menudo se utiliza con el entorno de escritorio Xfce.

lunes, 19 de diciembre de 2016

Pluging de WordPress para mejorar la accesibilidad

Logotipo de WordPress

WP Accesibilidad
Es el mejor plugin de WordPress referente a la accesibilidad, ofrece las mejores opciones. Ha sido desarrollado por Joe Dolson , un miembro del equipo accesible de WordPress. Corrige una serie de problemas de accesibilidad.
En la web se dicé:
Este plug-in ayuda con una variedad de problemas de accesibilidad comunes en temas de WordPress. Aunque la mayoría de los problemas de accesibilidad no pueden abordarse sin cambiar directamente el tema, WP Accesibilidad añade una serie de características de accesibilidad votos con una cantidad mínima de configuración o conocimiento experto.

WP YouTube Lyte
Si incrusta videos de YouTube en su sitio, WP YouTube Lyte hace más accesibles.

WP accesible Twitter RSS
Creado por Rian Rietveld , el WP accesible Feed de Twitter hace un Twitter  un poco más accesible.
El plug-in mostrará sus tweets, pero no mostrará respuesta / Retweet / botones favoritos, y hashtags

Este pluging es de pago y según dice la web.
  • Wraps radio, checkbox and list (repeater) fields in a fieldset.
  • Improves form validation by displaying an on-page message that describes how many errors there were in the page. The message contains a list of the form fields with the errors, a description of the error and a link to the field.
  • Adds aria-describedby attributes for date and website fields - providing clear instructions for screen reader users of what format is required for the field.
  • Adds aria-required='true' for required fields
  • Adds aria-describedby attributes for fields that have failed validation - providing clear instructions for screen reader users of what the field error is. Description used is the default validation message for the field, or if set, the validation message for the field.
  • Disables the Gravity Forms configured tabindex - this stops users from being able to tab between fields and on-page links.
  • Changes links in the form body, such as field descriptions or HTML fields, so they open in a new window. A title is added or appended to any existing title for screen reader users which reads 'this link will open in a new window'.
  • Improved file upload field - wrapped in field set, clearly identifies to screen reader users if any file size of file type restrictions have been set of the field.
  • Improved field instructions - if a description has been provided for the field, the field is 'described by' the description, using the aria-describedby attribute


WAI-ARIA para formularios


  • aria-autocomplete: Proporciona sugerencias para rellenar un formulario.
    • IN-LINE.Proporciona una sugerencia.
    • LIST. Proporciona una lista.
    • BOTH. Proporciona ambas opciones.
    • NONE.No se proporciona ningun tipo.
  • aria-checked: Indica el estado del elemento.
    • TRUE. el elemento esta marcado.
    • FALSE. El elemento no esta marcado.
    • MIXED.Indica los valores posibles.
    • UNDEFINED. el elemento no deja decir como esta.
  • aria-disabled.Indica que hay un elemento pero no se puede modificar..
    • VERDADERO/FALSO true/false
  • aria-expanded.Indica si el elemento esta expandido o contraído.
    • VERDADERO/FALSO true/false
      • Donde puede aparecer:
              • button
              • document
              • link
              • section
              • sectionhead
              • separator
              • window
  • aria-haspopup.El elemento tiene un menú contextual o en el menú de nivel inferior.( al activar una casilla aparece un menú.
    • VERDADERO/FALSO true/false
  • aria-invalid Los valores añadidos no son correctos
    • Valor simbolico.
  • aria-label. Es el mismo que el de aria-labelledby. Se proporciona al usuario un nombre reconocible del objeto
    • Si el texto de la etiqueta es visible en la pantalla, los autores DEBEN usar aria-labelledby y NO DEBEN utilizar aria-label.

viernes, 16 de diciembre de 2016

IBM Research Servicio Experimental

Según la web de IBM research Servicio Experimental es una herramienta que ayudará al desarrollo de tu web haciéndola más usable y accesible, el coste de este evaluador es de cerca de 500€, hay que tener en cuenta que en su desarrollo se han basado en la section 508 cabe recordar que es similar a las WCAG 2.0 pero es mas estricta y se aplica más que las WCAG 2.0 en europa.

jueves, 15 de diciembre de 2016

Encuesta sobre barreras arquitectónicas en el ambito urbano

El dia 2 de Diciembre se presento los resultados de la encuesta realizada por el defensor del pueblo sobre las barreras arquitectónicas en el entorno urbano, las conclusiones que han sacado.


  •  La mayoría de los encuestados no cree que su municipio tenga un nivel satisfactorio de accesibilidad, independientemente de su población.
  • Más de la mitad de los encuestados no han puesto en conocimiento de sus ayuntamientos las deficiencias detectadas. Respecto a los que sí habían llevado a cabo gestiones, la mayoría ha obtenido un resultado negativo, debido a la falta de contestación o la inexistencia de presupuesto.
  • Las principales dificultades y barreras que encuentran los encuestados en los itinerario peatonales se centran en los semáforos, inadecuada o deficiente señalización táctil, visual o acústica y tiempo de paso. También los cruces, debido a los comportamientos incívicos (coches, motos o bicicletas aparcados en zona de paso).
  •  En los parques y jardines de los municipios, las principales barreras se encuentran en las áreas de juego infantil debido a la carencia de elementos de juego accesible, al pavimento que dificulta el acceso con sillas y la inexistencia de bancos accesibles en las zonas de estancia.

imagen de parte del estudio sobre areas recreativas
tabla de falta de accesibilidad en areas recreativas

miércoles, 14 de diciembre de 2016

Yoigo,lo importante es vender

Con la llegada de las navidades se lanzan a la cliente de potenciales clientes pero se olvidan de un 10% de clientes, haste de comenzar en mi queja decir que no tengo nada contra esta compañia, mi intención es que si lo leen lo sepan y puedan corregirlo.
Web de Yoigo


Lo que más me llamó la atención fué el video, desde hace tiempo ya se sabe que YouTube inserta subtitulos automaticos y aunque falta una transcripción, existe un enlace.Lo que me llamó altamente fue el texto alternativo.

Enreda no es nada descriptivo veamos lo que dicen las pautas WCAG 2.0: 

1.2.3 Audiodescripción o Medio Alternativo (grabado): Se proporciona una alternativa para los medios tempodependientes o una audiodescripción para el contenido de vídeo grabado en los multimedia sincronizados, excepto cuando ese contenido es un contenido multimedia alternativo al texto y está claramente identificado como tal. (Nivel A)

1.2.5 Audiodescripción (grabado): Se proporciona una audiodescripción para todo el contenido de vídeo grabado dentro de contenido multimedia sincronizado. (Nivel AA)

1.2.8 Medio alternativo (grabado): Se proporciona una alternativa para los medios tempodependientes, tanto para todos los contenidos multimedia sincronizados grabados como para todos los medios de sólo vídeo grabado. (Nivel AAA)

Con esto demuestro que lo importante es coger cierto tipo de clientes otros sobramos.

martes, 13 de diciembre de 2016

Skype traduce las conversaciones de teléfonos fijos

la compañía anunció en un blog . Que con su nueva actualización, podrás ser capaz de llamar a la gente en todo el mundo y poder entenderse de forma instantánea - incluso si están utilizando el teléfono fijo.
Skype

Forma de activarlo

Con el software de Skype descargado y actualizado, todo lo que se necesita para hacer las llamadas internacionales y locales, es tener crédito suficiente o una suscripción completa-en el servicio. 
Los usuarios sólo necesitan  establecer el idioma y la herramienta se hará cargo del resto. La persona en el otro extremo de la línea escuchará un mensaje que indica que la llamada está siendo grabada y traducida a través del servicio.

Roku, lector de pantalla para televisores

A partir de este año final del 2016, hemos visto múltiples y rápidos desarrollos en las opciones disponibles para aquellos que desean accesibilidad porque son dependientes de herramientas del habla o con baja visión. Al comienzo, el Apple TV era la única. Luego entro en esa competencia Google  con Google Nexus, que en su forma fue una de las primeras empresas aparte de Apple para implementar un lector de pantalla estándar.
dispositivo Roku que hace de la televisión mas interactiva

También Amazon intento tener un lector de pantallas para las televiones.
A día de hoy tenemos otra opción llamada Rokus, se ofrecen en varias opciones pero si queremos tener la opción de lector de pantalla en nuestra televisión tenemos que optar por la gama alta de sus productos.

lunes, 12 de diciembre de 2016

Consejos simples para mejorar tu diseño UX

Cuando leo que el 77% de los usuarios borran la aplicación que han descargado por serles poco útil, me digo algo están haciendo mal y ese mal es que no se valora la accesibilidad ni la usabilidad por eso me he lanzado a dar unos simples pero útiles consejos.
Usuarios con varios mobiles


La accesibilidad es lo primero


Si usted está diseñando una aplicación o un sitio web para móviles, lo primero que se debe considerar es la accesibilidad. La gente usa el móvil porque es más rápido que un ordenador (es más cercano), identifica el propósito del producto las características de la aplicación o del sitio móvil deben ser inmediatamente evidente para los usuarios con el fin de minimizar la frustración.
Organiza los menús de forma limpia y sencilla posible para asegurar que los usuarios puedan encontrar lo que están buscando.


Ayuda y simplifica la vida al usuario


Si es posible, la incorporación procesos intuitivos.Además si es posible realiza un tutorial, es importante tener un FAQ y Ayuda zona de fácil situada para hacer frente a cualquier pregunta visitantes puedan tener.

Cuidado con formularios de registro.

Los formularios de registro abrasivos que aparecen inmediatamente después de la apertura de un sitio web o aplicación son uno de los mayores factores de disuasión para la interacción del usuario. La investigación ha demostrado que el 86% de los usuarios no les gusta formularios de registro, que sean lo más fácil posible. Acorta lo más que se pueda, tanto el número de entradas y el espacio que ocupa en la pantalla.y si es posible, utiliza un inicio de sesión con sociales.

Crea un fácil buscador

Los usuarios de móviles quieren información rápida.Un sitio móvil debe tener una función de búsqueda fácilmente visible en todas las páginas.La función de búsqueda también debe ser lo suficientemente inteligente como para tener en cuenta las faltas de ortografía, la creación de una buena función de búsqueda para el comercio electrónico puede ser clave, asegurando que los usuarios no tienen que buscar a través de productos para encontrar lo que están buscando. 


Cuidado con las modas.


Esto suena un poco tonto, pero es cierto. Por supuesto, las tendencias son muy populares, pero las tendencias son también una forma fácil caer en errores comunes de diseño UX . Tendencias como el carruseles o el desplazamiento pueden ser estéticamente atractivo, pero su producto no se debe centrar en la belleza.

Simplifica el contenido.


Si una aplicación móvil o sitio web está tratando de ofrecer lo que el usuario quiere de una manera eficiente, entonces la mejor manera de facilitar que esta sea a través de la simplificación de su contenido. Limitar el número de colores, fuentes y tamaños de fuente utilizados en la plataforma móvil de modo que el usuario no sienta abrumado

Ayuda a los usuarios lograr lo que quieren eliminando el desorden y el contenido innecesario. Del mismo modo, asegúrese de que los enlaces y las áreas interactivas están claramente identificados o identificables.

Prueba con usuarios regularmente


No hagas caso a lo que los usuarios quieren; prestar atención a lo que hacen. Si se analiza el comportamiento de los usuarios que interactúan con el producto, descubrirá donde las fallas en el diseño de UX 

domingo, 11 de diciembre de 2016

Barra para la accesibilidad DAT para documentos WORD

icono de word, barra DAT

La DAT es un menú de accesibilidad dedicado para Microsoft Word que hace que sea más rápido y fácill crear documentos accesibles. Un documento creado con la DAT también contiene los componentes esenciales necesarios para facilitar la conversión a PDF o HTML accesibles, la importancia de DAT viene dada por que la igualdad de acceso a la información, independientemente de su capacidad, es un derecho humano y es esencial para todas las personas que participan plenamente en la sociedad. A nivel mundial, hay más de mil millones de personas con discapacidad, y el número de personas con deterioro relacionado con la edad está creciendo rápidamente. Eso es un gran porcentaje de la población que puede necesitar utilizar diferentes herramientas y enfoques para tener acceso a los contenidos digitales.
Para descargar Dat tienes que visitar la web de visión australia, actualmente no esta disponible para MAC.

viernes, 9 de diciembre de 2016

Accesibilidad en app de noticias

Las aplicaciones de noticias tienen un propósito: darle una forma cómoda de leer las noticias. Sorprendente mente, varias aplicaciones populares de noticias no ofrecen ninguna configuración del texto o de las opciones de accesibilidad de texto.
Algunas aplicaciones de noticias tienen una gran accesibilidad texto.  New York Times (aplicación de Apple)y Noticias de aplicaciones de Apple son las mejores aplicaciones de noticias de las principales compañías de medios de comunicación y tecnología.
La aplicación NYT permite al usuario elegir entre establecer el tamaño del texto, o volver a la versión preestablecida.(que es la única aplicación que ofrece esta opción).


La aplicación de Apple fue una de las pocas aplicaciones que pone los botones de tamaño de texto en cada página del artículo, de manera que el usuario puede ajustar fácilmente la configuración sin excavar a través de los menús y submenús.

Otras aplicaciones de noticias, incluyendo los de las principales compañías de tecnología, fueron sorprendente mente inaccesible. Aparte de Apple, ninguna de las grandes empresas de tecnología ( Yahoo , Google , Microsoft ) ofreció ninguna accesibilidad tamaño del texto. Estas aplicaciones no permiten al usuario ajustar el tamaño del texto.

Facebook es algo así como un caso especial - que no tienen una aplicación de noticias en sí, sino la aplicación de Facebook es una gran fuente de noticias, y muchas personas consumen noticias dentro de esta aplicación. Al igual que la aplicación de Google Noticias, la aplicación de Facebook observa el ajuste de texto en todo el sistema cuando se mira en titulares / propagandas, el texto vuelve a la fija más pequeña..

jueves, 8 de diciembre de 2016

Formulario en Drupal 8 y la accesibilidad

evolución en el color del logo de Drupal

Un montón de organizaciones están trabajando duro para ver que sus productos y webs sean accesibles para sus visitantes y el personal de su empresa. Desafortunadamente, muchas organizaciones pasan por alto los muchos desafíos con los formularios web en línea.
Empresa que adoptaron Drupal 7 en el desarrollo de su web se benefician de tener etiquetas semánticas asociadas con sus formularios web automáticamente. Este es un problema grande, pero la comunidad Drupal hizo un esfuerzo hacia la accesibilidad .
Drupal 8 hace que los formularios web vallan más allá, añadiendo WAI-ARIA para proporcionar el marcado semántico adicional alrededor de un texto descriptivo. Estos elementos permiten  a Drupal 8 evitar el problema de los conjuntos de campos anidados, que eran inevitables en las versiones anteriores de Drupal.
El Equipo de accesibilidad no estaba satisfecho con mejorar semántica y con WAI-ARIA y se dio cuenta de que era necesario lo que hay que hacer para cumplir la directriz 3.3 del WCAG 2.0 AA, que establece que todos los usuarios tienen que:
  • Si has cometido un error, saber donde y cual.
  • Proporcionar una alternativa para corregirlo.
  • Contar con medidas de seguridad para evitar graves consecuencias graves por los errores.
Información sacada del articulo:Inline Form Errors - What They Are and Why they Matter del 5 de Diciembre del 2016

miércoles, 7 de diciembre de 2016

Asociación que"mira por la accesibilidad"

Estaba navegado por la web y he leido El Grupo El Corte Inglés ya tiene su primer Hipercor cien por cien accesible, según la certificación de la Fundación Shangri-La. Hasta hay todo muy bien pero me a entrado la curiosidad por ver quien a otorgado el sello de accesibilidad en este caso la  Fundación Shangri-La


portad de la web de Fundación Shangri-La

Lo primero que llamó a atención es la musica de fondo y me dije ¿una web que evalua la accesibilidad y pone musica al comienzo?, mal empezamos, es cierto que tiene un botón para para la reproducción pero una persona sorda que ve ese botón dirá ¿para que sirve?.

Botón de parar reprodución



Quise para completar mi andadura navegar por mi lector de pantalla pero me encontre con tres enlacers seguidos con el texto leer más y me pregunte ¿a donde va, a leer más el que?.
Lista de enlaces leer más
Antes de nada consideró que todo el mundo tiene derecho a ganarse la vida pero no acosta de reírse de otros y encima discapacitados, es cierto que es una fundación sin animo de lucro pero ya que lo hacen que ayuden no engañen.

Sellos para atestiguar la accesibilidad web





Diez directrices para mejorar la usabilidad y la accesibilidad de su sitio

Es un articulo antiguo del 2015 pero muy necesario de recordar Ten Guidelines To Improve The Usability And Accessibility Of Your Site, te recuerdo que la accesibilidad y la usabilidad  van unidas.
la accesibilidad y usabilidad unidas en unos circulos

A pesar de sus diferencias , usabilidad y accesibilidad a veces van mano a mano. El Consorcio de la World Wide Web define la accesibilidad como "la experiencia de usuario que es similar para las personas que sufrén discapacidad con las que no, incluidas las personas con discapacidades relacionadas con la edad", mientras que la usabilidad se define como el "diseño de productos para ser eficaz, eficiente y satisfactorio para los usuarios".

1. Incluir un mapa del sitio;Un mapa del sitio es una gran manera de aumentar la usabilidad y la accesibilidad de su sitio web.Un mapa del sitio es también una gran manera para hacer frente a los requisitos de accesibilidad de los contenidos del Wide Web Consortium Mundial de las Directrices de Accesibilidad (WCAG 2.0, criterios de éxito 2.4.5 ).
2. Colocar los menús y submenús en los lugares donde los usuarios esperan encontrar ellos en su página web.
3. Validar tus páginas y hojas de estilo
4. Revise su página web usando las Herramientas de evaluación automatizada de Accesibilidad
5. Uso de formato HTML para proporcionar información 
6. Incluir texto alternativo para todas las imágenes y gráficos 
7. Probar sus páginas con un teclado
8. Proporcionar subtítulos para el vídeo
9. Proporcionar transcripciones de los medios de comunicación
10. Probar sus páginas en un dispositivo móvil


La inspiración para este artículo: del Consorcio de la World Wide Web Accesibilidad y usabilidad web que van juntas .

Los avances en 2017 de Microsoft referidos a la acccesibilidad

El 2 de Diciembre del 2016 se publico en el blog de Microsoft el articulo Making Microsoft products more accessible: What to expect in 2017 en él se indica las mejoras en materia de accesibilidad que se espera para sus productos.
Avances de Microsoft para 2017


Windows 10 y Narrador


  •  Soporte beta para la entrada y salida de braille. 
  • Los usuarios pronto podrán instalar Windows 10  a través Narrador.
  • Se cambia las teclas rápidas utilizadas para poner en marcha el Narrador.
  • Se han añadido más de 10 voces
  • Mejora de la experiencia de audio
  • Se añaden características para que sea más fácil de entender el contexto de un control con el que se está interactuando.
  • Se ha añadido la posibilidad de ajustar el tono y la velocidad de la voz en Xbox Narrador.
  • Más fácil la navegación web con Edge.


Office 365

  • Se hará que las plantillas sean más accesibles para ayudarte a empezar, por lo que sera más fácil de insertar descripciones de texto alternativo para las imágenes y nombres de visualización significativas para los hipervínculos, así como hacer el comprobador de accesibilidad disponible en varias aplicaciones de Office.
  • Controles incorporados para la personalización de experiencias de lectura.
  • Se mejorara la accesibilidad en los contenidos en la nube.

WAI-ARIA para la estructura del contenido

Siempre he pensado y mantengo que antes de usar las etiquetas WAI-ARIA es preferible tener el código HTML bien estructurado y luego enriquecerlo con las etiquetas de WAI-ARIA, aqui dejo una serie de etiquetas que uso para enriquecer el contenido.


article.Texto que forma una parte independiente de un documento, página o sitio.
columnheader. Celda que contiene información de la pagina.
definition. Definición de un termino.
directory. Tabla estática de contenidos.
document. Región donde viene el contenido o la información principal de la web.
group. Conjunto de interfaces.
heading.Encabezado de la web.
img. Parte o trozo que contiene una imagen.
list.. Un grupo de elementos de la lista no interactivos.
math.  Expresa un formula matemática.
note Trozo que es aparte de la página principal.
presentation.Un elemento cuya función implícita nativa semántica no será asignada a la accesibilidad API .
region. Zona es lo suficientemente importante como para ser incluido en un resumen de una página o tabla de contenidos, por ejemplo, un área de la página que contiene estadísticas de eventos deportivos en directo.
row Elemento de un tabla.
rowgroup Varios elementos de una fila en una tabla.
rowheader Información de cabecera de celda que contiene una fila en una cuadrícula.
separator Un divisor que separa y distingue secciones de contenido o grupos de elementos del menú.
toolbar. Una colección de botones o controles representados en forma visual compacta de funciones de uso común.




martes, 6 de diciembre de 2016

Web del congreso 6/12/2016

web del congreso de los diputados

Hoy se celebra el día de la constitución y aún sigue siendo inaccesible la web de el congreso, se tiene que recordar que esta web tendría que ser accesible, no solo por la ley sino por poder conocer los ciudadanos el funcionamiento. La verdad es curioso el gasto que se realiza para aparentar que España es moderna y tiene asentada la legislación y lo primero que te encuentras es una web obsoleta,la verdad en el resto del mundo se tiene que estar riendo de nosotros.

jueves, 1 de diciembre de 2016

Hacerse miembro de wA11y y pluging de WordPress

wA11y es una iniciativa para contribuir a la accesibilidad web, proporcionando información, la educación, los recursos y herramientas.
"A11y" es la abreviatura utilizada comúnmente para la accesibilidad, ya que hay once letras entre la "a" y la "y".
Un buen consejo es que te hagas miembro de esta comunidad,asi estaras enterado de los últimos avances en accesibilidad.
También  te recomiendo que si eres un usuario de WordPress te descarges el pluging de wA11y, enel existen una serie de herramientas que te ayudaran en su desarrollo orientado a la accesibilidad.

miércoles, 30 de noviembre de 2016

Proyecto Toyota Blaid

En 1944, el Dr. Richard Hoover, un médico del Hospital Valle del Ejército Forge, quería encontrar una manera de ayudar a los soldados ciegos. Desarrolló un largo bastón blanco y ligero que fue cortado a una longitud determinada de acuerdo a la altura del usuario.con ese simple instrumento los soldados ciegos podían moverse a través de los edificios sin chocar con las paredes.

La tecnología que mejora el acceso de las personas con discapacidad visual no ha evolucionado mucho desde entonces

Toyota Proyecto Blaid es uno proyecto para las personas que sufrén esa discapacidad. Se trata de una camara montada en el hombro diseñada para ayudar a las personas ciegas y deficientes visuales a navegar por espacios interiores. Se utiliza una cámara para inspeccionar la zona e informar al usuario acerca de sus alrededores.

Aplicación de Microsoft para ayudar a las personas daltonicas

Según los ultimos facilitados el 8% de la población mundial sufrén un leve defecto de visión, existén en el mercado gafas para ayudarte a solucionar esta deficiencia al daltonismo, los ingenieros de software y Tom Overton Tingting Zhu crearon la app los prismáticos de color , una aplicación para iPhone creadada por Microsoft  que utiliza la cámara del teléfono para aplicar un filtro. El filtro aumenta el contraste entre dos colores especiales y difíciles de distinguir o ajusta una imagen para que los colores son más fáciles de distinguir, tales como el ajuste de los rojos de rosas para las personas con ceguera al color rojo-verde

aplicación los prismaticos del color

HTML y accesibilidad

Leyendo el articulo HTML: A good basis for accessibility de organización Mozilla descubrirás lo importante que es crear un código HTML bien estructurado a continuación te señalo tres razones por las que tienes que crear tu código HTML bien escrito.


  • Se obtiene algunas funciones de forma gratuita, además de que es sin duda más fácil de entender.
  • La buena semantica hace que el archivo sea más ligero y tarde menos en cargar.
  • Bueno para SEO - los motores de búsqueda dan más importancia a las palabras clave dentro de los encabezados, enlaces, etc.,  por lo que sus documentos serán más fáciles de encontrar por los clientes.
 La verdad me he encontrado con  casos en el que la gente hace cosas muy extrañas con el formato HTML. Algunos abusos de HTML se deben a prácticas antiguas que no han sido completamente olvidados, y algunos son simplemente por  ignorancia. En cualquier caso, se debe reemplazar dicho código mal, siempre que pueda.
Habló de tener una buena estructura en HTML pero no se le tiene que olvidar el lenguaje léxico, este también puede afectar a la accesibilidad. En general, usted debe usar un lenguaje claro que no sea demasiado complejo, y no utilice términos de la jerga o argot innecesarios. Esto no sólo beneficia a las personas con discapacidades cognitivas sino de cualquier tipo.

Ejemplo de código HTML bien estructurado

<h1>My heading</h1>

<p>This is the first section of my document.</p>

<p>I'll add another paragraph here too.</p>

<ol>
  <li>Here is</li>
  <li>a list for</li>
  <li>you to read</li>
</ol>

<h2>My subheading</h2>

<p>This is the first subsection of my document. I'd love people to be able to find this content!</p>

<h2>My 2nd subheading</h2>

<p>This is the second subsection of my content. I think is more interesting than the last one.</p>

martes, 29 de noviembre de 2016

CSS , JAVASCRIPT y la accesibilidad

CSS y JavaScript, cuando se utilizan correctamente,  tienen el potencial para permitir que las webs seán accesibles ... o pueden perjudicar seriamente la accesibilidad si son utilizadas mal.

CSS

Antes de nada tenemos que partir de un documento en HTML bien estructurado. A modo de ejemplo, un usuario de lector de pantalla no se puede navegar si el desarrollador no ha utilizado elementos de encabezado para el marcado de los contenidos. La regla de oro es que la estructura HTML esté bien formada  y luego con CSS dar formato.

<h1>Heading</h1>

<p>Paragraph</p>

<ul>
  <li>My list</li>
  <li>has two items.</li>
</ul>C SS
h1 {
  font-size: 5rem;
}

p, li {
  line-height: 1.5;
  font-size: 1.6rem;
}
JavaScript moderno es un lenguaje de gran alcance, y podemos hacer mucho con el en estos días, de interfaz de usuario a los juegos en 2D y 3D. No hay una regla que dice que todo el contenido tiene que ser 100% accesible a todas las personas - sólo tiene que hacer todo lo posible, y hacer que sus aplicaciones lo más accesible posible.
El problema viene a menudo cuando las personas se basan en JavaScript demasiado. A veces verás una página web en la que todo se ha hecho con JavaScript - el HTML ha sido generado por JavaScript, el Stlying CSS ha sido generada por JavaScript, etc. Esto quita todo tipo de accesibilidad por lo que es no se recomienda.

lunes, 28 de noviembre de 2016

Webs de accesibilidad

Empresas de telefonia, software, entretenimiento,compras on-line que tienen en su web una seccion reservada a la accesibilidad de sus productos.

  • Android Accessibility Help
    • Lector de pantalla (TalkBack):
    • Accesibilidad mediante interruptores: esta función te permite controlar el dispositivo mediante uno o varios interruptores. (Se incluye en Android 5.0 y versiones posteriores)
    • Acceso por Voz.
    • Compatibilidad braille (BrailleBack): BrailleBack es un servicio de accesibilidad complementario que te permite conectar una pantalla braille a tu dispositivo Android a través de Bluetooth. 

domingo, 27 de noviembre de 2016

En caso de duda, siempre subtítulo.

El video está en todas partes. Está en nuestros televisores, ordenadores portátiles, tabletas, teléfonos móviles y más! Y, a menudo, la gente está viendo vídeos en entornos donde no pueden tener el audio en,  el metro, bibliotecas, oficinas, o en las aulas, los subtítulos abiertos ahora están siendo utilizados por los creadores de contenidos para captar la atención del espectador.
El uso prominente de los subtítulos abiertos es una noticia fantástica para los sectores que trabajan en políticas de discapacidad, ya que este fenómeno está haciendo que los vídeos sean más accesibles a las personas sordas o con problemas de audición.


TIPOS


Los subtítulos ocultos son el texto en pantalla que describe todos los sonidos (diálogo, efectos de sonido y música) en la película que se puede desactivar. Los títulos fueron creados para los espectadores sordos o con problemas de audición. En los reproductores de vídeo más populares, como YouTube o Vimeo, encontrará un botón "CC", que le permite activar los subtítulos (CC).

Los subtítulos abiertos son los mismos que los subtítulos, pero no se puede apagar.

FORMATO


No hay una práctica estandarizada a nivel  internacional para el formato de subtítulos en los vídeos


COLOCACIÓN


 La ubicación central inferior es la práctica más común para los subtítulos, pero para los subtítulos abiertos que tienen más libertad para sobre dónde colocar el texto,YouTube coloca automáticamente los subtítulos en la parte inferior central de la pantalla.

Tutorial en ingles para insertar subtitulos


COLOR DE FUENTE


Sólo asegúrese de que es fácil de leer. Algunos colores son difíciles de leer en contra de ciertos fondos. Para asegurarse de que sus colores cumplen con las normas de accesibilidad, puede utilizar color contraste corrector.( enlace a blog de Miguel cobo).


FUENTE


Se puede utilizar cualquier fuente que desee, siempre y cuando sea fácil de leer. Sin embargo, muchos médicos recomiendan apegarse a un estilo de fuente sans serif, como Arial, Calibri, Helvetica, Tahoma o Verdana, ya que son más fáciles de leer. Las fuentes serif suelen tener pequeñas líneas detalladas al final de por lo que es más complicado y cansado para el ojo.

Recuerde, lo más importante, la gente quiere entender lo que está pasando en el video cuando leen los subtítulos. 


SONIDO


la banda sonora de un vídeo, excluyendo el diálogo hablado. Los sonidos no vocales son importantes porque a menudo contienen información acerca de trama, los personajes y las emociones que no son accesibles a las personas sordas si no se indican. Si los sonidos no son importantes para su historia, no es necesario que muestre texto.


Música

En un video musical, ¿tengo que tener los subtítulos? ¡por supuesto!la  leyenda de la música podría ser algo como esto:

La introducción de la canción: [Celine Dion canta "My Heart Will Go On"]


IDENTIFICACIÓN DEL HABLANTE


Es importante que los espectadores sepan quién está hablando, si se trata de el narrador, un  periodista, o entrevistado. 

Cuando alguien habla primero, es necesario introducirlo mediante la inclusión de su nombre.

Si no conoce el título de la canción sólo debes identificar el estilo entre paréntesis:  [violín lenta]

Si hay letras, la subtitulación  recomendada es el uso de un icono de nota musical al principio y al final de cada linea.

IDIOMA O ÉNFASIS


Para indicar una lengua extranjera colocar texto en minúsculas y poner entre paréntesis.


EFECTOS SONOROS


La forma más común para indicar un efecto de sonido en la pantalla es colocar el sonido o la fuente del sonido entre paréntesis, así:


  • [perro ladrando]
  • [Timbre del teléfono]
  • [trueno]


Información sacada de  Cómo dar formato a su vídeo leyendas