Menu QR Code & Digitalisation

Accesibilidad en Menús Digitales (PMR): Guía de Cumplimiento Normativo

Sommaire

Un cliente en silla de ruedas entra en su restaurante. Su sala cumple con la normativa, la rampa de acceso está instalada, la mesa está adaptada. Pero cuando escanea el código QR para consultar su carta, se encuentra con un PDF ilegible para su lector de pantalla. Toda la cadena de accesibilidad se rompe en el último eslabón: su menú digital.

La accesibilidad del menú digital no es un tema reservado a las grandes cadenas o a los sitios de comercio electrónico. Concierne a cada restaurador que ofrece una carta en línea, un código QR en mesa o un menú consultable desde un smartphone. En los países hispanohablantes, varios millones de personas viven con alguna discapacidad — visual, motora, auditiva o cognitiva. A esto se suman las situaciones temporales: un brazo enyesado, una vista que disminuye con la edad, un entorno demasiado luminoso para leer una pantalla. Su menú digital debe funcionar para todos estos casos.

Y no es solo una cuestión de buena voluntad. La normativa europea impone obligaciones precisas en materia de accesibilidad digital. No cumplirlas supone exponerse a sanciones, pero sobre todo, es perder una parte de su clientela.

Esta guía le ofrece las claves concretas para hacer que su menú digital sea conforme y utilizable por todos, sin jerga técnica innecesaria y con acciones que puede poner en práctica desde esta misma semana.

Qué dice la legislación sobre la accesibilidad del menú digital

La normativa europea y las WCAG

La legislación en materia de accesibilidad ha evolucionado considerablemente en los últimos años, tanto a nivel europeo como en los distintos países hispanohablantes. En España, el Real Decreto 1112/2018 establece los requisitos de accesibilidad para sitios web y aplicaciones móviles del sector público, mientras que en varios países de Latinoamérica existen normativas similares que se están reforzando progresivamente.

El estándar internacional de referencia son las Web Content Accessibility Guidelines (WCAG) 2.1, editadas por el W3C. Estas directrices definen tres niveles de conformidad: A (mínimo), AA (objetivo recomendado) y AAA (óptimo). La norma europea EN 301 549, que se aplica en toda la UE, se basa directamente en las WCAG.

Para un restaurador independiente, la cuestión se plantea de forma diferente que para una administración pública. Su sitio web o su menú digital no está necesariamente dentro del ámbito obligatorio de la normativa aplicable a organismos públicos. Pero dos elementos cambian la situación.

La directiva europea de accesibilidad (2019/882)

La directiva europea 2019/882, conocida como «European Accessibility Act», es aplicable desde el 28 de junio de 2025. Impone exigencias de accesibilidad a los productos y servicios digitales ofrecidos a los consumidores, incluidos los servicios de comercio electrónico.

Si su menú digital permite el pedido en línea, el click & collect o el pago en mesa, usted entra potencialmente en el ámbito de aplicación de esta directiva. Las microempresas de menos de 10 empleados y con una facturación anual inferior a 2 millones de euros se benefician de una exención para los servicios. Pero esta exención no cubre todos los casos, y la tendencia regulatoria apunta claramente hacia una ampliación.

Las obligaciones de los establecimientos abiertos al público y su extensión digital

Su restaurante es un establecimiento abierto al público. Como tal, ya está sujeto a normas de accesibilidad física para personas con movilidad reducida. La lógica normativa es coherente: si el acceso físico debe estar garantizado, el acceso a la información — incluida su carta — también debe estarlo.

En la práctica, una inspección de conformidad que detecte que su único menú disponible es un código QR inaccesible puede constituir un punto de incumplimiento. El menú en papel sigue siendo una alternativa, pero si ha optado por lo totalmente digital — y cada vez son más quienes lo hacen —, la accesibilidad de este soporte se convierte en una obligación de hecho.

Los cuatro tipos de discapacidad a tener en cuenta para su menú digital accesible

