Accesibilidad en una web de servicios: qué revisar antes y después de publicar

Una web puede verse elegante en el ordenador de quien la diseñó y resultar difícil de utilizar para otra persona. El texto puede perderse sobre una fotografía, el menú puede depender del ratón o el formulario puede señalar un error únicamente con un cambio de color. La accesibilidad consiste en identificar y reducir barreras que impiden comprender el contenido o completar una tarea.

Para un negocio de servicios, esas tareas suelen ser sencillas de nombrar: entender la oferta, consultar un proyecto, encontrar información práctica y contactar. Esa claridad ayuda a organizar la revisión. No necesitas empezar por una lista interminable de tecnicismos; necesitas saber qué debería poder hacer una persona y comprobar qué obstáculos encuentra en el recorrido.

Esta guía es una orientación para preparar un encargo y una primera revisión. No certifica conformidad con una norma ni determina obligaciones legales, que dependen del contexto y requieren una evaluación específica. Las comprobaciones iniciales pueden descubrir problemas importantes, pero no sustituyen una auditoría completa ni la participación de personas con distintas necesidades de acceso.

La accesibilidad empieza en el contenido

Un servicio descrito con palabras ambiguas puede ser difícil de entender aunque la página funcione perfectamente con teclado. Explica qué haces, qué incluye y qué paso debe dar el lector. La claridad del contenido permite que más personas se orienten sin depender de conocimientos previos sobre el sector.

Los títulos ayudan a localizar información y a comprender la relación entre apartados. No deberían elegirse solo por su aspecto. Una página necesita una estructura coherente que se conserve más allá del tamaño visual de las letras. Si un encabezado aparece como título por diseño, el equipo debe comprobar que también está marcado como tal cuando corresponde.

Los enlaces necesitan describir su destino o su función dentro del contexto. Varias apariciones de «aquí» o «más» pueden resultar poco orientativas, especialmente cuando se recorren fuera del párrafo completo. «Ver el servicio de diseño web» permite anticipar mejor lo que se encontrará al abrirlo.

Revisa también el orden de lectura. Una composición con columnas puede verse equilibrada y presentar una secuencia confusa cuando se amplía o se interpreta con otra herramienta. El mensaje principal, la explicación y la acción deberían mantener una relación comprensible. La guía de textos para servicios propone cómo preparar esa base editorial.

El contraste se decide sobre situaciones reales

No basta con elegir colores que parezcan distintos. Un texto fino sobre un fondo claro puede ser difícil de leer, y una fotografía puede cambiar mucho la visibilidad según el recorte. La comprobación debe realizarse sobre las combinaciones que aparecen realmente en la página.

Incluye botones, enlaces, etiquetas, mensajes de error y estados seleccionados. A veces el texto principal está cuidado, pero la información práctica utiliza un gris muy tenue para parecer secundaria. Que un dato sea menos importante en la jerarquía no significa que pueda volverse ilegible.

Si colocas texto sobre imágenes, observa diferentes tamaños de pantalla. El recorte móvil puede situar las letras sobre una zona luminosa que no existía detrás de ellas en escritorio. Una superficie de apoyo o una composición diferente puede ofrecer más consistencia que ajustar la fotografía hasta que funcione en una única vista.

Pide que se utilicen herramientas adecuadas para comprobar los criterios de contraste aplicables, en lugar de aprobar solo por percepción. La revisión también necesita criterio sobre tamaño, grosor y contexto. Una cifra aislada no explica todo el diseño, pero una impresión subjetiva tampoco sustituye la comprobación.

Recorrer la web sin ratón

Prueba una tarea completa utilizando el teclado: abrir el menú, entrar en un servicio, seguir un enlace y llegar al formulario. Observa dónde aparece el foco, si el orden tiene sentido y si puedes activar los controles. La revisión es más útil cuando intenta completar algo que cuando se limita a pulsar tabulación sin un destino.

El foco visible permite saber qué elemento está preparado para recibir una acción. Quitar ese indicador por motivos estéticos puede dejar al usuario sin orientación. El diseño puede adaptarlo a la identidad, pero debe mantenerlo perceptible y comprobar que no queda oculto detrás de otros elementos.

Los menús desplegables y las ventanas superpuestas requieren atención. Hay que poder abrirlos, recorrerlos y cerrarlos de forma coherente. Si un cuadro bloquea el acceso a la página, el comportamiento del foco debe corresponder a esa interacción. Son detalles que conviene probar en la implementación, no solo describir en un boceto.

Una prueba con teclado detecta algunas barreras, pero no representa todas las formas de navegación. Las tecnologías de asistencia y las situaciones de uso son diversas. Utilízala como parte de una revisión más amplia y registra los problemas con una tarea, una página y un comportamiento observado, para que puedan reproducirse.

