Acessibilidade digital

1. Nosso compromisso

A Voh! entende acessibilidade como parte da qualidade técnica de um site, não como recurso extra. Isso vale para o que entregamos a clientes e vale, antes de tudo, para o nosso próprio site.

Também não fazemos disso um selo de marketing. Esta página declara conformidade parcial, porque é o que corresponde à realidade hoje. Site que se declara totalmente acessível sem auditoria externa costuma estar apenas se elogiando.

2. Base legal e referências técnicas

• Lei Brasileira de Inclusão (Lei 13.146/2015). O artigo 63 estabelece que sites mantidos por empresas com sede ou representação no Brasil devem ser acessíveis à pessoa com deficiência.
• Decreto 5.296/2004, que trata da acessibilidade em meios de comunicação e informação.
• WCAG 2.1, nível AA, do W3C, adotado como referência técnica de implementação.
• eMAG, modelo brasileiro de acessibilidade em governo eletrônico, usado como referência complementar de boas práticas em português.

O texto integral da Lei Brasileira de Inclusão está disponível na Lei 13.146/2015.

3. O que já está implementado

Cada item abaixo pode ser conferido no código-fonte desta página. Nenhum deles é declaração de intenção.

Estrutura e leitura por tecnologia assistiva

• HTML semântico com regiões identificadas: cabeçalho, navegação, conteúdo principal e rodapé.
• Hierarquia de títulos consistente, com um único título principal por página e subtítulos em ordem, sem pular níveis para efeito visual.
• Idioma declarado como português do Brasil, para o leitor de tela usar a pronúncia correta.
• Atributos ARIA no menu, informando quando um item abre submenu e se ele está aberto ou fechado.
• Trilha de navegação (breadcrumb) identificada, indicando onde você está dentro do site.
• Imagens decorativas ocultas da leitura, para não poluir a navegação com descrição de enfeite. Imagens informativas têm texto alternativo.
• Tabelas com cabeçalho e legenda associados, para leitura em sequência compreensível.

Navegação e interação

• Navegação completa por teclado. Menu, botões, campos e carrossel funcionam por tabulação, sem exigir mouse.
• Foco sempre visível, com contorno de 3 pixels na cor da marca e afastamento da borda, para você nunca perder de vista onde está.
• Carrossel com controles reais (anterior, próximo, ir para capítulo e pausar a passagem automática), e com todo o texto presente no código, não apenas no slide visível.
• Perguntas frequentes em elementos nativos de abrir e fechar, que funcionam mesmo sem JavaScript.
• Sem abertura automática de janela, som ou vídeo que comece sozinho.

Visual, cor e movimento

• Dois temas, claro e escuro, com paleta de cores ajustada em cada um. As cores de link e de botão mudam por tema justamente para manter contraste legível nos dois.
• Links em texto corrido são sublinhados, além de coloridos, para não depender só da cor.
• Preferência de movimento reduzido respeitada. Se o seu sistema pede menos animação, as transições, a passagem automática do carrossel e a demonstração de busca da página inicial são desativadas.
• Animação automática tem botão de pausa. A passagem de capítulos em Quem somos e a demonstração de busca da página inicial podem ser pausadas por um botão ao lado do bloco. Ambas também param sozinhas quando saem da tela ou quando a aba fica em segundo plano.
• Texto redimensionável. A tipografia usa unidades relativas e acompanha o zoom e o tamanho de fonte definido no navegador, sem quebrar o layout.
• Layout responsivo, utilizável em tela pequena e com zoom aplicado.

4. Formulário e canais de contato

• Todos os campos têm rótulo visível associado ao campo, e não apenas texto de exemplo dentro da caixa, que desaparece quando você começa a digitar.
• Campos obrigatórios são identificados de forma programática, e não só por um asterisco colorido.
• Mensagens de erro e de sucesso em texto, legíveis por leitor de tela, sem depender de cor para transmitir o significado.
• Sem captcha visual. A proteção contra robôs é feita por um campo oculto, e não por uma imagem distorcida ou por um teste de reconhecimento de figuras, que costumam ser barreira real para muita gente.
• Mais de um canal disponível. Se o formulário não funcionar para você, o WhatsApp e o e-mail resolvem igual. Nenhuma informação é exclusiva de um único canal.

