Cardápio digital acessível: como facilitar o pedido para todos

A acessibilidade começa antes de o cliente escolher o prato

O cliente escaneia o QR code, o cardápio abre e a primeira decisão muitas vezes não é o que comer. É se o menu será fácil de usar.

Se o texto é pequeno, as categorias são difíceis de encontrar ou a página só funciona quando a pessoa consegue tocar em um botão minúsculo, o restaurante adicionou trabalho ao pedido. Esse esforço afeta clientes com baixa visão, mobilidade reduzida, dificuldades de leitura ou que usam tecnologia assistiva. Também afeta qualquer pessoa usando o celular sob luz forte, segurando-o com uma mão ou tentando fazer o pedido enquanto cuida de uma criança.

Um cardápio digital acessível não é um menu separado para um grupo pequeno. É um padrão mais claro para todo o salão. Ele ajuda o cliente a encontrar a categoria certa, entender um prato, conferir um ingrediente e fazer uma pergunta mais objetiva à equipe.

Se você quer primeiro a visão operacional mais ampla, leia Cardápio digital para restaurantes: como funciona, benefícios e por que adotar. Este guia se concentra na jornada do cliente: como tornar um cardápio por QR code mais fácil de ler, navegar e usar com confiança. É uma orientação prática, não uma avaliação de conformidade legal; as exigências podem variar conforme o país e o tipo de negócio.

1. Torne o primeiro escaneamento fácil de usar

A acessibilidade começa na passagem física e digital entre a mesa e o cardápio.

O QR code deve ser grande o suficiente para escanear, estar em um local acessível e ter contraste suficiente com o fundo. Coloque uma instrução curta ao lado, como “Escaneie para ver o cardápio”, em vez de presumir que todo cliente saberá o que fazer.

O escaneamento deve abrir uma página comum na web. Não exija o download de um aplicativo, uma conta ou uma sequência de pop-ups antes de mostrar a comida. Quem não consegue usar o QR code com conforto ainda deve ter outro caminho: uma URL curta, um cardápio impresso ou um membro da equipe pronto para ajudar.

Teste todo o fluxo nas condições em que ele será usado:

• sentado à mesa e em pé na fila,
• com a câmera normal do celular, não apenas com um leitor específico,
• usando dados móveis e também o Wi-Fi do restaurante,
• sob luz do dia e em um salão com pouca luz, e
• segurando o celular com uma mão.

Para mais verificações de posicionamento e escaneamento, veja Menu QR code: como funciona em um restaurante.

2. Permita que o cliente leia sem precisar dar zoom

Um cardápio desenhado em uma tela grande pode ficar frustrante no celular. Linhas longas, preços pequenos, cartões apertados e um layout que exige rolagem horizontal tornam o pedido mais difícil do que deveria ser.

Comece por uma tela estreita e faça as informações importantes funcionarem ali primeiro:

• use um tamanho de texto legível e um espaçamento confortável entre linhas,
• mantenha nome, descrição e preço visualmente conectados,
• use uma coluna quando várias colunas obrigarem o cliente a ampliar a tela,
• permita que o texto cresça sem esconder preços ou tirar controles da tela, e
• evite colocar detalhes essenciais dentro de uma imagem do cardápio.

A orientação da W3C sobre redimensionamento de texto no WCAG 2.2 descreve a expectativa de que o texto possa ser ampliado em até 200% sem perder conteúdo ou funcionalidade. O restaurante não precisa transformar o menu em um documento técnico para aplicar esse princípio. Aumente o tamanho do texto no celular e confira se ainda é possível acessar categorias, ler descrições e ver preços.

É também por isso que uma estrutura curta ajuda. O cliente não deveria precisar percorrer uma página inteira de texto pequeno para encontrar bebidas ou informações sobre dieta. Comece pelas categorias mais usadas e deixe claro como voltar à lista de categorias.

3. Use contraste e mais do que cores

O baixo contraste pode passar despercebido quando o menu parece bonito na tela do designer. Ele fica mais evidente ao ar livre, em um ambiente escuro ou para uma pessoa com sensibilidade reduzida ao contraste.

Use contraste forte entre o texto e o fundo, especialmente em preços, nomes de categorias e controles. O WCAG 2.2 define uma proporção de contraste de 4,5:1 para texto normal e 3:1 para texto grande no critério Contraste mínimo de nível AA. Esses números são referências úteis, mas não substituem a observação do menu em um celular real.