Cuando se piensa en «discapacidad» en la hostelería, a menudo se visualiza la silla de ruedas. Pero la accesibilidad digital abarca un espectro mucho más amplio. Su menú digital accesible debe responder a cuatro categorías de necesidades.

Discapacidad visual

Es el caso más relevante para un menú digital. Incluye la ceguera total, la baja visión, el daltonismo y los trastornos de la visión relacionados con la edad. Una persona ciega utiliza un lector de pantalla (VoiceOver en iPhone, TalkBack en Android) que lee en voz alta el contenido de la pantalla. Si su menú es un simple PDF escaneado o una imagen, el lector de pantalla no «ve» nada: anuncia «imagen» o permanece en silencio.

Una persona con baja visión necesita poder ampliar el texto sin que el diseño se rompa, y contrastes suficientes entre el texto y el fondo. Una persona daltónica no distinguirá un plato marcado en rojo como «picante» si el color es el único indicador.

Discapacidad motora

Una persona con discapacidad motora puede tener dificultades para manipular una pantalla táctil con precisión. Botones demasiado pequeños, menús desplegables que exigen un deslizamiento preciso del dedo, zonas clicables demasiado juntas: todos son obstáculos invisibles para usted, pero bloqueantes para ella.

Algunos usuarios navegan exclusivamente con teclado o con dispositivos de asistencia (conmutadores, comandos de voz). Su menú debe funcionar sin pantalla táctil.

Discapacidad auditiva

Si su menú digital integra contenidos de audio o vídeo — una presentación del chef, un vídeo de preparación de un plato —, las personas sordas o con dificultades auditivas no tienen acceso a ellos sin subtítulos o transcripción.

Discapacidad cognitiva

Los trastornos cognitivos (dislexia, trastornos de atención, discapacidad intelectual) afectan a una parte importante de la población. Un menú sobrecargado, con una navegación compleja, términos oscuros o una maquetación incoherente, se convierte en un obstáculo. La simplicidad y la claridad benefician, además, a todos sus clientes, no solo a quienes se encuentran en situación de discapacidad.

Los criterios técnicos de un menú digital accesible

Pasemos a los aspectos concretos. Estos son los criterios técnicos que su menú de restaurante accesible debe cumplir para ser considerado conforme.

Estructura semántica y navegación lógica

Su menú digital debe tener una estructura clara y jerarquizada. En términos técnicos, esto significa utilizar las etiquetas HTML apropiadas: títulos (h1, h2, h3) para las categorías y subcategorías, listas para los platos, párrafos para las descripciones.

¿Por qué es importante? Un lector de pantalla se apoya en esta estructura para permitir al usuario navegar. Si sus categorías «Entrantes», «Platos principales», «Postres» son simples textos en negrita sin etiqueta de título, el usuario ciego no puede saltar directamente a los postres. Tiene que escuchar el menú completo, plato por plato.

La navegación debe seguir un orden lógico:

  • Las categorías están claramente identificadas y separadas
  • Cada plato se presenta en un bloque diferenciado (nombre, descripción, precio, alérgenos)
  • El usuario puede navegar entre categorías sin volver al inicio
  • El foco del teclado sigue el orden visual de lectura (de arriba abajo, de izquierda a derecha)

Contrastes y legibilidad

Las WCAG imponen ratios de contraste mínimos entre el texto y su fondo:

  • 4.5:1 para el texto de tamaño normal (nivel AA)
  • 3:1 para el texto de gran tamaño (18px en negrita o 24px en normal)
  • 3:1 para los elementos gráficos que transmiten información (iconos, botones)

En la práctica, esto significa que un texto gris claro sobre fondo blanco — estética muy de moda en el diseño de menús — a menudo no es conforme. Un texto blanco sobre una foto de plato como fondo plantea el mismo problema: el contraste varía según la zona de la imagen.

Para verificar sus contrastes, existen herramientas gratuitas: el Color Contrast Checker de WebAIM o la extensión de navegador WAVE. Cuando trabaje en el diseño de su menú digital, recuerde probar cada combinación de colores con estas herramientas.

