Los sitios web accesibles nos benefician a todos: resumen con consejos prácticos

Johannes Mairhofer Última actualización 08.05.2020
6 min.
Sitio web accesible

Los sitios web accesibles ya no son un supuesto tema de nicho para las personas con discapacidad. Nos concierne a todos e incluso ayuda a los aficionados al SEO entre ustedes - una visión general con consejos prácticos de Johannes Mairhofer.

La accesibilidad en el espacio digital es, en realidad, una parte integral de Internet y ya está recogida en sus directrices normalizadas. Y, por supuesto, también desempeña un papel importante en el Códice WordPress . Todos los usuarios deben poder utilizar WordPress , independientemente de la lengua que hablen, la situación económica que tengan o las limitaciones físicas que padezcan. Sin embargo, el tema aún no recibe la atención que merece. Sin embargo, en vista del desarrollo demográfico y de la voluntad de inclusión, hay que tener en cuenta la barrera digital con los proyectos de WordPress -WordPress - significa Johannes Mairhofer. Porque: la accesibilidad también es importante desde el punto de vista empresarial y de SEO.

La idea de un sitio web accesible no es nueva

Para estandarizar las técnicas de la World Wide Web, en 1994 se fundó el World Wide Web Consortium, o W3C. Las normas más importantes son las siguientes:

  • HTML (sigue siendo la estructura básica de casi todos los sitios web)
  • CSS (hojas de estilo en cascada, por ejemplo, utilizadas en las plantillas de WordPress )
  • WCAG (Directrices de Accesibilidad al Contenido en la Web)

Las directrices WCAG son desarrolladas por la Iniciativa de Accesibilidad Web (WAI), que a su vez es un grupo del W3C. Ahora hay dos versiones aquí.

WCAG 1.0

  • Utilización de marcas y hojas de estilo
  • Diseño independiente del dispositivo

WCAG 2.0

Los sitios web deben

  • Perceptible (por ejemplo, alternativas de texto para las imágenes)
  • Operable (por ejemplo, controlable mediante el teclado)
  • Comprensible (por ejemplo, mediante un lenguaje fácil)
  • Robustos (compatibles)

ser.

La idea de un sitio web sin barreras no es, por tanto, nueva e incluso está anclada en la Ordenanza sobre Tecnologías de la Información sin Barreras (BITV) desde 2002. Esto significa que al menos los sitios web de las autoridades públicas están obligados a ofrecer contenidos sin barreras.

Especialmente para los nuevos proyectos de WordPress : un sitio web sin barreras puede implementarse con muy poco esfuerzo.

¿Cómo debe implantarse un sitio web sin barreras? Muchos puntos no son tan complicados como se cree y pueden aplicarse sin mucho esfuerzo.

Por supuesto, esto es más fácil con un sitio recién creado y diseñado. Pero también los sitios web ya existentes pueden ser optimizados posteriormente. Hay que seguir algunas reglas básicas sencillas.

1) Utilizar correctamente el título de la página, la navegación y las etiquetas

El título de sitio está realmente en el título y los encabezados están estructurados de forma lógica y también formateados como encabezados, no sólo en negrita. Las enumeraciones se realizan con viñetas o puntos, no con un simple trazo de menos. En WordPress esto se puede especificar directamente en el editor. Dependiendo de la plantilla y del editor utilizado, hay varias clases de encabezados disponibles aquí. Mediante el uso de etiquetas (por ejemplo, H1 y H2 para los títulos), la página sitio puede ser más fácil de experimentar y navegar para las personas ciegas que utilizan un lector de pantalla o un teclado.

Sitio web accesible: Listentag
Cabeza de página web accesible
Extractos del editor de texto para este post: Arriba puede ver que las listas con viñetas han sido definidas como tales. También los subtítulos se definen como H3.

2) Prescindir de JavaScript y Flash en el diseño

Para el diseño es mejor utilizar HTML y CSS. No se debe utilizar Javascript ni Flash. Javascript, como su nombre indica, es un lenguaje de scripting. Independientemente del hecho de que sea inseguro, no todos los dispositivos y navegadores pueden manejar el código. Dado que el sitio web debe estar disponible en el mayor número de dispositivos posible, no se recomienda el uso de Javascript.

3) Separar contenido y diseño

El contenido (texto) y el diseño (maquetación) deben considerarse completamente independientes. Mediante diferentes variantes de CSS, por ejemplo, se puede ajustar el contraste de la sitio o cambiar los colores con un simple clic del usuario. Esto puede ayudar a las personas con deficiencias visuales o daltonismo. Esto también lo hacen grandes empresas como Pfizer.

En principio, esto ya se hace automáticamente en WordPress . Por ejemplo, también se puede modificar una plantilla sin tener que cambiar el contenido. Si se accede al sitio web con un smartphone o una tableta, el diseño también se adapta automáticamente.

4) Observar el principio de los dos sentidos

El contenido debe prepararse de manera que pueda ser percibido por dos sentidos diferentes. De esta manera, el sitio web puede ser experimentado por el mayor número de personas posible sin mucho esfuerzo. Esto puede lograrse, por ejemplo, con las siguientes medidas:

  • Añadir la descripción de la imagen a las imágenes (se puede hacer directamente a través del editor WordPress )
  • Añadir subtítulos a los vídeos (por ejemplo, Youtube lo hace automáticamente)
  • Estructurar el texto con títulos (puede hacerse en el editor)

