WCAG - Guia de Consulta Rápida
Sugestões para usar o filtro:
- Quer saber quais são os novos critérios WCAG 2.1? Insira "wcag 2.1";
- Quer saber quais diretrizes se referem a contraste? Insira "contraste";
- Procura por critérios relacionadas a mensagens de erro? Insira "erro";
- Quer ver apenas as diretrizes do princípio Compreensível? Insira "compreensível";
- Enfim... divirta-se! :)
-
1.1.1 - Conteúdo não textual [A]
acessar Critério de Sucesso 1.1.1 link externo em inglês (em inglês)
Perceptível
Alternativas em texto
Todo conteúdo “não textual” deve trazer uma alternativa em texto para identificar o conteúdo.
Nota: a não ser que o conteúdo seja apenas decorativo ou represente uma das exceções descritas do critério completo (captcha e imagens de teste, inclusive).
-
1.2.1 - Apenas áudio ou apenas vídeo (pré-gravado) [A]
acessar Critério de Sucesso 1.2.1 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Deve ser fornecida uma alternativa para o conteúdo apresentado:
Apenas áudio: fornecer transcrição descritiva em texto
Apenas vídeo: fornecer áudio alternativo e/ou transcrição descritiva em texto
-
1.2.2 - Legendas (pré-gravado) [A]
acessar Critério de Sucesso 1.2.2 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Devem ser fornecidas legendas para todo conteúdo que contenha áudio pré-gravado (apenas áudio ou vídeo com áudio).
-
1.2.3 - Audiodescrição ou mídia alternativa (pré-gravado) [A]
acessar Critério de Sucesso 1.2.3 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Deve ser fornecida audiodescrição ou uma transcrição descritiva em texto para todo conteúdo em vídeo pré-gravado.
Nota: se for fornecida audiodescrição, o critério 1.2.5 (AA) estará atendido. Se for fornecida uma mídia alternativa, o critério 1.2.8 (AAA) estará atendido.
-
1.2.4 - Legendas (ao vivo) [AA]
acessar Critério de Sucesso 1.2.4 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Devem ser fornecidas legendas para todo conteúdo que contenha áudio ao vivo (apenas áudio ou vídeo com áudio).
-
1.2.5 - Audiodescrição (pré-gravado) [AA]
acessar Critério de Sucesso 1.2.5 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Deve ser fornecida audiodescrição para todo conteúdo em vídeo pré-gravado.
Nota: ver em conjunto com critério 1.2.7.
Nota 2: ao atender este critério, o critério 1.2.3 (A) também estará atendido.
-
1.2.6 - Língua de sinais (pré-gravado) [AAA]
acessar Critério de Sucesso 1.2.6 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Deve ser fornecida interpretação em língua de sinais (exemplo: Libras) para todo conteúdo que contenha áudio pré-gravado.
-
1.2.7 - Audiodescrição estendida (pré-gravado) [AAA]
acessar Critério de Sucesso 1.2.7 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Se não for possível manter uma faixa de audiodescrição em conjunto com o áudio original do vídeo (exemplo: sobreposição das falas), deve-se fornecer uma alternativa que permita pausar o vídeo, reproduzir a audiodescrição e, em seguida, retomar o vídeo.
-
1.2.8 - Mídia alternativa (pré-gravado) [AAA]
acessar Critério de Sucesso 1.2.8 link externo (em inglês)
Perceptível
Multimídia baseada em tempo
Deve ser fornecida uma transcrição descritiva do conteúdo em texto para todo conteúdo em vídeo pré-gravado.
Nota: ao atender este critério, o critério 1.2.3 (A) também estará atendido.
-
1.2.9 - Apenas áudio (ao vivo) [AAA]
acessar Critério de Sucesso 1.2.9 link externo em inglês (em inglês)
Perceptível
Multimídia baseada em tempo
Deve ser fornecida uma transcrição descritiva em texto para todo conteúdo apresentado ao vivo.
-
1.3.1 - Informações e Relações [A]
acessar Critério de Sucesso 1.3.1 link externo em inglês (em inglês)
Perceptível
Adaptável
A estrutura e as relações entre os componentes da tela devem fazer sentido tanto para a visão quanto para a audição.
Nota para DEV: código semanticamente correto atende completamente este critério.
-
1.3.2 - Sequência com significado [A]
acessar Critério de Sucesso 1.3.2 link externo em inglês (em inglês)
Perceptível
Adaptável
A ordem de leitura e a navegação pelos componentes em tela deve fazer sentido para o usuário.
Nota: a ordem estrutural dos componentes visíveis em tela deve ser a mesma ao se reproduzir o conteúdo através de um leitor de telas.
Nota 2: utilizar em conjunto com critério 2.4.3.
-
1.3.3 - Características sensoriais [A]
acessar Critério de Sucesso 1.3.3 link externo em inglês (em inglês)
Perceptível
Adaptável
Qualquer tipo de instrução não deve depender apenas de forma, tamanho, localização visual ou som.
Exemplos: evitar "clique no botão verde", "clique no botao abaixo" ou "ao ouvir o bip, selecione uma opção".
-
WCAG 2.1
1.3.4 - Orientação [AA]
acessar Critério de Sucesso 1.3.4 link externo em inglês (em inglês)
Perceptível
Adaptável
Funcionalidades não devem depender de uma determinada orientação de tela (exemplo: virar o celular na horizontal) a não ser que seja imprescindível para execução da função.
-
WCAG 2.1
1.3.5 - Identificar o objetivo de entrada [AA]
acessar Critério de Sucesso 1.3.5 link externo em inglês (em inglês)
Perceptível
Adaptável
O objetivo de entrada de um campo deve ser claramente definido (exemplo: para um campo de e-mail, deve-se aplicar corretamente o tipo de entrada de dados e-mail - input type="e-mail") e sempre que possível, deve-se habilitar o atributo de auto-completar.
Nota: ver em conjunto com os critérios 2.4.6 e 3.3.2.
-
WCAG 2.1
1.3.6 - Identificar o objetivo [AAA]
acessar Critério de Sucesso 1.3.6 link externo em inglês (em inglês)
Perceptível
Adaptável
O significado e objetivo de todos os elementos em tela devem ser claramente definidos para que o conteúdo (que será ouvido) seja compreensível o suficiente para que o usuário possa personalizar a leitura da forma como melhor se adequar.
Nota para DEV: aplicar corretamente ARIA REGIONS e METADADOS.
-
1.4.1 - Utilização de cores [A]
acessar Critério de Sucesso 1.4.1 link externo em inglês (em inglês)
Perceptível
Discernível
Cores não devem ser utilizadas como única maneira de transmitir conteúdo ou distinguir elementos visuais.
Exemplo: uma mensagem de erro em formulário deve trazer indicações visuais, textos e também mudança de cor do formulário (e não apenas a mudança de cor).
-
1.4.2 - Controle de áudio [A]
acessar Critério de Sucesso 1.4.2 link externo em inglês (em inglês)
Perceptível
Discernível
Deve ser fornecido um mecanismo para pausar, deixar mudo ou ajustar o volume para qualquer áudio que toque automaticamente por mais de 3 segundos.
-
1.4.3 - Contraste (mínimo) [AA]
acessar Critério de Sucesso 1.4.3 link externo em inglês (em inglês)
Perceptível
Discernível
Textos devem ter uma relação de contraste* entre primeiro e segundo plano de ao menos 4.5:1.
Nota: textos em tamanhos de fontes maiores (a partir de 18pt ou 14pt bold) podem ter uma relação de contraste de 3:1.
Nota 2: ver critério completo para entender relação de contraste.
-
1.4.4 - Redimensionar texto [AA]
acessar Critério de Sucesso 1.4.4 link externo em inglês (em inglês)
Perceptível
Discernível
O conteúdo em texto deve ser legível e funcional mesmo quando a tela for ampliada em até 200% do seu tamanho padrão.
-
1.4.5 - Imagens de texto [AA]
acessar Critério de Sucesso 1.4.5 link externo em inglês (em inglês)
Perceptível
Discernível
Evitar o uso de textos em imagens a não ser que sejam essenciais (exemplo: marcas e logos) ou que possam ser personalizadas pelo usuário.
-
1.4.6 - Contraste (melhorado) [AAA]
acessar Critério de Sucesso 1.4.6 link externo em inglês (em inglês)
Perceptível
Discernível
Textos devem ter uma relação de contraste* entre primeiro e segundo plano de ao menos 7:1.
Nota: textos em tamanhos de fontes maiores (a partir de 18pt ou 14pt bold) podem ter uma relação de contraste de 4.5:1.
Nota 2: ver critério completo para entender relação de contraste.
-
1.4.7 - Som baixo ou sem som de fundo [AAA]
acessar Critério de Sucesso 1.4.7 link externo em inglês (em inglês)
Perceptível
Discernível
Qualquer tipo de som que não seja voz em um áudio ou vídeo pré-gravado, deverá ser baixo o suficiente (ou inexistente) para que o usuário não tenha dificuldade de compreensão da voz principal.
-
1.4.8 - Apresentação visual [AAA]
acessar Critério de Sucesso 1.4.8 link externo em inglês (em inglês)
Perceptível
Discernível
Deve ser fornecido um mecanismo que possibilite o usuário controlar a apresentação de blocos de texto.
O mecanismo deve possibilitar ao usuário efetuar o ajuste de cores entre primeiro e segundo plano, manter a largura de texto em até 80 caracteres e configurar o espaçamento entre linhas e parágrafos.
-
1.4.9 - Imagens de texto (sem exceção) [AAA]
acessar Critério de Sucesso 1.4.9 link externo em inglês (em inglês)
Perceptível
Discernível
Evitar o uso de textos em imagens a não ser que sejam essenciais (exemplo: marcas e logos).
Nota: ao atender este critério, o critério 1.4.5 (AA) também estará atendido.
-
WCAG 2.1
1.4.10 - Refluxo [AA]
acessar Critério de Sucesso 1.4.10 link externo em inglês em inglês (em inglês)
Perceptível
Discernível
Ao se aplicar zoom de até 400% na tela, não deverá ocorrer rolagem (scroll) vertical e horizontal ao mesmo tempo.
-
WCAG 2.1
1.4.11 - Contraste
Não-Textual [AA]acessar Critério de Sucesso 1.4.11 link externo em inglês (em inglês)
Perceptível
Discernível
Componentes de interface (exemplo: botões) e imagens essenciais para o entendimento do conteúdo devem ter uma relação de contraste entre primeiro e segundo plano de ao menos 3:1.
Nota: ver critério completo e em conjunto com 1.4.3 e 1.4.6.
-
WCAG 2.1
1.4.12 - Espaçamento
de texto [AA]acessar Critério de Sucesso 1.4.12 link externo em inglês (em inglês)
Perceptível
Discernível
Não deve ocorrer nenhuma perda de conteúdo ou funcionalidade quando o usuário adapta o conteúdo em tela para:
Entrelinhas de ao menos 1.5x o tamanho da fonte; Paragráfos de ao menos 2x o tamanho da fonte.
Nota: ver critério completo para mais informações.
-
WCAG 2.1
1.4.13 - Conteúdo em foco por mouse ou teclado [AA]
acessar Critério de Sucesso 1.4.13 link externo em inglês (em inglês)
Perceptível
Discernível
Conteúdos adicionais (exemplo: tooltip ou sub-menu) não devem ser acionados apenas com foco por mouse (mouseover) ou teclado. Caso isso ocorra, certas condições devem ser atendidas.
Nota: ver critério completo para verificar as condições.
-
2.1.1 - Teclado [A]
acessar Critério de Sucesso 2.1.1 link externo em inglês (em inglês)
Operável
Acessível por teclado
Toda funcionalidade deve estar disponível para utilização com teclado, a menos que a funcionalidade não possibilite o controle apenas por teclado.
-
2.1.2 - Sem bloqueio de teclado [A]
acessar Critério de Sucesso 2.1.2 link externo em inglês (em inglês)
Operável
Acessível por teclado
Deve ser possível navegar de e para todos os elementos sem qualquer tipo de bloqueio de teclado.
-
2.1.3 - Teclado (sem exceção) [AAA]
acessar Critério de Sucesso 2.1.3 link externo em inglês (em inglês)
Operável
Acessível por teclado
Toda funcionalidade deve estar disponível para utilização com teclado.
Nota: ao atender este critério, o critério 2.1.1 (A) também estará atendido.
-
WCAG 2.1
2.1.4 - Atalhos de teclado por caractere [A]
acessar Critério de Sucesso 2.1.4 link externo em inglês (em inglês)
Operável
Acessível por teclado
Deve-se evitar a criação de atalhos de teclado utilizando apenas simples caracteres (letras, números, pontuações, etc). Caso isso ocorra, certas condições devem ser atendidas.
Nota: ver critério completo para verificar as condições.
-
2.2.1 - Ajustável por limite de tempo [A]
acessar Critério de Sucesso 2.2.1 link externo em inglês (em inglês)
Operável
Tempo suficiente
Se uma aplicação possui um limite de tempo, o usuário deve ter opções para desligar ou ajustar o tempo. A não ser que seja uma situação onde o tempo seja essencial.
Nota: recomendado utilizar em conjunto com critério 2.2.6.
-
2.2.2 - Colocar em pausa, parar ou ocultar [A]
acessar Critério de Sucesso 2.2.2 link externo em inglês (em inglês)
Operável
Tempo suficiente
Qualquer componente com movimento automático que dure mais do que 5 segundos e seja apresentado em conjunto com outro conteúdo, pode ser pausado, parado ou ocultado pelo usuário.
-
2.2.3 - Sem limite de tempo [AAA]
acessar Critério de Sucesso 2.2.3 link externo em inglês (em inglês)
Operável
Tempo suficiente
Nenhuma funcionalidade deve possuir limite de tempo para que uma ação seja executada.
-
2.2.4 - Interrupções [AAA]
acessar Critério de Sucesso 2.2.4 link externo em inglês (em inglês)
Operável
Tempo suficiente
Qualquer tipo de interrupção no conteúdo que possa confundir o usuário deve possuir um mecanismo que permita o seu desligamento ou adiamento, a não ser que envolva uma emergência que preserve a saúde, segurança ou bens do usuário.
-
2.2.5 - Nova autenticação [AAA]
acessar Critério de Sucesso 2.2.5 link externo em inglês (em inglês)
Operável
Tempo suficiente
Caso uma sessão autenticada expire, qualquer usuário logado deve ser capaz de continuar sua atividade sem qualquer perda de dados, ao se efetuar uma nova autenticação no ambiente.
-
WCAG 2.1
2.2.6 - Limites de
tempo [AAA]acessar Critério de Sucesso 2.2.6 link externo em inglês (em inglês)
Operável
Tempo suficiente
Caso a inatividade do usuário resulte em perda de dados preenchidos anteriormente, ele deverá saber qual é o tempo limite (e restante) antes que ocorra a perda automática de dados. A menos que esse limite seja superior a 20 horas.
Nota: recomendado utilizar em conjunto com critério 2.2.1.
-
2.3.1 - Três flashes ou abaixo do limite [A]
acessar Critério de Sucesso 2.3.1 link externo em inglês (em inglês)
Operável
Ataques epiléticos
Nenhum conteúdo da página deve piscar mais do que 3 vezes por segundo, a não ser que os flashes estejam em baixo contraste ou possuam pouco vermelho.
-
2.3.2 - Três flashes [AAA]
acessar Critério de Sucesso 2.3.2 link externo em inglês (em inglês)
Operável
Ataques epiléticos
Nenhum conteúdo da página deve piscar mais do que 3 vezes por segundo.
-
WCAG 2.1
2.3.3 - Animações
de interações [AAA]acessar Critério de Sucesso 2.3.3 link externo em inglês (em inglês)
Operável
Ataques epiléticos
Qualquer tipo de animação de interação não essencial e acionada pelo usuário (exemplo: rolagem com efeito parallax) deve ter um mecanismo para que o usuário desligue a animação.
Nota: diferentemente do critério 2.2.2, este refere-se ao acionamento pelo próprio usuário.
-
2.4.1 - Ignorar blocos [A]
acessar Critério de Sucesso 2.4.1 link externo em inglês (em inglês)
Operável
Navegável
Um mecanismo deve ser fornecido para ignorar blocos de conteúdo que são repetidos em diferentes telas e fluxos.
Nota: este critério poderá ser considerado atendido nos casos em que houver uma adequada estrutura de cabeçalhos. Ver critérios 2.4.2 e 2.4.10.
-
2.4.2 - Página com título [A]
acessar Critério de Sucesso 2.4.2 link externo em inglês (em inglês)
Operável
Navegável
Páginas ou telas devem possuir um título que descreva claramente a sua finalidade.
-
2.4.3 - Ordem do foco [A]
acessar Critério de Sucesso 2.4.3 link externo em inglês (em inglês)
Operável
Navegável
A navegação (através de um teclado) por elementos focáveis em tela deve ser sequencial e lógica de acordo com o conteúdo apresentado.
Nota: utilizar em conjunto com critério 1.3.2.
-
2.4.4 - Finalidade do link (em contexto) [A]
acessar Critério de Sucesso 2.4.4 link externo em inglês (em inglês)
Operável
Navegável
A finalidade de cada link deve ser determinada a partir do texto do próprio link ou a partir do contexto no entorno.
-
2.4.5 - Várias formas [AA]
acessar Critério de Sucesso 2.4.5 link externo em inglês (em inglês)
Operável
Navegável
O usuário sempre deve ter opções e formas diferentes para acessar ou localizar um determinado conteúdo.
Exemplo: um mesmo conteúdo pode ser acessado por um menu de navegação e também um campo de busca no site.
-
2.4.6 - Cabeçalhos e rótulos [AA]
acessar Critério de Sucesso 2.4.6 link externo em inglês (em inglês)
Operável
Navegável
Títulos e sub-títulos de conteúdos e rótulos (labels) de formulários devem descrever claramente a finalidade dos elementos ou agrupamentos sem que haja ambiguidade em seu entendimento.
Nota: ver em conjunto com critérios 1.3.5 e 2.4.2.
-
2.4.7 - Foco visível [AA]
acessar Critério de Sucesso 2.4.7 link externo em inglês (em inglês)
Operável
Navegável
Ao se navegar por teclado (ou toque) deve ser possível identificar visualmente e facilmente qual elemento da página ou tela tem o foco no momento.
Importante: Assim que a versão 2.2 da WCAG for lançada, este critério será promovido ao nível A.
-
2.4.8 - Localização [AAA]
acessar Critério de Sucesso 2.4.8 link externo em inglês (em inglês)
Operável
Navegável
Deve ser fornecido um meio para o usuário se orientar entre os conteúdos de um mesmo conjunto de páginas ou telas.
Exemplo: utilizar um breadcrumb.
-
2.4.9 - Finalidade do link (apenas link) [AAA]
acessar Critério de Sucesso 2.4.9 link externo em inglês (em inglês)
Operável
Navegável
A finalidade de cada link deve ser determinada a partir do texto do próprio link.
Nota: ao atender este critério, o critério 2.4.4 (A) também estará atendido.
-
2.4.10 - Cabeçalhos da seção [AAA]
acessar Critério de Sucesso 2.4.1 link externo (em inglês)
Operável
Navegável
Sempre que possível, deve-se fornecer títulos em diferentes sessões e níveis, permitindo que o usuário identifique facilmente a hierarquia das informações em um determinado conteúdo.
Nota: este critério abrange exclusivamente conteúdo textual, não confundir com 4.1.2.
-
WCAG 2.2
2.4.11 - Aparência do foco (mínimo) [AA]
acessar Critério de Sucesso 2.4.11 link externo em inglês (em inglês)
Operável
Navegável
ATENÇÃO: Este critério é um rascunho!
Sempre que o foco visível for exibido, ele deverá possuir 1 pixel de área e será preciso ter um espaçamento mínimo entre ele e o conteúdo e o relacionamento de contraste com áreas adjacentes precisa ser suficiente.
Nota: ao atender este critério, o critério 2.4.7 também estará atendido.
-
WCAG 2.2
2.4.12 - Aparência do foco (melhorado) [AAA]
acessar Critério de Sucesso 2.4.12 link externo em inglês (em inglês)
Operável
Navegável
ATENÇÃO: Este critério é um rascunho!
Sempre que o foco visível for exibido, ele deverá possuir 2 pixels de área, além de seguir os padrões do critério 2.4.11.
Nota: ao atender este critério, os critérios 2.4.7 e 2.4.11 também estarão atendidos.
-
WCAG 2.2
2.4.13 - Pontos de referências fixos [A]
acessar Critério de Sucesso 2.4.13 link externo em inglês (em inglês)
Operável
Navegável
ATENÇÃO: Este critério é um rascunho!
Sempre que uma referêncisa a uma determinada parte de um documento eletrônico (exemplo: PDF) for fornecida, deverá ser possível navegar por este documento através de um índice facilitando a localização de qualquer sessão do documento.
-
WCAG 2.1
2.5.1 - Gestos de acionamento [A]
acessar Critério de Sucesso 2.5.1 link externo em inglês (em inglês)
Operável
Modalidade de Entrada
Nenhuma funcionalidade deve ser baseada em uma movimentação complexa (exemplo: arraste com 3 dedos para direita), a menos que seja uma funcionalidade essencial e não haja outra alternativa.
-
WCAG 2.1
2.5.2 - Cancelamento
de acionamento [A]acessar Critério de Sucesso 2.5.2 link externo em inglês (em inglês)
Operável
Modalidade de Entrada
Deve ser possível cancelar ou reverter qualquer ação que envolva clique ou toque simples. Algumas condições precisam ser atendidas.
Nota: ver critério completo para verificar as condições.
-
WCAG 2.1
2.5.3 - Rótulo no
nome acessível [A]acessar Critério de Sucesso 2.5.3 link externo em inglês (em inglês)
Operável
Modalidade de Entrada
Qualquer rótulo (label) visível deve ser lido exatamente da mesma forma por leitores de tela. Caso haja descrição adicional, o rótulo visível deverá ser o primeiro a ser lido (exemplo: em um botão, cujo rótulo seja "compre já", a leitura deverá ser semelhante a "compre já o produto XYZ").
Nota: ver critério completo.
-
WCAG 2.1
2.5.4 - Atuação em movimento [A]
acessar Critério de Sucesso 2.5.4 link externo em inglês (em inglês)
Operável
Modalidade de Entrada
Qualquer funcionalidade que exija a movimentação do aparelho (exemplo: “agitar para desfazer”) deve oferecer um mecanismo para ser desativada e caso seja uma função essencial, a interface deve oferecer uma alternativa de acionamento.
-
WCAG 2.1
2.5.5 - Tamanho da
área clicável [AAA]acessar Critério de Sucesso 2.5.5 link externo em inglês (em inglês)
Operável
Modalidade de Entrada
O tamanho de áreas clicáveis devem ser de ao menos 44x44 pixels, a não ser que a área clicável esteja em uma frase ou bloco de texto.
-
WCAG 2.1
2.5.6 - Mecanismos de entrada simultâneos [AAA]
acessar Critério de Sucesso 2.5.6 link externo em inglês (em inglês)
Operável
Modalidade de Entrada
Não deve-se restringir o uso de dispositivos diferentes para se operar uma plataforma (exemplo: usuários com deficiência motora, podem acoplar um teclado móvel a um celular para operá-lo), a não ser que essa restrição seja essencial ou necessária para se garantir a segurança do conteúdo.
-
WCAG 2.2
2.5.7 - Arrastando (Dragging) [AA]
acessar Critério de Sucesso 2.5.7 link externo em inglês (em inglês)
Operável
Navegável
ATENÇÃO: Este critério é um rascunho!
Qualquer funcionalidade que dependa de um movimento de arrastar (drag) deve ter também uma alternativa de uso onde seja possível efetuar a operação sem que haja a necessidade de se arrastar.
-
WCAG 2.2
2.5.8 - Espaçamento
da área clicável [AA]acessar Critério de Sucesso 2.5.8 link externo em inglês (em inglês)
Operável
Navegável
ATENÇÃO: Este critério é um rascunho!
A distância das áreas clicáveis precisam ter no mínimo 44 pixels na altura e na largura entre elementos adjacentes, isso inclui a soma do elemento em si (alvo) e o espaçamento entre cada um dos elementos clicáveis.
-
3.1.1 - Idioma da página [A]
acessar Critério de Sucesso 3.1.1 link externo em inglês (em inglês)
Compreensível
Legível
O idioma do conteúdo deve ser definido em cada uma das páginas ou telas da aplicação.
-
3.1.2 - Idioma das partes [AA]
acessar Critério de Sucesso 3.1.2 link externo em inglês (em inglês)
Compreensível
Legível
O idioma de um determinado trecho ou frase contendo idioma diferente do original da página ou tela atual, deve ser definido e corretamente identificado.
Nota: ver em conjunto com critério 3.1.1.
-
3.1.3 - Palavras incomuns [AAA]
acessar Critério de Sucesso 3.1.3 link externo em inglês (em inglês)
Compreensível
Legível
Caso use palavras técnicas ou jargões, forneça um glossário ou explicações que informem ao usuário seu significado.
-
3.1.4 - Abreviações [AAA]
acessar Critério de Sucesso 3.1.4 link externo em inglês (em inglês)
Compreensível
Legível
Abreviações e/ou acrônimos devem ser identificados diretamente no conteúdo ou por meio de uma forma que possibilite a apresentação de sua definição por extenso.
-
3.1.5 - Nível de leitura [AAA]
acessar Critério de Sucesso 3.1.5 link externo em inglês (em inglês)
Compreensível
Legível
Caso um determinado conteúdo seja tão complexo a ponto de um usuário com ensino fundamental completo* não ser capaz de entender, será necessário a sua revisão ou a utilização de conteúdo complementar que facilite o seu entendimento.
Nota: *baseado em níveis internacionais (UNESCO)
-
3.1.6 - Pronúncia [AAA]
acessar Critério de Sucesso 3.1.6 link externo em inglês (em inglês)
Compreensível
Legível
Deve-se fornecer um mecanismo que identifique a pronúncia correta de determinadas palavras que possam gerar ambiguidade fora do contexto.
-
3.2.1 - Em foco [A]
acessar Critério de Sucesso 3.2.1 link externo em inglês (em inglês)
Compreensível
Previsível
Quando um componente recebe foco, nenhum tipo de mudança contextual que possa confundir o usuário, deve ser efetuada.
Nota: ver em conjunto com critério 3.2.2.
-
3.2.2 - Em entrada [A]
acessar Critério de Sucesso 3.2.2 link externo em inglês (em inglês)
Compreensível
Previsível
Quando houver uma interação com um campo de entrada de dados (formulário) ou um tipo de controle (exemplo: switch), nenhuma mudança contextual na tela deverá acontecer a não ser que o usuário tenha sido informado que essa mudança ocorreria.
Nota: ver em conjunto com critério 3.2.1.
-
3.2.3 - Navegação consistente [AA]
acessar Critério de Sucesso 3.2.3 link externo em inglês (em inglês)
Compreensível
Previsível
Componentes de navegação de um mesmo site ou aplicação que são exibidos em telas diferentes, devem ser apresentados sempre na mesma posição em relação aos demais componentes (exemplo: tab bar em um aplicativo).
-
3.2.4 - Identificação consistente [AA]
acessar Critério de Sucesso 3.2.4 link externo em inglês (em inglês)
Compreensível
Previsível
Componentes de navegação de um mesmo site ou aplicação que são exibidos em telas diferentes, mas possuem a mesma funcionalidade, devem ser identificados sempre da mesma forma (exemplo: identificação clara determinando a aparência de um item clicável em tela).
-
3.2.5 - Alteração a pedido [AAA]
acessar Critério de Sucesso 3.2.5 link externo em inglês (em inglês)
Compreensível
Previsível
Qualquer alteração de contexto na tela, que possa desorientar o usuário, só deve ocorrer após uma ação de confirmação do próprio usuário, a não ser que um mecanismo para cancelar a ação seja disponibilizado.
Nota: ao atender este critério, o critério 3.2.1 (A) também estará atendido.
-
WCAG 2.2
3.2.6 - Ajuda
localizável [A]acessar Critério de Sucesso 3.2.6 link externo em inglês (em inglês)
Compreensível
Previsível
ATENÇÃO: Este critério é um rascunho!
Deve ser fornecido um mecanismo de ajuda completa para o caso de um usuário não conseguir completar uma tarefa. Este mecanismo pode ser um número de telefone, e-mail, chat, formulário de contato, mídia social ou qualquer meio que possibilite o contato humano.
-
WCAG 2.2
3.2.7 - Controles
ocultos [AA]acessar Critério de Sucesso 3.2.7 link externo em inglês (em inglês)
Compreensível
Previsível
ATENÇÃO: Este critério é um rascunho!
Nenhum controle necessário para seguir em frente ou retornar em um determinado fluxo deve permanecer oculto na tela exigindo a passagem do mouse (mouse-over) pelo elemento em si. Os controles devem estar visíveis ou deve ser fornecido um mecanismo que permita ao usuário deixá-los visíveis.
-
3.3.1 - Identificação do erro [A]
acessar Critério de Sucesso 3.3.1 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
Erros durante e após o preenchimento de dados em formulários, devem ser identificados de forma específica e clara para o usuário. O acesso aos campos com erros também deve ser simplificado.
Nota: ver em conjunto com critérios 3.3.2 e 3.3.3.
-
3.3.2 - Rótulos e instruções [A]
acessar Critério de Sucesso 3.3.2 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
Rótulos (labels) devem identificar os respectivos campos de formulários de forma clara e correta. Forneça instruções de tela ou dicas de preenchimento dos campos sempre que possível.
Nota: ver em conjunto com critérios 1.3.5, 3.3.1 e 3.3.3.
-
3.3.3 - Sugestão de erro [AA]
acessar Critério de Sucesso 3.3.3 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
Forneça sugestões simples para que o usuário consiga corrigir facilmente os erros de preenchimento.
Nota: ver em conjunto com critérios 3.3.1 e 3.3.2.
-
3.3.4 - Prevenção de erro (legal, financeiro, dados) [AA]
acessar Critério de Sucesso 3.3.4 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
Sempre que o usuário puder acrescentar qualquer informação que envolva responsabilidade jurídica ou transação financeira via formulário, bem como alterações em dados já existentes, deve-se também possibilitar o cancelamento do envio ou a verificação e confirmação dos dados.
-
3.3.5 - Ajuda [AAA]
acessar Critério de Sucesso 3.3.5 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
Caso um rótulo (label) não seja suficiente para explicar o preenchimento de um determinado campo, uma ajuda contextualizada deve ser fornecida.
Nota: ver também critério 3.3.2.
-
3.3.6 - Prevenção de erro (todos) [AAA]
acessar Critério de Sucesso 3.3.6 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
Sempre que o usuário puder acrescentar qualquer informação via formulário, deve-se possibilitar o cancelamento do envio ou a verificação e/ou confirmação dos dados.
-
WCAG 2.2
3.3.7 - Autenticação
acessível [A]acessar Critério de Sucesso 3.3.7 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
ATENÇÃO: Este critério é um rascunho!
Sempre que um processo de login exigir um mecanismo de função cognitiva (memorização/digitação de algo), deve-se fornecer uma alternativa também (exemplo: autenticação de 2 fatores onde o usuário não precise memorizar uma senha).
-
WCAG 2.2
3.3.8 - Entrada
redundante [A]acessar Critério de Sucesso 3.3.8 link externo em inglês (em inglês)
Compreensível
Assistência a entrada
ATENÇÃO: Este critério é um rascunho!
Sempre que houver o preenchimento de etapas em uma processo, qualquer tipo de informação inserida previamente não deverá ser solicitada novamente a não ser que seja essencial (exemplo: reinserção de senha de confirmação).
-
4.1.1 - Análise (código) [A]
acessar Critério de Sucesso 4.1.1 link externo em inglês (em inglês)
Robusto
Compatível
Erros significativos de validação ou análise de semântica de código devem ser evitados.
Nota para DEV: deve-se utilizar alguma ferramenta para validação da semântica e identificação de erros comuns.
-
4.1.2 - Nome, função, valor [A]
acessar Critério de Sucesso 4.1.2 link externo em inglês (em inglês)
Robusto
Compatível
Nomes, funções, valores e estados dos componentes devem ser identificados corretamente por tecnologias assistivas.
Nota para DEV: código semântico fornece naturalmente boa parte dessas informações.
-
WCAG 2.1
4.1.3 - Mensagens de status [AA]
acessar Critério de Sucesso 4.1.3 link externo em inglês (em inglês)
Robusto
Compatível
Qualquer tipo de mensagem informacional e relevante ao usuário após executar uma ação deve ser transmitida sem que haja mudança de foco no elemento que originou a informação.
Nota: ver critério completo para identificar exemplos e casos de uso.
Referências
WCAG são diretrizes e recomendações organizadas e mantidas pelo W3C que fundamentam a construção de conteúdos digitais com qualidade e acessíveis a qualquer pessoa independentemente de sua deficiência e/ou habilidade.
Atualmente na versão 2.1 (2018). Desde a versão 2.0 (2008) os critérios de sucesso foram organizados de forma que fossem independentes de qualquer tecnologia criada e que também fossem facilmente testáveis e validados.
Como são organizados os critérios de sucesso nos cartões?
Os cartões apresentados aqui representam todos os 78 critérios de sucesso propostos pela WCAG. Eles estão organizados de forma que sejam facilmente compreendidos e possuem as seguintes informações:
- Código do critério de sucesso;
- Título do critério de sucesso;
- Nível de Conformidade (A, AA ou AAA);
- Princípios (diferenciado por cores);
- Recomendações (seguem as mesmas cores dos princípios);
- Descrição resumida do critério;
- Link para descrição completa do critério.
Interessado em se aprofundar mais no entendimento da WCAG? Consulte esses links:
- Web Content Accessibility Guidelines (WCAG) 2.1 - W3C Brasil) link externo
- Web Accessibility Initiative (WAI) - WCAG Overview - W3C (em inglês) link externo
- Cartilha de Acessibilidade na Web - W3C Brasil (Volume 1 - HTML) link externo
- Cartilha de Acessibilidade na Web - W3C Brasil (Volume 2 - HTML) link externo
- Cartilha de Acessibilidade na Web - W3C Brasil (Volume 3 - HTML) link externo
- Cartilha de Acessibilidade na Web - W3C Brasil (Volume 4 - HTML) link externo
Faça o download!
Este material faz parte do projeto Acessibilidade Toolkit link externo, cuja ideia original é disponibilizar todos os critérios de sucesso de forma simplificada e em formato de cartões manipuláveis.
Se estiver interessado em conhecer todo o processo criativo e de desenvolvimento, leia este artigo link externo.
Você pode utilizar este toolkit de forma livre para imprimir, traduzir, editar, customizar, redistribuir e fazer o que quiser com o material, desde que cite a fonte e o redistribua utilizando a mesma licença de uso link externo.
Download via GitHubversão atual: 1.1.2 (changelog link externo)
Contribua com o projeto!
Originalmente o material está disponibilizado em português brasileiro (pt-br).
No entanto, a tradução do material para qualquer idioma é livre. Por favor, contribua!
This project is initially in brazilian portuguese (pt-br). Feel free to contribute translations.