5. Limitações que reconhecemos

Esta é a parte que a maior parte das declarações de acessibilidade omite:

• Não passamos por auditoria externa formal de acessibilidade. A verificação até aqui é interna, com testes de teclado, de contraste e de estrutura.
• Não fizemos testes amplos com pessoas usuárias de leitor de tela. Seguimos as práticas recomendadas, mas prática recomendada não substitui teste com quem usa.
• Não há atalho de "pular para o conteúdo" no início da página. É um recurso simples e útil para quem navega por teclado, e está na fila de melhorias.
• Não oferecemos tradução para Libras nem versão em áudio do conteúdo.
• O site depende de JavaScript para o menu, o carrossel e o envio do formulário. Sem JavaScript, o conteúdo continua legível, mas parte da navegação fica limitada. Os canais de e-mail e WhatsApp permanecem acessíveis.

Esta lista existe para ser reduzida com o tempo. Quando um item for resolvido, ele sai daqui e entra na seção 3.

6. Como relatar uma barreira

Se alguma parte deste site impediu ou dificultou o seu uso, queremos saber. Não é reclamação: é informação que não temos como obter sozinhos.

• Escreva para equipe@voh.com.br com o assunto Acessibilidade, ou fale pelo WhatsApp.
• Se puder, informe a página, o que você tentou fazer e, se souber, o navegador e a tecnologia assistiva usados. Se não puder, escreva do jeito que der: a gente investiga assim mesmo.
• Confirmamos o recebimento em até 24 horas úteis.
• Retornamos com um prazo de correção depois de reproduzir o problema. Barreira que impede o acesso à informação tem prioridade sobre qualquer melhoria estética na fila.
• Se a correção depender de mudança maior, dizemos isso com franqueza e oferecemos um caminho alternativo para você obter a informação enquanto isso.

7. Recursos que o seu aparelho já oferece

Além do que fizemos no site, o seu navegador e o seu sistema têm recursos que funcionam bem aqui:

• Zoom da página, com Ctrl e as teclas de mais ou menos (Command no Mac). O layout se reorganiza sem cortar conteúdo.
• Tamanho mínimo de fonte definido nas configurações do navegador, respeitado pelo site.
• Leitor de tela do sistema, como NVDA, JAWS, VoiceOver ou TalkBack, que se apoia na estrutura semântica das páginas.
• Modo de leitura do navegador, que funciona porque o conteúdo está em texto real, não em imagem.
• Preferência de movimento reduzido do sistema operacional, detectada automaticamente pelo site.
• Tema claro ou escuro, alternável pelo botão no topo do site, com a sua escolha memorizada no aparelho.

8. Por que isso também é assunto de SEO

Vale explicar, porque quase todo mundo trata os dois temas como assuntos separados: o buscador percorre uma página de forma parecida com um leitor de tela. Ambos dependem de estrutura, não de aparência.

Hierarquia de títulos coerente, texto alternativo em imagem, link com rótulo descritivo em vez de "clique aqui", HTML semântico e conteúdo em texto real ajudam a pessoa que usa tecnologia assistiva e o rastreador do Google pela mesma razão: os dois precisam entender o conteúdo sem enxergar o layout.

Por isso acessibilidade entra no trabalho que fazemos nos projetos, e não como item opcional de fim de escopo. Como isso se aplica no dia a dia está descrito na Política Editorial.

9. Revisão deste documento

Esta declaração é revisada sempre que uma mudança relevante for feita no site e sempre que uma barreira relatada for corrigida. A data de atualização e o número da versão ficam no topo da página.

Declaração de acessibilidade que envelhece sem revisão vira ficção. Se você encontrar aqui algo que não corresponde ao site, isso também é um erro que queremos corrigir.