Tamaño de las zonas interactivas

Los botones y enlaces de su menú deben tener un tamaño mínimo de 44 × 44 píxeles (recomendación WCAG 2.1, criterio 2.5.5). Esto garantiza que una persona con dificultades motrices pueda activarlos sin error.

En concreto, si su botón «Añadir al carrito» mide 30 píxeles de alto, es demasiado pequeño. Si dos botones están pegados uno al otro sin espacio, una persona con temblores pulsará sistemáticamente el botón equivocado.

Compatibilidad con los lectores de pantalla

Su menú debe ser íntegramente legible por un lector de pantalla. Esto implica:

  • Cada imagen decorativa tiene un atributo alt vacío (alt="") para ser ignorada
  • Cada imagen que transmite información tiene un texto alternativo descriptivo (ej.: alt="Tarte tatin de manzanas caramelizadas")
  • Los precios son legibles (no «14€50» pegado sin espacio, sino «14,50 €» con un formato claro)
  • Los iconos tienen una etiqueta accesible (un icono de hoja para «vegetariano» debe ir acompañado del texto «Vegetariano», aunque solo sea visible para los lectores de pantalla)
  • La información sobre alérgenos no se basa únicamente en códigos de color o iconos sin texto

Adaptación al tamaño de pantalla y al zoom

Su menú digital debe seguir siendo legible y funcional cuando el usuario hace zoom hasta el 200 % (criterio WCAG 1.4.4). Esto significa:

  • Sin barra de desplazamiento horizontal al 200 % de zoom
  • El texto se adapta (reflow) en lugar de truncarse
  • Las imágenes no ocultan el texto cuando se amplía la pantalla
  • La navegación sigue siendo utilizable

Un menú diseñado con responsive design generalmente cumple este criterio. Un PDF escaneado o una imagen fija nunca lo cumple.

Guía práctica: haga su menú digital conforme en 10 pasos

Este es el procedimiento a seguir para verificar y mejorar la accesibilidad de su menú digital existente. Cada paso se puede realizar sin conocimientos técnicos avanzados.

Paso 1: Abandone el formato PDF o imagen

Si su menú en línea es un PDF escaneado, una foto de su carta en papel o una imagen fija, es el primer obstáculo que debe eliminar. Estos formatos son inaccesibles por naturaleza: los lectores de pantalla no pueden interpretarlos, el zoom los pixela y la navegación es imposible.

Pase a un menú en formato HTML nativo, es decir, un verdadero menú digital estructurado con texto seleccionable. Si ha seguido una guía de implementación de menú con código QR, verifique que la solución elegida genere contenido HTML y no un simple PDF alojado.

Paso 2: Verifique la estructura de sus títulos

Abra su menú digital en su teléfono. Active el lector de pantalla (VoiceOver en iPhone: Ajustes > Accesibilidad > VoiceOver; TalkBack en Android: Ajustes > Accesibilidad > TalkBack). Navegue por su menú utilizando los gestos de deslizamiento.

Hágase estas preguntas:

  • ¿Las categorías se anuncian como títulos?
  • ¿Puede saltar de una categoría a otra?
  • ¿El orden de lectura corresponde al orden visual?
  • ¿Cada plato está claramente separado del siguiente?

Paso 3: Pruebe los contrastes

Utilice la herramienta en línea WebAIM Contrast Checker. Introduzca el color de su texto y el de su fondo. La herramienta le indica instantáneamente si el ratio es conforme.

Los errores más habituales en restaurantes:

  • Texto blanco o crema sobre fondo pastel
  • Texto sobre una fotografía de fondo sin filtro opaco
  • Precios en gris claro para distinguirlos visualmente de los nombres de platos
  • Texto decorativo en color tenue

Paso 4: Amplíe las zonas clicables

