Documento de revisión de accesibilidad
Sitio web: marinaacosta.com
Proyecto: Marina Acosta Interiorismo
1. Objeto del documento
El presente documento recoge la revisión de varios criterios de accesibilidad aplicables a la navegación, estructura, foco de teclado, formularios, enlaces, contraste y comportamiento de los elementos interactivos de la web marinaacosta.com.
La revisión se ha realizado sobre las páginas principales de la web y sobre los elementos comunes de navegación, cabecera, menú, pie de página, formularios y enlaces internos.
2. Alcance de la revisión
Se han revisado especialmente los siguientes aspectos:
- Navegación mediante teclado.
- Ausencia de trampas de foco.
- Atajos de teclado.
- Enlace para saltar bloques repetidos.
- Orden lógico del foco.
- Visibilidad del foco.
- Comportamiento al recibir el foco.
- Etiquetado de formularios.
- Nombre accesible de enlaces.
- Estructura correcta de listas.
- Contraste entre texto y fondo en elementos relevantes.
3. Resultado general
Tras la revisión realizada, la web presenta un nivel de accesibilidad adecuado en la mayoría de los puntos comprobados.
Se han corregido o revisado los siguientes aspectos:
- Los enlaces principales cuentan con nombre reconocible.
- Las imágenes enlazadas cuentan con texto alternativo o nombre accesible adecuado.
- Las listas revisadas mantienen una estructura correcta, utilizando elementos
<li>dentro de las listas. - Los campos de formulario revisados cuentan con etiquetas asociadas.
- La navegación general mediante teclado funciona en enlaces, menús, campos de formulario y elementos principales.
- Se ha incorporado un enlace de “Saltar al contenido principal” para evitar bloques repetidos.
- No se han detectado cambios inesperados al recibir el foco en los elementos revisados.
- No se han implementado atajos de teclado de carácter único.
No obstante, existen algunas limitaciones detectadas que quedan documentadas en este informe.
4. Criterios revisados
4.1. 9.2.1.1 Teclado
La web permite la navegación general mediante teclado en la mayor parte de sus elementos interactivos: enlaces, campos de formulario, navegación principal, enlaces del menú y enlaces del pie de página.
No obstante, se detecta una limitación en los controles visuales de apertura y cierre del menú lateral: la hamburguesa de apertura y la X de cierre no están implementadas actualmente como botones HTML nativos. Estos elementos funcionan correctamente mediante ratón, pero no garantizan una activación completa y robusta mediante teclado.
Estado: cumplimiento parcial.
Observación: pendiente de mejora técnica en una fase posterior.
Recomendación: convertir la hamburguesa y la X en elementos <button type="button">, manteniendo el diseño actual mediante CSS, para asegurar su correcta operabilidad con teclado.
4.2. 9.2.1.2 Sin trampas para el foco del teclado
Durante la navegación con teclado no se han detectado trampas de foco en los elementos revisados. El usuario puede avanzar y retroceder mediante Tab y Shift + Tab por los principales elementos interactivos de la web.
La limitación indicada en el punto anterior afecta a la activación de los controles de apertura y cierre del menú, pero no se ha detectado una trampa de foco permanente que impida continuar la navegación.
Estado: cumple, con observación vinculada al menú lateral.
4.3. 9.2.1.4 Atajos del teclado
No se han implementado atajos de teclado de carácter único en la web.
No existen acciones configuradas mediante teclas simples como letras, números o signos que puedan interferir con la navegación de personas usuarias de tecnologías asistivas.
Estado: no aplicable.
Justificación: no se han implementado atajos de teclado de carácter único en la web.
4.4. 9.2.4.1 Evitar bloques
Se ha incorporado un mecanismo para saltar bloques repetidos de navegación mediante un enlace de “Saltar al contenido principal”.
Este enlace aparece al recibir el foco mediante teclado y permite acceder directamente al contenido principal de la página, evitando tener que recorrer repetidamente la cabecera o navegación.
Estado: cumple.
4.5. 9.2.4.3 Orden del foco
El orden de navegación mediante teclado sigue, en términos generales, una secuencia lógica y coherente con la estructura visual y funcional de la web.
El foco avanza por los elementos principales de navegación, enlaces, contenido, formularios y pie de página en un orden comprensible.
Estado: cumple, con observación pendiente sobre la mejora futura de los controles de hamburguesa y cierre del menú.
4.6. 9.2.4.6 Encabezados y etiquetas
Los encabezados y etiquetas revisados describen adecuadamente el contenido o la función de los elementos asociados.
Los campos de formulario revisados cuentan con etiquetas asociadas, lo que permite que las tecnologías asistivas identifiquen correctamente la finalidad de cada campo.
Estado: cumple.
4.7. 9.2.4.7 Foco visible
La web muestra foco visible en la mayoría de los elementos interactivos revisados, incluyendo enlaces, campos de formulario, elementos del menú y enlaces del contenido.
Se ha reforzado la visibilidad del foco en zonas con fondo oscuro, especialmente en los iconos sociales del pie de página, para evitar que el indicador de foco quede oculto o tenga bajo contraste.
No obstante, queda pendiente la mejora técnica de los controles visuales de hamburguesa y X de cierre del menú, al no estar implementados actualmente como botones nativos.
Estado: cumplimiento parcial.
Recomendación: revisar en una fase posterior la implementación de los controles de menú como botones HTML reales y mantener un indicador de foco visible y contrastado.
4.8. 9.3.2.1 Al recibir el foco
No se han detectado cambios inesperados de contexto al recibir el foco en los elementos revisados.
Al navegar mediante teclado, los campos, enlaces y elementos interactivos no provocan automáticamente navegación, envío de formularios, apertura de ventanas ni cambios de página al recibir foco.
Estado: cumple.
5. Incidencia de contraste detectada
Durante la revisión se ha detectado una advertencia de contraste en una sección decorativa con números de gran tamaño en las siguientes páginas:
- https://marinaacosta.com/amueblamiento-y-decoracion-en-bizkaia/
- https://marinaacosta.com/interiorismo-y-reforma-integral-en-bizkaia/
La herramienta de auditoría indica que los colores de fondo y primer plano no tienen una relación de contraste suficiente.
Estos números tienen una función visual y ornamental dentro del diseño de la sección. No obstante, al estar representados como texto visible en la página, las herramientas automáticas pueden interpretarlos como contenido textual sujeto a requisitos de contraste.
La clienta ha solicitado mantener la composición cromática actual por motivos de identidad visual y dirección estética del proyecto, por lo que no se modifica el color en esta fase.
Estado: no cumple según herramienta automática de contraste.
Justificación documentada: elemento de carácter ornamental y decisión de diseño mantenida por indicación de cliente.
Recomendación técnica: en una fase posterior, valorar una de estas opciones:
- Aumentar el contraste manteniendo una estética similar.
- Convertir los números en un recurso meramente decorativo no textual.
- Marcar el elemento como decorativo para tecnologías asistivas si no aporta información necesaria.
- Sustituir el texto por un elemento gráfico ornamental, siempre que no transmita información esencial.
6. Elementos pendientes de mejora
Quedan documentadas las siguientes mejoras pendientes:
6.1. Controles de menú hamburguesa y cierre
Los controles de apertura y cierre del menú funcionan visualmente y mediante ratón, pero no están implementados actualmente como botones nativos.
Mejora recomendada: sustituir los contenedores actuales por elementos <button type="button"> con aria-label, manteniendo el mismo diseño mediante CSS.
Prioridad: media.
Motivo: mejora necesaria para una operabilidad de teclado más robusta.
6.2. Contraste en números ornamentales
En dos páginas de servicio se detecta contraste insuficiente en números decorativos.
Mejora recomendada: revisar la implementación del recurso visual para que no sea tratado como texto informativo o ajustar el contraste si se mantiene como texto.
Prioridad: baja/media.
Motivo: el elemento es ornamental, pero la herramienta automática lo identifica como texto con contraste insuficiente.
7. Conclusión
La web marinaacosta.com presenta un estado general favorable en materia de accesibilidad en los puntos revisados.
Se han revisado y corregido aspectos relacionados con enlaces accesibles, estructura de listas, etiquetas de formularios, navegación mediante teclado, salto al contenido principal, orden del foco y comportamiento al recibir el foco.
No obstante, la web no puede considerarse plenamente conforme en todos los puntos revisados debido a dos limitaciones documentadas:
- Los controles de hamburguesa y cierre del menú no están implementados actualmente como botones nativos y no garantizan una operabilidad completa mediante teclado.
- Existen advertencias de contraste en números ornamentales de dos páginas de servicio, que se mantienen por decisión estética de la clienta.
Por tanto, el estado recomendable a documentar es:
Estado de accesibilidad revisado: parcialmente conforme en los criterios evaluados.
Pendiente: mejora futura de controles de menú y revisión del contraste en elementos ornamentales.