Ampliar el contenido sin perderlo

Algunas personas necesitan aumentar el tamaño del texto o ampliar la página. Comprueba que el contenido siga disponible y que no se superpongan elementos. Un bloque con una altura rígida puede cortar una frase cuando cambia el tamaño, aunque en la vista original parezca perfectamente ajustado.

Observa títulos, botones y menús con palabras largas. Una traducción, un nombre de servicio o una etiqueta pueden ocupar más espacio del previsto. El diseño debería admitir variaciones razonables de contenido en lugar de depender de una frase exacta para no romperse.

En móvil, revisa si aparece desplazamiento horizontal inesperado en la página. Una tabla, una imagen o una dirección larga pueden ampliar el contenido más allá de la pantalla. Algunas piezas necesitan su propio tratamiento, pero no deberían obligar a mover toda la página de lado a lado para leer cada línea.

No desactives las posibilidades de ampliación del usuario para mantener una composición fija. La presentación debe adaptarse a las necesidades de lectura. Cuando un elemento resulta complejo, busca una alternativa de organización: dividir una tabla, resumir una comparación o permitir una vista que conserve la información esencial.

Las imágenes no cumplen todas la misma función

Una fotografía puede aportar información, ambientar o actuar como enlace. Su alternativa textual depende de esa función. Si la imagen muestra una característica necesaria para entender el servicio, el texto debe transmitir lo relevante. Si es puramente decorativa, una descripción extensa puede añadir ruido innecesario.

Un gráfico complejo requiere más que una etiqueta breve. Puedes explicar el argumento en el texto de la página y ofrecer los datos o una descripción equivalente cuando sea necesario. No esperes que unas pocas palabras comuniquen una comparación que visualmente contiene varias relaciones.

Las imágenes que actúan como controles o enlaces necesitan una denominación que permita entender la acción. Describir únicamente el aspecto del icono puede ser insuficiente si la persona necesita saber que abre un menú o lleva al inicio. El contexto y el marcado determinan cómo se comunica esa función.

El tutorial de imágenes de W3C WAI distingue distintos usos y orienta la elección de alternativas. Para preparar el contenido, puedes entregar al equipo una nota sobre qué aporta cada imagen. Esa información ayuda más que rellenar todos los textos alternativos con el nombre del negocio y una palabra clave.

Formularios que explican lo que necesitan

Cada campo debe poder identificarse mientras se completa. Las etiquetas visibles, las instrucciones y la indicación de datos obligatorios tienen funciones diferentes. Un ejemplo dentro de una caja no debería ser la única pista, porque desaparece cuando la persona empieza a escribir.

Los errores necesitan indicar qué ocurre y cómo continuar. Un borde rojo sin texto puede no ser suficiente. Tampoco ayuda un mensaje general que obliga a buscar el campo problemático. La información introducida debería conservarse cuando sea posible, para que corregir un dato no exija repetir toda la tarea.

La confirmación también forma parte de la accesibilidad. Si aparece un mensaje después del envío, debe ser perceptible y corresponder al estado real de la operación. No basta con cambiar discretamente el color del botón. La persona necesita saber si la consulta se procesó o si debe realizar otro paso.

El artículo sobre formularios de contacto desarrolla los campos y el circuito de recepción. En una revisión de accesibilidad, comprueba además cómo se identifican y anuncian los controles y estados con las herramientas apropiadas. El buen texto y la implementación deben trabajar juntos.

Movimiento, vídeo y elementos que compiten por la atención

Una animación puede ayudar a explicar una relación, pero también puede distraer o dificultar la lectura. Antes de incorporarla, pregunta qué aporta y si el contenido sigue siendo comprensible sin ella. El movimiento no debería ser el único medio de comunicar una información importante.

Revisa carruseles, fondos en vídeo y elementos que cambian solos. La persona necesita tiempo para leer y formas adecuadas de controlar la interacción. Una composición que parece dinámica durante una presentación puede resultar agotadora cuando alguien intenta localizar un dato concreto.

Si el vídeo transmite información hablada relevante, prepara alternativas como subtítulos y, según el contenido, transcripción u otros recursos. Un texto promocional breve situado al lado no equivale necesariamente al contenido del vídeo. La alternativa debe responder a lo que la persona necesita comprender.

Ten en cuenta las preferencias de reducción de movimiento cuando corresponda. El equipo puede diseñar una versión menos animada que conserve la función. Esto requiere planificar estados y comportamientos, no simplemente eliminar efectos al final sin comprobar si quedan partes inaccesibles o incomprensibles.