Si su menú permite filtrar por categoría, añadir platos al carrito o navegar entre páginas, verifique que cada botón o enlace mida al menos 44 × 44 píxeles. Piense también en el espaciado: un mínimo de 8 píxeles entre dos zonas interactivas evita los errores de pulsación.

Paso 5: Añada las alternativas textuales

Cada imagen que transmite información debe tener un texto alternativo. Esto incluye:

  • Las fotos de platos (si son el único medio de ver cómo luce el plato)
  • Los iconos de alérgenos
  • Las etiquetas (vegetariano, casero, ecológico)
  • Los logotipos de certificación o sello de calidad

Paso 6: Verifique la navegación con teclado

Conecte un teclado Bluetooth a su tableta o pruebe desde un ordenador. Navegue por su menú únicamente con la tecla Tab (avanzar), Shift+Tab (retroceder) y Enter (activar). Cada elemento interactivo debe ser alcanzable, y el indicador de foco (el contorno que muestra dónde se encuentra) debe ser visible.

Paso 7: Simplifique el lenguaje

Relea las descripciones de sus platos con una mirada fresca. Los términos técnicos de cocina («snacké», «en déclinaison», «condiment maison») ¿son comprensibles para todos? Añada una breve explicación cuando un término no sea habitual.

Esto se relaciona con la cuestión de los menús multilingües: la claridad del lenguaje beneficia tanto a las personas en situación de discapacidad cognitiva como a los clientes que no dominan perfectamente el idioma.

Paso 8: Nunca transmita información solo mediante el color

Si utiliza un código de colores para indicar los platos picantes (rojo), vegetarianos (verde) o sin gluten (amarillo), añada siempre un texto o un icono con etiqueta. El código de colores por sí solo excluye a las personas daltónicas y a quienes utilizan un lector de pantalla.

Paso 9: Asegúrese de que los formularios sean accesibles

Si su menú digital incluye un formulario de pedido, de reserva o de comentarios, cada campo debe tener una etiqueta explícita asociada. No un simple placeholder que desaparece cuando se empieza a escribir, sino una etiqueta permanente que identifique el campo. Los mensajes de error deben ser claros y estar situados junto al campo correspondiente.

Paso 10: Ofrezca una alternativa

Incluso con un menú digital perfectamente accesible, mantenga una alternativa para los casos extremos: un menú en braille para los clientes ciegos habituales, un menú impreso en letra grande, o la posibilidad de pedir al personal que lea la carta. La accesibilidad es también flexibilidad humana.

Los errores frecuentes que hacen su menú inaccesible

Estos son los errores que observamos con más frecuencia en los menús digitales de restaurantes independientes.

El PDF «práctico»

El reflejo más habitual: escanear la carta en papel y subirla a internet. Es rápido, pero es el formato menos accesible que existe. El texto no es seleccionable, el zoom degrada la calidad, el lector de pantalla no puede leer nada y el diseño no se adapta a la pantalla.

El menú todo en imágenes

Variante del PDF: cada sección del menú es una imagen, con el texto «incrustado» en la imagen. Visualmente atractivo, técnicamente inaccesible. El texto dentro de una imagen no existe para un lector de pantalla.

El carrusel o slider de platos

Los carruseles con desplazamiento automático presentan numerosos problemas de accesibilidad: navegación con teclado difícil, contenido que desaparece antes de ser leído, animación perturbadora para personas con epilepsia o trastornos cognitivos. Prefiera una lista estática con scroll.

La sobrecarga de animaciones

Efectos de parallax, transiciones de página, apariciones progresivas de los platos: estos efectos decorativos pueden provocar náuseas o mareos en personas sensibles al movimiento (trastornos vestibulares). Las WCAG recomiendan ofrecer una opción para reducir las animaciones (preferencia del sistema prefers-reduced-motion).

La reproducción automática de audio o vídeo

Si su menú lanza automáticamente una música ambiental o un vídeo de presentación, los usuarios de lectores de pantalla no pueden escuchar los anuncios de su herramienta de asistencia. Todo contenido de audio o vídeo debe ser activado voluntariamente por el usuario.