Mi consejo para entender mejor un sitio web accesible: adquiera usted mismo la experiencia

En teoría, el tema no siempre es tan fácil de entender. Hablé con Heiko Kunert, Director General de la Asociación de Ciegos y Deficientes Visuales, sobre los sitios web sin barreras. Heiko es ciego y navega por la red con un lector de pantalla. Heiko comparte sus experiencias con los sitios web y las redes sociales y nos cuenta cómo navega por la web con su smartphone y una pantalla en braille.

Muchas de las cosas que se tratan aquí teóricamente también se pueden probar por uno mismo sin mucho esfuerzo. Así puede hacerse una idea de cómo se percibe realmente tu sitio .

accesibilidad-sitio-web-lectura-braille
Una línea braille - Fuente: Wikimedia Commons. Licencia: https://creativecommons.org/licenses/by-sa/3.0/

El lector de pantalla y la visualización en braille son las dos ayudas a la navegación más comunes

Un lector de pantalla es un software que reconoce el texto y lo lee en voz alta. Por ello, para navegar por las páginas web y los documentos, es importante utilizar etiquetas para los títulos y las imágenes. Esto permite a los usuarios navegar por la página web con un lector de pantalla y un teclado o una pantalla Braille.

Una variante de lector de pantalla es, por ejemplo, NVDA. Esta variante es software libre y gratis . Recomiendo probarlo una vez y llamar a la propia página web con el monitor apagado e intentar navegar por los menús.

Una pantalla Braille traduce la línea actual de la pantalla en Braille. Esta línea es un hardware real que está conectado al ordenador. La pantalla braille funciona en combinación con un lector de pantalla.

La capacidad de respuesta es lo más importante para un sitio web accesible

Ordenadores, portátiles, smartphones, tabletas, smartwatches y navegadores de texto. El número de dispositivos que pueden utilizarse para acceder a un sitio web es enorme. Uno de los puntos importantes de las WCAG 2.0 es la disponibilidad del sitio web en el mayor número de dispositivos posible.

La mayoría de las plantillas de WordPress son ahora más o menos responsivas y permiten el acceso al sitio web al menos en el ordenador y el smartphone. Dependiendo de la plantilla, por ejemplo, se adaptan los menús, se muestran y ocultan las barras laterales, pero también se adaptan completamente los diseños. Esto se llama diseño web responsivo. Acceder a su propio sitio web en un dispositivo diferente es fácil y revelador.

La red es genial. Y la red es para todos.

La red y la disponibilidad permanente ya no es un territorio nuevo, pero desde el punto de vista de una generación sigue siendo nuevo. La generación de los actuales treintañeros, pero a más tardar las siguientes, están acostumbrados a saber que la red está disponible siempre y en todas partes. No queremos prescindir de las posibilidades de información y comunicación que aporta la red, incluso en la vejez.

Por tanto, la necesidad de sitios web accesibles es cada vez mayor y crece de año en año. Con la ayuda de las posibilidades disponibles y de las herramientas integradas en WordPress (por ejemplo, descripción de imágenes, encabezamientos, CSS) es posible hacer sitios web al menos sin barreras sin mucho esfuerzo.

El hecho de que esto sea cada vez más importante también puede verse en el hecho de que cada vez más grandes empresas dan más valor a la participación digital. Además del ejemplo mencionado de Pfizer, Twitter, por ejemplo, ofrece desde hace tiempo la posibilidad de añadir una descripción de la imagen a las imágenes, Microsoft está tratando ampliamente el tema y muchos otros están siguiendo poco a poco su ejemplo. Aquí se puede encontrar un resumen detallado de los sitios web accesibles positivos, por ejemplo.

En última instancia, un sitio web accesible también es mejor para Google

Desgraciadamente, experimento con demasiada frecuencia que el SEO es más importante que el buen contenido, por lo que no soy un gran fan de los argumentos SEO. Pero si las páginas web pueden ser mejor leídas e interpretadas por los lectores de pantalla, también es más fácil para el bot de Google clasificar correctamente las visitas a sitio .

Sólo WordPress permite que ya sea muy rápido y fácil crear un sitio web sin barreras en un 80% aproximadamente.

Todavía queda un largo camino para llegar al 100% de accesibilidad. Y eso es probablemente inviable para muchas pequeñas empresas y blogs privados. Pero con las posibilidades que ofrece WordPress es fácil conseguir un 80% de accesibilidad.

Mediante el uso de etiquetas para los titulares y las imágenes y, sobre todo, la descripción de las imágenes, ya se consigue mucho con poco beneficio. Una vez que el propio sitio web con un navegador de texto para navegar da una idea de lo que los tornillos deben y todavía se puede girar.

Quien dirige sitio para una empresa siempre hace bien en hacer que lo prueben personas ciegas para obtener opiniones y consejos profesionales.

Johannes es muy curioso y ya ha alcanzado varias etapas en su carrera profesional. Desde especialista en informática hasta fotógrafo independiente, es un trabajador versátil capaz de ver desde las lentes de sus clientes. Hoy en día trabaja como fotógrafo independiente y como asesor en temas relacionados con el mundo WordPress y la fotografía. [Foto: Dennis Weißmantel]

Artículos relacionados

Comentarios sobre este artículo

Escribe un comentario

La dirección de correo electrónicotu no se publicará. Los campos obligatorios están marcados con *.