Não use a cor como única forma de comunicar uma informação. Um preço vermelho, uma etiqueta verde de dieta ou um ponto colorido pode ser invisível ou ambíguo para alguns clientes. Combine cores com palavras, ícones com rótulos ou outro tratamento visual claro:

• escreva “Vegetariano” em vez de mostrar apenas um símbolo verde,
• indique “Esgotado” em vez de apenas deixar o item mais apagado,
• escreva “Picante” e acrescente uma descrição curta em vez de usar somente pimentas vermelhas, e
• dê aos links e botões uma forma visível ou sublinhado, não apenas uma cor diferente.

A mesma regra ajuda quem lê sob reflexo ou em um celular com a tela danificada. O significado deve continuar claro mesmo em condições imperfeitas.

4. Dê espaço para tocar em cada controle

Links minúsculos de categoria e botões de idioma muito próximos são difíceis para qualquer pessoa usando um celular. Eles são especialmente frustrantes para clientes com mobilidade reduzida ou para quem navega enquanto está em uma fila.

Dê espaço interno e distância suficiente aos elementos interativos. O WCAG 2.2 inclui um critério de nível AA sobre tamanho mínimo dos alvos, com pelo menos 24 por 24 pixels CSS para alvos acionados por ponteiro, com algumas exceções. A equipe do restaurante não precisa medir cada detalhe visual à mão para aplicar a ideia: deixe o controle fácil de acertar, separe controles vizinhos e evite uma fileira de links pequenos que exige precisão.

Preste atenção especial a:

• seletor de idioma,
• navegação entre categorias,
• links para voltar ao menu,
• descrições ou observações de alergênicos que se expandem, e
• qualquer botão usado para abrir a foto ou a oferta do dia.

Se o cliente precisa tocar três vezes no mesmo controle até ele responder, o problema não é a técnica da pessoa. O controle precisa de mais espaço, de um estado mais claro ou de uma interação mais simples.

5. Dê ao cardápio uma estrutura que a tecnologia entenda

A hierarquia visual não é suficiente se a página não tem uma estrutura significativa por baixo. Um leitor de tela ou outra tecnologia assistiva precisa de títulos, listas, rótulos e links que descrevam o que fazem.

Organize o menu em uma ordem previsível:

1. Nome do restaurante e informações sobre o serviço atual.
2. Uma navegação de categorias claramente identificada.
3. Categorias como entradas, pratos principais, bebidas e sobremesas.
4. Nomes dos pratos, descrições, preços e observações de dieta ou alergênicos.
5. Uma forma clara de voltar à lista de categorias ou avançar para a próxima seção.

A orientação da W3C sobre a estrutura de menus recomenda rótulos curtos e descritivos e uma estrutura semântica para que pessoas possam entender e navegar por um menu usando tecnologias diferentes. Para um restaurante, isso significa que “Sobremesas” é um rótulo melhor do que um título decorativo que só faz sentido visualmente.

Fotos ajudam o cliente a imaginar um prato, mas não devem ser a única fonte de informação. Se uma imagem acrescenta um contexto importante, ofereça uma alternativa textual útil. Se ela é puramente decorativa, não deve interromper quem está ouvindo o menu. O Tutorial de imagens da W3C explica como a alternativa correta depende da finalidade da imagem.

Essa é uma das razões pelas quais um menu feito para a web é mais fácil de melhorar do que um PDF ou uma coleção de capturas de tela. O texto pode ser ampliado, selecionado, traduzido e interpretado como conteúdo, em vez de ficar preso dentro de uma imagem.

6. Escreva para ajudar decisões, não apenas para decorar

Um texto acessível geralmente é um texto útil. O cliente deve conseguir entender o item sem conhecer de antemão as abreviações do restaurante.

Troque descrições vagas pelos detalhes que mudam a decisão:

• ingredientes principais,
• preparo ou perfil de sabor,
• porção ou tamanho,
• se o acompanhamento está incluído,
• alergênicos comuns e informações sobre dietas, e
• se o item é picante, cru, muito quente ou pensado para compartilhar.

Por exemplo:

Polvo grelhado — polvo macio com batatas, páprica defumada e limão; servido quente.

