Así que has oído hablar mucho de algo llamado accesibilidad. Tal vez incluso haya oído hablar de personas que demandan a grandes empresas por brindar servicios inaccesibles. Pero, ¿sabes exactamente lo que significa accesibilidad?
Afortunadamente, la accesibilidad no es demasiado difícil de entender o implementar, una vez que te comprometes con ella. Una vez que haya aprendido qué es la accesibilidad, puede poner en práctica esa teoría escribiendo aplicaciones Vue.js accesibles.
¿Qué es la accesibilidad?
La accesibilidad es una palabra de moda popular en la web, pero ¿qué significa exactamente? Resulta que el nombre es bastante descriptivo. La accesibilidad es simplemente una medida de cuán usable es una aplicación web para todo tipo de personas.
No todos experimentan la web de la misma manera. Algunas personas tienen deficiencias que pueden afectar su audición o su vista. Algunos no pueden acceder a hardware moderno o a Internet de alta velocidad, y las personas a menudo necesitan usar la web en condiciones menos que ideales. La accesibilidad se trata de asegurarse de que todas esas personas puedan seguir usando una aplicación web de la mejor manera posible.
¿Por qué es importante la accesibilidad?
La accesibilidad es importante porque cuando una aplicación es altamente accesible, puede servir a tantas personas como sea posible. Cuando alguien brinda un servicio o información en un sitio web, su objetivo es que otras personas usen ese servicio o lean esa información.
La optimización de la accesibilidad garantiza que el menor número posible de personas no pueda utilizar la aplicación web. Además, las aplicaciones web que son más accesibles generalmente se clasifican más alto en los resultados de búsqueda. Esto permite que incluso más personas encuentren y utilicen aplicaciones web más accesibles.
Errores comunes de los desarrolladores que perjudican la accesibilidad
Muchas aplicaciones web son menos accesibles de lo que podrían ser. Esto suele ser el resultado de errores por parte de quienes los construyeron. Algunos errores comunes de accesibilidad que cometen los desarrolladores al crear aplicaciones son:
Uso de bibliotecas inaccesibles
Puede confiar en bibliotecas de terceros para ahorrar tiempo y esfuerzo al desarrollar sus aplicaciones. Desafortunadamente, no todas las bibliotecas se toman en serio la accesibilidad y puede ser difícil identificar las buenas. Es fácil terminar reduciendo accidentalmente la accesibilidad de sus aplicaciones de esta manera.
Descuidar HTML semántico al construir componentes
El HTML semántico es HTML cuyo significado, así como su estructura, es correcto. Cada etiqueta HTML tiene un propósito inherente, que la tecnología de asistencia utiliza para inferir el significado de su contenido. Por ejemplo, la etiqueta de encabezado marca el encabezado de un sitio web. Un lector de pantalla debería poder anunciar que cualquier cosa dentro de una etiqueta de encabezado es un encabezado de sitio web.
Desafortunadamente, nada le impide usar una etiqueta para el propósito equivocado. Otro ejemplo común es el uso de una etiqueta de botón para actuar como un enlace, o viceversa.
Escribir HTML de esta manera daña la accesibilidad, porque la tecnología de asistencia ya no puede estar segura del propósito de ningún elemento HTML. Puede terminar produciendo resultados confusos o frustrantes para los usuarios de la tecnología. Para máxima accesibilidad, siempre debe escribir HTML semántico, incluso si eso significa un poco más de trabajo.
No probar la accesibilidad
La creación de una aplicación web a menudo puede ser una tarea ardua con plazos exigentes. Entre la prisa por terminar las funciones y la carga de probar otros aspectos del software, las pruebas de accesibilidad pasan a un segundo plano. Es posible que tenga la tentación de implementar una aplicación en producción antes de probarla para detectar problemas de accesibilidad.
¿Por qué? La prueba requiere tiempo y puede requerir cambios extensos en el código de la aplicación. Pero probando una aplicación web es una parte indispensable del proceso de desarrollo. Debe probar la accesibilidad de su aplicación con el mismo rigor que cualquier otro aspecto.
Afortunadamente, existen herramientas para ayudar a resolver estos problemas. Las siguientes cinco herramientas pueden ayudarlo a escribir aplicaciones Vue.js más accesibles:
WAVE es una colección de herramientas que ayuda a los desarrolladores a probar automáticamente sus aplicaciones en busca de problemas de accesibilidad. Si bien WAVE no es un sustituto de las pruebas del usuario final, aún puede ayudarlo a detectar muchos problemas de accesibilidad.
WAVE proporciona una herramienta de prueba en línea en su sitio web. También ofrece extensiones de navegador y varias otras herramientas para ayudar con las pruebas de accesibilidad para muchos tipos de aplicaciones web.
Muchas de las señales que usan las aplicaciones web para comunicar la actividad, como las barras de progreso y los indicadores de carga, son puramente visuales. Las personas con discapacidad visual o las que utilizan lectores de pantalla no pueden percibirlas.
Vue-announcer es una biblioteca que le permite anunciar cambios en sus aplicaciones Vue.js de manera que todos puedan acceder.
Vue-skip-to es una biblioteca creada para permitir que las personas que usan un lector de pantalla salten directamente al contenido principal de una aplicación Vue.js. Esto es útil porque muchas aplicaciones web tienen enlaces de navegación y otros elementos antes del contenido principal. Estos son fáciles de omitir para algunos usuarios, pero pueden ser problemáticos y frustrantes de usar con un lector de pantalla.
ESLint es una herramienta que lo ayuda a escribir mejor JavaScript al analizar su código y verificar si hay errores.
Esta herramienta es un complemento de ESLint que lo ayuda a garantizar que la estructura de sus componentes de Vue.js se ajuste a las reglas de accesibilidad.
Cuando está instalado, este complemento analiza todos los archivos Vue.js y señala el código problemático. Luego puede maximizar la accesibilidad mientras escribe sus aplicaciones, en lugar de tener que cambiar el código después de la fase de prueba.
Una gran fuente de problemas de accesibilidad en las aplicaciones es el uso de bibliotecas de componentes inaccesibles. Vuetensils es una biblioteca de componentes Vue.js.
Estos componentes están optimizados para un tamaño mínimo, máxima accesibilidad, facilidad de uso y facilidad de estilo. Puede ahorrar tiempo y usar estos componentes preconstruidos sin dañar la accesibilidad de sus aplicaciones.
La accesibilidad en Vue.js es fácil
La accesibilidad se trata de asegurarse de que todos puedan usar su aplicación en cualquier contexto. Maximizar la accesibilidad es importante para asegurarse de que una aplicación pueda ser utilizada por tantas personas como sea posible.
Los desarrolladores a menudo cometen errores de accesibilidad comunes pero evitables al crear sus aplicaciones. Los problemas comunes incluyen no probar y escribir HTML no semántico. Pero con la ayuda de algunas herramientas, es más fácil escribir aplicaciones Vue.js altamente accesibles.