Una revisión inicial que se pueda ejecutar

Elige varias páginas representativas: portada, servicio, proyecto y contacto. Si hay reservas, descargas o contenidos especiales, inclúyelos. Revisar solo la portada deja fuera interacciones donde pueden aparecer barreras importantes. La muestra debe corresponder a la diversidad real del sitio.

Para cada página, intenta una tarea con el método de acceso que estés comprobando. Anota el paso en el que aparece un problema, el resultado esperado y lo que ocurre. «El menú no funciona» es menos útil que «con teclado se abre el menú, pero no se puede alcanzar el enlace de contacto».

Guarda capturas o notas cuando ayuden a reproducir la incidencia, sin incluir datos privados de pruebas. Agrupa problemas que proceden del mismo componente para corregirlos de forma coherente. Si un botón se repite en muchas páginas, puede ser más eficaz arreglar su definición común que retocar cada aparición.

W3C ofrece una primera revisión con comprobaciones sencillas, y advierte de que no constituye una evaluación completa. Puedes utilizarla para empezar y decidir después qué revisión especializada necesita el sitio. El alcance debe quedar explícito en cualquier informe o entrega.

Priorizar según la tarea bloqueada

No todos los problemas tienen la misma consecuencia. Un obstáculo que impide enviar una consulta o abrir la navegación puede dejar fuera a una persona de una tarea central. Un detalle menor de presentación puede necesitar corrección, pero no debería desplazar indefinidamente los bloqueos principales.

Organiza las incidencias por impacto, extensión y dependencia. Un fallo en un componente compartido puede afectar a todo el sitio. Otro puede limitarse a una pieza concreta. Algunas correcciones requieren decisiones de contenido; otras, desarrollo o diseño. Identificarlo permite asignar trabajo sin pasar la misma incidencia de una persona a otra.

No uses esta priorización para declarar irrelevantes las barreras menos visibles. Sirve para ordenar la resolución y los recursos, no para convertir lo pendiente en algo aceptado sin revisión. Conserva un registro y comprueba cada corrección en el recorrido donde se detectó.

Cuando haya una alternativa temporal, explica su alcance. Ofrecer un correo puede permitir contactar mientras se corrige un formulario, pero no demuestra que el formulario sea accesible. Una solución provisional debe reconocerse como tal y no borrar la tarea de reparación.

Un ejemplo ficticio de revisión de una web pequeña

Imaginemos una empresa de formación que presenta cursos presenciales y recibe solicitudes de información. La portada tiene un vídeo de fondo, las fechas aparecen dentro de carteles y el formulario utiliza textos interiores como etiquetas. En escritorio, el conjunto parece ordenado y visualmente atractivo.

La revisión empieza por la tarea de encontrar un curso y preguntar por una fecha. Al ampliar el contenido, una tarjeta corta parte del título. Con teclado, el menú desplegable no permite llegar a todos los enlaces. En el formulario, después de escribir varios datos, resulta difícil recordar qué campo corresponde a cada información.

El equipo puede resolver primero el acceso a la navegación y el formulario. Después incorpora las fechas como texto, revisa la altura de las tarjetas y ajusta el tratamiento del vídeo. No necesita rediseñar toda la identidad para corregir esas barreras; sí necesita comprobar que las soluciones funcionan en conjunto.

La entrega registra qué se ha revisado y qué queda fuera. Si no se ha realizado una evaluación completa con criterios definidos, no se presenta como una certificación. El negocio obtiene una web con problemas concretos resueltos y una base clara para seguir mejorando, sin una promesa que no corresponde al trabajo realizado.

Este ejemplo ilustra una forma de priorizar, no una receta universal. Otra web puede tener barreras distintas y requerir pruebas adicionales. Por eso conviene describir tareas reales y observar su funcionamiento, en lugar de aplicar una lista de cambios idénticos a todos los proyectos.

Qué pedir en una propuesta de diseño web

Pregunta qué alcance de accesibilidad contempla el encargo, qué criterios se utilizarán y cómo se comprobarán. «Web accesible» puede significar cosas distintas si no se define. Una propuesta útil explica responsabilidades y evidencias, no solo añade una palabra a una lista de características.

Aclara qué contenidos aporta el cliente. Fotografías, documentos, vídeos y textos pueden necesitar preparación. Si entregas un catálogo en PDF o un vídeo sin alternativas, el equipo debe saber si su adaptación está incluida o requiere otro trabajo. La accesibilidad del sitio no termina en las páginas que se diseñan desde cero.