El timeout de sesión

Algunos menús con pedido en línea desconectan al usuario tras unos minutos de inactividad. Una persona que utiliza un lector de pantalla necesita más tiempo para recorrer el menú. Un timeout demasiado corto la obliga a empezar desde el principio. Prevea un plazo generoso o un aviso antes de la desconexión.

Cómo probar la accesibilidad de su menú digital

Probar uno mismo la accesibilidad de su menú no sustituye a una auditoría profesional, pero permite identificar los problemas principales. Este es un método en tres niveles.

Nivel 1: Las pruebas automáticas

Las herramientas automáticas detectan aproximadamente entre el 30 y el 40 % de los problemas de accesibilidad. Es un primer filtro útil.

  • WAVE (wave.webaim.org): extensión de navegador gratuita. Escanee la página de su menú y corrija los errores señalados en rojo
  • Lighthouse (integrado en Chrome DevTools): pestaña «Accesibilidad». Apunte a una puntuación superior a 90
  • axe DevTools: extensión de navegador que detalla cada error con sugerencias de corrección

Estas mismas herramientas pueden además ayudarle a medir otros aspectos de rendimiento, como complemento a su seguimiento analítico del menú digital.

Nivel 2: Las pruebas manuales

El 60 al 70 % restante requiere verificación humana.

  • Prueba de teclado: desconecte el ratón, navegue únicamente con el teclado. ¿Se puede llegar a cada elemento interactivo? ¿El foco es visible?
  • Prueba de lector de pantalla: active VoiceOver o TalkBack y recorra su menú con los ojos cerrados. ¿Entiende lo que se anuncia? ¿Puede pedir un plato?
  • Prueba de zoom: haga zoom al 200 % en su navegador. ¿El contenido sigue siendo legible y navegable?
  • Prueba de contraste: verifique cada combinación texto/fondo con una herramienta de contraste
  • Prueba de comprensión: pida a alguien que no conozca su carta que la recorra. ¿Entiende cada denominación?

Nivel 3: La auditoría profesional

Para una conformidad certificada, recurra a un experto en accesibilidad digital. Una auditoría completa cuesta generalmente entre 2 000 y 5 000 € para un sitio sencillo. Es una inversión, pero le protege jurídicamente y le proporciona una hoja de ruta precisa.

Algunas comunidades autónomas, cámaras de comercio y organismos de apoyo al sector de la hostelería ofrecen ayudas económicas para la accesibilidad digital de los comercios de proximidad. Infórmese en su cámara de comercio local o en las asociaciones de hostelería de su zona.

Hacer que su menú de restaurante sea accesible no es solo una obligación legal o un riesgo que cubrir. Es un enfoque que mejora la experiencia del conjunto de sus clientes.

La accesibilidad beneficia a todos

Los principios de accesibilidad — contraste elevado, texto legible, navegación clara, estructura lógica — benefician a cada usuario:

  • El cliente de 65 años que ha olvidado sus gafas
  • El turista que consulta su menú a pleno sol en la terraza
  • El padre o la madre que sostiene a su hijo con un brazo y navega con el pulgar
  • El cliente con prisa que quiere encontrar rápidamente los platos sin gluten
  • La persona que tiene una tendinitis temporal y le cuesta manipular la pantalla

Al trabajar la accesibilidad, mejora la legibilidad, la ergonomía y la rapidez de consulta de su menú para todos. Es una de las ventajas a menudo subestimadas del menú sin contacto.

Un argumento comercial real

Las personas en situación de discapacidad no cenan solas. Un cliente en silla de ruedas viene con su familia, sus amigos, sus colegas. Si su restaurante es accesible — física y digitalmente —, usted capta a todo el grupo. Si su menú digital es inutilizable, el grupo entero irá a otro sitio.

Del mismo modo, las empresas y asociaciones que organizan comidas de grupo eligen prioritariamente los establecimientos accesibles. Es un criterio de selección explícito en numerosas licitaciones corporativas.