Essa frase traz mais informação útil do que apenas o nome, sem transformar o cardápio em uma receita. Mantenha nomes locais quando eles fizerem parte da experiência e acrescente a explicação de que um cliente de primeira viagem precisa.

O mesmo cuidado se aplica às opções de idioma. Um cardápio traduzido deve preservar as informações necessárias para uma escolha segura, e as versões original e traduzida devem ser atualizadas juntas. Como atrair turistas com um cardápio de restaurante multilíngue explica o processo para escolher idiomas, revisar termos culinários e manter as versões alinhadas.

Informações sobre alergênicos exigem uma revisão específica por alguém que conheça a cozinha. Um menu digital facilita a atualização de uma observação, mas não torna segura uma informação incerta sobre ingredientes. Se a cozinha mudar uma receita, atualize o cardápio público e avise a equipe antes do próximo serviço.

7. Teste a jornada do cliente com restrições reais

Um checklist de acessibilidade é útil, mas um teste com um cliente real revela problemas que a equipe deixou de perceber.

Peça para alguém que não conhece o menu realizar algumas tarefas:

• encontrar um prato principal vegetariano,
• comparar dois pratos parecidos,
• trocar o idioma,
• verificar se uma sobremesa contém um alergênico comum,
• encontrar o especial do dia, e
• voltar à lista de categorias depois de abrir a foto de um prato.

Observe sem explicar a interface. Perceba onde a pessoa hesita, toca no elemento errado, se perde ou pede uma informação que já deveria estar visível.

Repita o teste com algumas restrições úteis:

• aumente o tamanho do texto no celular,
• use um leitor de tela se alguém da equipe souber fazê-lo,
• navegue com um teclado ao testar a página web por trás do menu,
• use dados móveis, e
• teste um celular mais antigo, não apenas o modelo mais novo.

O objetivo não é afirmar que um teste curto prova acessibilidade completa. É encontrar o atrito que a equipe não vê mais porque conhece o menu de cor. A orientação da W3C para escrever na web é uma boa referência complementar para revisar títulos, textos de links, alternativas de imagens e instruções claras.

Checklist prático para um cardápio digital acessível

Antes de colocar um QR code em todas as mesas, confira o básico:

1. O QR code está visível, pode ser escaneado e tem uma instrução curta ao lado.
2. O cliente abre o menu sem aplicativo, conta ou pop-up desnecessário.
3. A primeira tela funciona em um celular estreito sem rolagem horizontal.
4. O texto continua utilizável quando o tamanho da fonte do celular aumenta.
5. Texto, preços, links e controles têm contraste suficiente.
6. A cor não é a única forma de comunicar etiquetas de dieta, disponibilidade ou estado.
7. Categorias e botões têm espaço suficiente para tocar sem precisão.
8. Títulos, listas, preços, descrições e alternativas de imagens têm significado além do estilo visual.
9. Informações sobre ingredientes, alergênicos, dietas, preços e idiomas estão atualizadas.
10. A equipe pode oferecer um cardápio impresso ou ajuda pessoal quando o caminho digital não funcionar.

Você não precisa resolver tudo em um único redesign. Corrija a primeira tela, as categorias mais usadas e as informações que os clientes mais perguntam. Depois, repita o teste na próxima atualização do menu.

Facilitar o acesso também é uma forma de hospitalidade

Um cardápio digital acessível torna as decisões comuns do restaurante menos cansativas. Ele ajuda o cliente a ler a oferta do seu jeito, entender um prato desconhecido, conferir um ingrediente importante e chegar à conversa com a equipe mais preparado.

Ele também dá à equipe um padrão mais claro para manter o menu. Quando preços, especiais, observações de dieta, traduções e fotos são tratados como informações para o cliente, e não apenas como decoração, fica mais fácil revisar as atualizações e evitar que os dados se desencontrem.

A Menuit ajuda restaurantes a transformar um cardápio existente em um menu adaptado ao celular que pode ser revisado, traduzido e atualizado em um só lugar. É um sistema de cardápio, não uma plataforma de pedidos ou pagamentos, e não elimina a necessidade de apoio da equipe ou de uma revisão cuidadosa dos alergênicos.

Se o seu cardápio por QR code faz os clientes dar zoom, procurar informações em imagens ou repetir as mesmas perguntas em todos os turnos, comece por uma área do serviço. Abra o menu em um celular de verdade, observe alguém que não conhece o restaurante e facilite a próxima escolha.