Pregunta cómo se comunicarán y resolverán los problemas detectados. La revisión necesita tiempo dentro del calendario, especialmente si participa un equipo externo o personas usuarias. Dejarla para el último día puede convertir correcciones importantes en cambios apresurados sin una segunda comprobación.

También conviene acordar qué pasará cuando se publiquen nuevos contenidos. Una base bien construida puede deteriorarse si cada actualización introduce títulos desordenados, imágenes sin contexto o documentos difíciles de utilizar. Las instrucciones de edición forman parte de la continuidad del proyecto.

Herramientas automáticas y revisión humana

Las herramientas pueden detectar ciertos problemas y ayudar a repetir comprobaciones. Son útiles para localizar incidencias, pero sus resultados no describen por sí solos toda la experiencia. Un texto alternativo puede existir y ser poco útil; un enlace puede tener una etiqueta técnicamente presente y seguir resultando ambiguo.

La revisión humana observa sentido, tarea y contexto. Necesita conocimiento y, en muchos casos, la participación de personas con distintas formas de acceso. No sustituyas esa diversidad por una única prueba realizada por quien conoce la web de memoria. La familiaridad puede ocultar dificultades que aparecen para alguien nuevo.

Combina los métodos y explica qué aporta cada uno. Un informe puede incluir resultados automáticos, pruebas manuales y tareas con usuarios, si realmente se han realizado. No presentes una puntuación de una herramienta como un certificado global de accesibilidad o como garantía de que nadie encontrará barreras.

Cuando repitas la revisión, compara incidencias concretas. Que un número suba no explica necesariamente si se ha resuelto el problema principal. La pregunta útil sigue siendo si la persona puede completar la tarea que antes estaba bloqueada y si la solución funciona en las páginas donde se utiliza.

Documentos descargables y herramientas de terceros

El recorrido de una web puede continuar en un documento o en una herramienta externa. Un catálogo, una agenda o un formulario integrado no queda fuera de la experiencia porque lo proporcione otro servicio. Identifica esas dependencias durante la planificación y revisa qué tareas necesita completar allí el usuario.

Si publicas un documento, pregunta si su contenido podría presentarse también en una página. A veces se utiliza un archivo por costumbre, aunque la información sea breve y cambie con frecuencia. Una versión web bien preparada puede facilitar lectura, actualización y acceso desde distintos dispositivos, según el contenido y el uso previsto.

Cuando el archivo sea necesario, su preparación requiere criterios propios. No basta con que el enlace sea accesible si el documento tiene un orden de lectura confuso o contiene información únicamente como imagen. Aclara si la adaptación del documento está incluida en el proyecto y quién puede revisarla con las herramientas adecuadas.

Las integraciones también deben observarse en contexto. Una agenda puede funcionar de forma independiente y resultar difícil de utilizar dentro de un espacio demasiado pequeño. Un widget puede introducir controles con etiquetas poco claras o alterar el recorrido de teclado. La prueba debe realizarse sobre la página donde se utiliza, además de consultar la documentación del proveedor.

Si detectas una barrera que no puedes corregir directamente, documenta el problema y estudia alternativas con el responsable del servicio. No declares accesible una tarea que depende de un componente sin revisar. Explica los límites del alcance y conserva un canal de atención apropiado mientras se decide la solución.

Este inventario de dependencias ayuda también en futuras contrataciones. Puedes preguntar por accesibilidad antes de elegir una herramienta, en lugar de descubrir sus límites después de integrarla en todo el negocio. La decisión técnica y la experiencia del usuario vuelven a estar relacionadas desde el principio.

Mantener la accesibilidad en el trabajo cotidiano

Prepara unas instrucciones de contenido que pueda usar quien actualiza la web: cómo elegir títulos, cuándo describir una imagen, cómo nombrar enlaces y qué revisar al añadir documentos. Es mejor un documento breve y aplicado al sistema real que una guía extensa que nadie sabe relacionar con su editor.

Incluye la accesibilidad en las revisiones de nuevos componentes. Un cambio de menú, un formulario adicional o una galería puede introducir comportamientos diferentes. Si se comprueba desde el principio, será más fácil corregirlo antes de que se replique en muchas páginas.

Ofrece un canal adecuado para comunicar dificultades y acuerda quién las revisa. Una persona que encuentra una barrera puede aportar información valiosa, pero no debería cargar con la responsabilidad de auditar el sitio. Escuchar el problema implica intentar reproducirlo y responder de manera útil.

Si estás preparando una nueva web, incorpora estas decisiones al briefing del proyecto. En Trama puedes consultar los servicios de diseño web y explicar qué tareas necesita facilitar tu página. Definir el alcance de revisión desde el inicio permite integrar claridad, diseño y funcionamiento en el mismo trabajo.