# Acessibilidade

A regra que vale acima de todas: ninguém fica de fora. Todas as frases de desempate do Conceito terminam aqui.

## O piso

Acessível não é opcional. Se uma ideia bonita deixa alguém de fora, a ideia muda. O piso é o WCAG 2.2 nível AA, conferido por teste sempre que possível, e o resto por uma lista que alguém percorre à mão.

## Regras

### O teclado chega em tudo

Tudo que se clica se alcança com Tab e se usa com Enter ou Espaço, na ordem da leitura. O foco aparece sempre, com o contorno laranja do Feitio.

[um link](#teclado)Aperte Tab para ver o foco andar.

### Contraste testado

Todo par de cor que carrega texto ou significado passa 4,5 (texto) ou 3 (formas), de dia e à noite; o build reprova se cair. Veja [Cor](/pt/design/cor/#contraste).

### A cor nunca fala sozinha

Estado sempre com ícone e palavra; link sempre sublinhado.

### Alvos de toque

44px no confortável, 40 no compacto. O botão pequeno desenha 32, mas o toque pega 40. Nunca abaixo dos 24 do WCAG.

### Estrutura de verdade

Um título 1 por página e títulos em ordem; regiões marcadas (cabeçalho, navegação, conteúdo); campos com rótulo; erros ligados ao campo e resumidos no topo.

### O navegador primeiro

Os elementos do navegador (botão, link, `details`, `dialog`, `popover`) já chegam acessíveis. O script acrescenta, e nunca tira o teclado nem o leitor de tela.

### Menos movimento quando pedido

O sistema pede, o Feitio para tudo.

## Como se confere

-   **Automático:** teste de contraste em cada tema; axe-core em cada página, de dia, à noite e na densidade compacta; nenhuma rolagem lateral no mobile.
-   **À mão, a cada componente novo:** percorrer tudo só com o teclado; ouvir a página num leitor de tela; aumentar o texto para 200%; ligar o movimento reduzido.
-   **O que o teste não vê** (cerca de metade dos problemas, segundo o próprio axe-core): o texto faz sentido? A ordem do foco é a da leitura? O aviso chega a quem não enxerga?