La comunicación positiva

Mostrar su compromiso con la accesibilidad — sin convertirlo en un argumento de marketing estridente — refuerza su imagen. Un simple pictograma en su escaparate, una mención en su sitio web, un personal formado: estas señales discretas demuestran que ha pensado en cada persona.

💡 Dato útil: ALaCarte.Direct ofrece la creación gratuita de su menú digital de restaurante en formato código QR. El menú generado está en formato HTML nativo, con una estructura semántica que facilita la compatibilidad con los lectores de pantalla y la adaptación a los diferentes tamaños de pantalla — un punto de partida sólido para su proceso de accesibilidad.

Checklist de accesibilidad para su menú digital

Antes de concluir, aquí tiene una checklist sintética para imprimir y colgar en su despacho. Marque cada punto para su menú actual.

Estructura y contenido:

  • El menú está en formato HTML (no es un PDF ni una imagen)
  • Las categorías utilizan títulos jerarquizados (h2, h3)
  • Cada plato tiene un nombre, una descripción y un precio en texto seleccionable
  • Los alérgenos se indican en texto, no solo mediante iconos o colores
  • El lenguaje es claro y los términos técnicos están explicados

Visual y contrastes:

  • El ratio de contraste texto/fondo es superior a 4.5:1
  • El menú sigue siendo legible al 200 % de zoom
  • La información nunca depende únicamente del color
  • Las animaciones pueden desactivarse o respetan prefers-reduced-motion

Navegación e interacción:

  • Cada elemento interactivo mide al menos 44 × 44 píxeles
  • La navegación con teclado funciona (Tab, Shift+Tab, Enter)
  • El foco del teclado es visible
  • No hay reproducción automática de audio o vídeo
  • Los timeouts de sesión son suficientemente largos

Imágenes y medios:

  • Cada imagen informativa tiene un texto alternativo pertinente
  • Las imágenes decorativas están marcadas como tales
  • Los vídeos tienen subtítulos
  • Los contenidos de audio tienen una transcripción

Formularios (si hay pedido en línea):

  • Cada campo tiene una etiqueta explícita y permanente
  • Los errores se describen en texto y están situados junto al campo correspondiente
  • El formulario es utilizable con teclado

Conclusión: pase a la acción esta semana

La accesibilidad del menú digital no es un proyecto titánico que requiera meses de desarrollo. Es una serie de verificaciones y ajustes que puede comenzar de inmediato.

Esta semana, haga estas tres cosas:

  1. Pruebe su menú con un lector de pantalla (5 minutos). Active VoiceOver o TalkBack en su teléfono e intente recorrer su carta. Si el resultado es incomprensible, ya sabe que hay un problema urgente que resolver.

  2. Verifique sus contrastes (10 minutos). Pase la página de su menú por la herramienta WAVE. Corrija los errores de contraste señalados en rojo: a menudo es una simple modificación de color.

  3. Elimine los formatos no accesibles (variable). Si su menú es un PDF o una imagen, es su prioridad número uno. Pase a un menú digital en formato HTML mediante código QR para sentar las bases de un menú accesible.

Este mes:

  • Recorra la checklist anterior y aborde cada punto no conforme
  • Forme a su personal para ofrecer una alternativa cuando un cliente tenga dificultades con el menú digital
  • Consulte las normas de accesibilidad para personas con movilidad reducida para verificar la coherencia entre su accesibilidad física y digital

La accesibilidad no es una restricción adicional. Es la continuidad lógica de lo que usted ya hace cada día: recibir a cada cliente y ofrecerle la mejor experiencia posible. Su menú digital debe llevar esa misma exigencia.

Cet article vous a-t-il été utile ?

Partager cet article :
Sophie - Rédaction ALaCarte
Sophie - Rédaction ALaCarte

FoodTech & Innovation Restauration

L'équipe éditoriale d'ALaCarte.Direct, spécialiste de la digitalisation des restaurants et de l'innovation FoodTech.

Articles similaires