A informação e os componentes da interface do utilizador devem ser apresentáveis aos utilizadores de formas que eles possam percecionar.
1.1 — Alternativas em Texto
Fornecer alternativas em texto para qualquer conteúdo não texto, de modo a que possa ser convertido noutras formas de que as pessoas necessitem, tais como caracteres de grande dimensão, braille, voz, símbolos ou linguagem mais simples.
1.1.1 — Conteúdo não texto
A
Todo o conteúdo não texto apresentado ao utilizador tem uma alternativa em texto que serve o mesmo propósito equivalente, exceto nas situações listadas abaixo.
- Controlos, Entrada: Se o conteúdo não texto for um controlo ou aceitar entrada do utilizador, então tem um nome que descreve o seu propósito. (Consultar o Critério de Sucesso 4.1.2 para requisitos adicionais relativos a controlos e a conteúdo que aceita entrada do utilizador.)
- Multimédia Baseada no Tempo: Se o conteúdo não texto for multimédia baseada no tempo, então as alternativas em texto fornecem, pelo menos, uma identificação descritiva do conteúdo não texto. (Consultar a Diretriz 1.2 para requisitos adicionais relativos a multimédia.)
- Teste: Se o conteúdo não texto for um teste ou exercício que seria inválido se apresentado em texto, então as alternativas em texto fornecem, pelo menos, uma identificação descritiva do conteúdo não texto.
- Sensorial: Se o conteúdo não texto se destinar principalmente a criar uma experiência sensorial específica, então as alternativas em texto fornecem, pelo menos, uma identificação descritiva do conteúdo não texto.
- CAPTCHA: Se o propósito do conteúdo não texto for confirmar que o conteúdo está a ser acedido por uma pessoa e não por um computador, então são fornecidas alternativas em texto que identificam e descrevem o propósito do conteúdo não texto, bem como formas alternativas de CAPTCHA, usando modos de saída para diferentes tipos de perceção sensorial, para acomodar diferentes deficiências.
- Decoração, Formatação, Invisível: Se o conteúdo não texto for puramente decorativo, for usado apenas para formatação visual ou não for apresentado aos utilizadores, então é implementado de forma a poder ser ignorado por tecnologias de apoio.
Técnicas Suficientes
Situação A: Se uma descrição curta puder servir o mesmo propósito e apresentar a mesma informação que o conteúdo não texto:
TECH:G94 — Fornecer uma alternativa em texto curta para conteúdo não texto que sirva o mesmo propósito e apresente a mesma informação que o conteúdo não textoTECH:ARIA6 — Usar aria-label para fornecer rótulos para objetosTECH:ARIA10 — Usar aria-labelledby para fornecer uma alternativa em texto para conteúdo não textoTECH:G196 — Usar uma alternativa em texto num item dentro de um grupo de imagens que descreva todos os itens do grupoTECH:H2 — Combinar ligações adjacentes de imagem e texto para o mesmo recursoTECH:H37 — Usar atributos alt em elementos imgTECH:H53 — Usar o conteúdo do elemento objectTECH:H86 — Fornecer alternativas em texto para emojis, emoticons, arte ASCII e leetspeakTECH:PDF1 — Aplicar alternativas em texto a imagens usando a entrada Alt em documentos PDF
Situação B: Se uma descrição curta não puder servir o mesmo propósito e apresentar a mesma informação que o conteúdo não texto (por exemplo, um gráfico ou diagrama):
TECH:G95 — Fornecer alternativas em texto curtas que forneçam uma breve descrição do conteúdo não textoTECH:ARIA6 — Usar aria-label para fornecer rótulos para objetosTECH:ARIA10 — Usar aria-labelledby para fornecer uma alternativa em texto para conteúdo não textoTECH:G196 — Usar uma alternativa em texto num item dentro de um grupo de imagens que descreva todos os itens do grupoTECH:H2 — Combinar ligações adjacentes de imagem e texto para o mesmo recursoTECH:H35 — TECH:H37 — Usar atributos alt em elementos imgTECH:H53 — Usar o conteúdo do elemento objectTECH:H86 — Fornecer alternativas em texto para emojis, emoticons, arte ASCII e leetspeakTECH:PDF1 — Aplicar alternativas em texto a imagens usando a entrada Alt em documentos PDFTECH:ARIA15 — Usar aria-describedby para fornecer descrições de imagensTECH:G73 — Fornecer uma descrição longa noutro local, com uma ligação para essa descrição imediatamente adjacente ao conteúdo não textoTECH:G74 — Fornecer uma descrição longa em texto perto do conteúdo não texto, com uma referência à localização da descrição longa na descrição curtaTECH:G92 — Fornecer uma descrição longa para conteúdo não texto que sirva o mesmo propósito e apresente a mesma informaçãoTECH:H53 — Usar o conteúdo do elemento object
Situação C: Se o conteúdo não texto for um controlo ou aceitar entrada do utilizador:
TECH:G82 — Fornecer uma alternativa em texto que identifique o propósito do conteúdo não textoTECH:ARIA6 — Usar aria-label para fornecer rótulos para objetosTECH:ARIA9 — Usar aria-labelledby para concatenar um rótulo a partir de vários nós de textoTECH:H24 — Fornecer alternativas em texto para elementos area de mapas de imagemTECH:H30 — Fornecer texto de ligação que descreva o propósito de uma ligação para elementos anchorTECH:H36 — Usar atributos alt em imagens usadas como botões de submissãoTECH:H44 — Usar o elemento label para associar rótulos de texto a controlos de formulárioTECH:H65 — Usar o atributo title para identificar controlos de formulário quando não é possível usar o elemento label
Situação D: Se o conteúdo não texto for multimédia baseada no tempo (incluindo vídeo apenas ao vivo e áudio apenas ao vivo); um teste ou exercício que seria inválido se apresentado em texto; ou se se destinar principalmente a criar uma experiência sensorial específica:
TECH:future-non-text-content-1 — Fornecer um rótulo descritivo usando um dos seguintes:TECH:G68 — Fornecer uma alternativa em texto curta que descreva o propósito de conteúdo apenas áudio ao vivo e apenas vídeo ao vivoTECH:G100 — Fornecer uma alternativa em texto curta que seja o nome aceite ou um nome descritivo do conteúdo não textoTECH:ARIA6 — Usar aria-label para fornecer rótulos para objetosTECH:ARIA10 — Usar aria-labelledby para fornecer uma alternativa em texto para conteúdo não textoTECH:G196 — Usar uma alternativa em texto num item dentro de um grupo de imagens que descreva todos os itens do grupoTECH:H2 — Combinar ligações adjacentes de imagem e texto para o mesmo recursoTECH:H37 — Usar atributos alt em elementos imgTECH:H53 — Usar o conteúdo do elemento objectTECH:H86 — Fornecer alternativas em texto para emojis, emoticons, arte ASCII e leetspeakTECH:PDF1 — Aplicar alternativas em texto a imagens usando a entrada Alt em documentos PDF
Situação E: Se o conteúdo não texto for um CAPTCHA:
TECH:G143 — Fornecer uma alternativa em texto que descreva o propósito do CAPTCHATECH:G144 — Garantir que a página Web contém outro CAPTCHA com o mesmo propósito, usando uma modalidade diferente
Situação F: Se o conteúdo não texto dever ser ignorado por tecnologias de apoio:
TECH:future-non-text-content-1 — Implementar ou marcar o conteúdo não texto de forma a que seja ignorado por tecnologias de apoio usando um dos seguintes:TECH:C9 — Usar CSS para incluir imagens decorativasTECH:H67 — Usar texto alt vazio e nenhum atributo title em elementos img para imagens que as tecnologias de apoio devem ignorarTECH:PDF4 — Ocultar imagens decorativas com a etiqueta Artifact em documentos PDF
Falhas Comuns
TECH:F3 — Falha do Critério de Sucesso 1.1.1 devido ao uso de CSS para incluir imagens que transmitem informação importante
TECH:F13 — Falha do Critério de Sucesso 1.1.1 e 1.4.1 devido a ter uma alternativa em texto que não inclui a informação transmitida por diferenças de cor na imagem
TECH:F20 — Falha do Critério de Sucesso 1.1.1 e 4.1.2 devido a não atualizar Alternativas em texto quando ocorrem alterações em conteúdo não texto
TECH:F30 — Falha do Critério de Sucesso 1.1.1 e 1.2.1 devido ao uso de Alternativas em texto que não são alternativas (por exemplo, nomes de ficheiros ou texto de preenchimento)
TECH:F38 — Falha do Critério de Sucesso 1.1.1 devido a não marcar imagens decorativas em HTML de forma a permitir que as tecnologias de apoio as ignorem
TECH:F39 — Falha do Critério de Sucesso 1.1.1 devido a fornecer uma alternativa em texto que não é vazia (por exemplo, alt="spacer" ou alt="image") para imagens que devem ser ignoradas por tecnologias de apoio
TECH:F65 — Falha do Critério de Sucesso 1.1.1 devido à omissão do atributo alt ou de alternativa em texto em elementos img, elementos area e elementos input do tipo "image"
TECH:F67 — Falha do Critério de Sucesso 1.1.1 e 1.2.1 devido a fornecer descrições longas para conteúdo não texto que não serve o mesmo propósito ou não apresenta a mesma informação
TECH:F71 — Falha do Critério de Sucesso 1.1.1 devido ao uso de texto semelhante a texto real para representar texto sem fornecer uma alternativa em texto
TECH:F72 — Falha do Critério de Sucesso 1.1.1 devido ao uso de arte ASCII sem fornecer uma alternativa em texto
1.2 — Multimédia Baseada no Tempo
Fornecer alternativas para multimédia baseada no tempo.
1.2.1 — Apenas Áudio e Apenas Vídeo (Pré-gravado)
A
Para multimédia apenas áudio pré-gravado e apenas vídeo pré-gravado, verifica-se o seguinte, exceto quando o áudio ou o vídeo for uma alternativa multimédia ao texto e estiver claramente identificado como tal:
- Apenas Áudio Pré-gravado: É fornecida uma alternativa para multimédia baseada no tempo que apresenta informação equivalente para conteúdo apenas áudio pré-gravado.
- Apenas Vídeo Pré-gravado: É fornecida uma alternativa para multimédia baseada no tempo ou uma faixa de áudio que apresenta informação equivalente para conteúdo apenas vídeo pré-gravado.
Técnicas Suficientes
Situação A: Se o conteúdo for apenas áudio pré-gravado:
TECH:G158 — Fornecer uma alternativa para multimédia baseada no tempo para conteúdo apenas áudio
Situação B: Se o conteúdo for apenas vídeo pré-gravado:
TECH:G159 — Fornecer uma alternativa para multimédia baseada no tempo para conteúdo apenas vídeoTECH:G166 — Fornecer áudio que descreva o conteúdo importante do vídeo e identificá-lo como tal
Técnicas de Apoio
TECH:H96 — Usar o elemento track para fornecer audiodescrições
Falhas Comuns
TECH:F30 — Falha do Critério de Sucesso 1.1.1 e 1.2.1 devido ao uso de Alternativas em texto que não são alternativas (por exemplo, nomes de ficheiros ou texto de preenchimento)
TECH:F67 — Falha do Critério de Sucesso 1.1.1 e 1.2.1 devido a fornecer descrições longas para conteúdo não texto que não serve o mesmo propósito ou não apresenta a mesma informação
1.2.2 — Legendas (Pré-gravado)
A
São fornecidas legendas para todo o conteúdo áudio pré-gravado em multimédia sincronizada, exceto quando a multimédia for uma alternativa multimédia ao texto e estiver claramente identificada como tal.
Técnicas Suficientes
TECH:G93 — Fornecer legendas abertas (sempre visíveis)
TECH:G87 — Fornecer legendas fechadas
TECH:G87 — Fornecer legendas fechadasTECH:SM11 — Fornecer legendas através de fluxos de texto sincronizado em SMIL 1.0TECH:SM12 — Fornecer legendas através de fluxos de texto sincronizado em SMIL 2.0TECH:H95 — Usar o elemento track para fornecer legendas
Falhas Comuns
TECH:F8 — Falha do Critério de Sucesso 1.2.2 devido a as legendas omitirem algum diálogo ou efeitos sonoros importantes
TECH:F75 — Falha do Critério de Sucesso 1.2.2 por fornecer multimédia sincronizada sem legendas quando a multimédia sincronizada apresenta mais informação do que a que é apresentada na página
TECH:F74 — Falha do Critério de Sucesso 1.2.2 e 1.2.8 devido a não identificar uma alternativa de multimédia sincronizada ao texto como sendo uma alternativa
1.2.3 — Audiodescrição ou Alternativa Multimédia (Pré-gravado)
A
É fornecida uma alternativa para multimédia baseada no tempo ou audiodescrição do conteúdo de vídeo pré-gravado para multimédia sincronizada, exceto quando a multimédia for uma alternativa multimédia ao texto e estiver claramente identificada como tal.
Técnicas Suficientes
TECH:G69 — Fornecer uma alternativa para multimédia baseada no tempoTECH:G58 — Colocar uma ligação para a alternativa para multimédia baseada no tempo imediatamente ao lado do conteúdo não texto
TECH:future-audio-description-or-media-alternative-prerecorded-1 — Criar uma ligação para a alternativa para multimédia baseada no tempo usando uma das seguintes técnicasTECH:H53 — Usar o conteúdo do elemento object
TECH:G78 — Fornecer uma segunda faixa de áudio selecionável pelo utilizador que inclua audiodescrições
TECH:G173 — Fornecer uma versão de um filme com audiodescriçõesTECH:SM6 — Fornecer audiodescrição em SMIL 1.0TECH:SM7 — Fornecer audiodescrição em SMIL 2.0TECH:future-audio-description-or-media-alternative-prerecorded-1 — Usar qualquer leitor que suporte áudio e vídeo
TECH:G8 — Fornecer um filme com audiodescrições alargadasTECH:SM1 — Adicionar audiodescrição alargada em SMIL 1.0TECH:SM2 — Adicionar audiodescrição alargada em SMIL 2.0TECH:future-audio-description-or-media-alternative-prerecorded-1 — Usar qualquer leitor que suporte áudio e vídeo
TECH:G203 — Usar uma alternativa em texto estática para descrever um vídeo de uma pessoa a falar (talking head)
Técnicas de Apoio
TECH:H96 — Usar o elemento track para fornecer audiodescrições
1.2.4 — Legendas (Ao Vivo)
AA
São fornecidas legendas para todo o conteúdo áudio ao vivo em multimédia sincronizada.
Técnicas Suficientes
TECH:G9 — Criar legendas para multimédia sincronizada ao vivoTECH:G93 — Fornecer legendas abertas (sempre visíveis)
TECH:G9 — Criar legendas para multimédia sincronizada ao vivoTECH:G87 — Fornecer legendas fechadas
TECH:G9 — Criar legendas para multimédia sincronizada ao vivoTECH:SM11 — Fornecer legendas através de fluxos de texto sincronizado em SMIL 1.0TECH:SM12 — Fornecer legendas através de fluxos de texto sincronizado em SMIL 2.0
TECH:G87 — Fornecer legendas fechadasTECH:SM11 — Fornecer legendas através de fluxos de texto sincronizado em SMIL 1.0TECH:SM12 — Fornecer legendas através de fluxos de texto sincronizado em SMIL 2.0
1.2.5 — Audiodescrição (Pré-gravado)
AA
É fornecida audiodescrição para todo o conteúdo de vídeo pré-gravado em multimédia sincronizada.
Técnicas Suficientes
TECH:G78 — Fornecer uma segunda faixa de áudio selecionável pelo utilizador que inclua audiodescrições
TECH:G173 — Fornecer uma versão de um filme com audiodescriçõesTECH:SM6 — Fornecer audiodescrição em SMIL 1.0TECH:SM7 — Fornecer audiodescrição em SMIL 2.0TECH:future-audio-description-prerecorded-1 — Usar qualquer leitor que suporte áudio e vídeo
TECH:G8 — Fornecer um filme com audiodescrições alargadasTECH:SM1 — Adicionar audiodescrição alargada em SMIL 1.0TECH:SM2 — Adicionar audiodescrição alargada em SMIL 2.0TECH:future-audio-description-prerecorded-1 — Usar qualquer leitor que suporte áudio e vídeo
TECH:G203 — Usar uma alternativa em texto estática para descrever um vídeo de uma pessoa a falar (talking head)
Técnicas de Apoio
TECH:H96 — Usar o elemento track para fornecer audiodescrições
1.2.6 — Língua Gestual (Pré-gravado)
AAA
É fornecida interpretação em língua gestual para todo o conteúdo áudio pré-gravado em multimédia sincronizada.
Técnicas Suficientes
TECH:G54 — Incluir um intérprete de língua gestual na transmissão de vídeo
TECH:G81 — Fornecer um vídeo sincronizado do intérprete de língua gestual que possa ser apresentado numa janela de visualização diferente ou sobreposto à imagem pelo leitorTECH:SM13 — Fornecer interpretação em língua gestual através de fluxos de vídeo sincronizados em SMIL 1.0TECH:SM14 — Fornecer interpretação em língua gestual através de fluxos de vídeo sincronizados em SMIL 2.0
1.2.7 — Audiodescrição Alargada (Pré-gravado)
AAA
Quando as pausas no áudio em primeiro plano são insuficientes para permitir que as audiodescrições transmitam o sentido do vídeo, é fornecida audiodescrição alargada para todo o conteúdo de vídeo pré-gravado em multimédia sincronizada.
Técnicas Suficientes
TECH:G8 — Fornecer um filme com audiodescrições alargadasTECH:SM1 — Adicionar audiodescrição alargada em SMIL 1.0TECH:SM2 — Adicionar audiodescrição alargada em SMIL 2.0TECH:future-extended-audio-description-prerecorded-1 — Usar qualquer leitor que suporte áudio e vídeo
Técnicas de Apoio
TECH:H96 — Usar o elemento track para fornecer audiodescrições
1.2.8 — Alternativa Multimédia (Pré-gravado)
AAA
É fornecida uma alternativa para multimédia baseada no tempo para toda a multimédia sincronizada pré-gravada e para toda a multimédia apenas vídeo pré-gravada.
Técnicas Suficientes
Situação A: Se o conteúdo for multimédia sincronizada pré-gravada:
TECH:G69 — Fornecer uma alternativa para multimédia baseada no tempoTECH:G58 — Colocar uma ligação para a alternativa para multimédia baseada no tempo imediatamente ao lado do conteúdo não texto
TECH:future-media-alternative-prerecorded-1 — Criar uma ligação para a alternativa para multimédia baseada no tempo usando uma das seguintes técnicasTECH:H53 — Usar o conteúdo do elemento object
Situação B: Se o conteúdo for apenas vídeo pré-gravado:
TECH:G159 — Fornecer uma alternativa para multimédia baseada no tempo para conteúdo apenas vídeo
Falhas Comuns
TECH:F74 — Falha do Critério de Sucesso 1.2.2 e 1.2.8 devido a não identificar uma alternativa de multimédia sincronizada ao texto como sendo uma alternativa
1.2.9 — Apenas Áudio (Ao Vivo)
AAA
É fornecida uma alternativa para multimédia baseada no tempo que apresenta informação equivalente para conteúdo apenas áudio ao vivo.
Técnicas Suficientes
TECH:G151 — Fornecer uma ligação para uma transcrição em texto de uma declaração preparada ou guião, se o guião for seguido
TECH:G150 — Fornecer alternativas baseadas em texto para conteúdo apenas áudio ao vivo
TECH:G157 — Incorporar um serviço de legendagem ao vivo numa página Web
1.3 — Adaptável
Criar conteúdo que possa ser apresentado de diferentes formas (por exemplo, com uma disposição mais simples) sem perder informação ou estrutura.
1.3.1 — Informação e Relações
A
A informação, a estrutura e as relações transmitidas através da apresentação podem ser determinadas programaticamente ou estão disponíveis em texto.
Técnicas Suficientes
Situação A: A tecnologia fornece estrutura semântica para tornar programaticamente determináveis a informação e as relações transmitidas através da apresentação:
TECH:ARIA11 — Usar marcos ARIA para identificar regiões de uma páginaTECH:H101 — Usar elementos HTML semânticos para identificar regiões de uma páginaTECH:ARIA12 — Usar role=heading para identificar cabeçalhosTECH:ARIA13 — Usar aria-labelledby para nomear regiões e marcosTECH:ARIA16 — Usar aria-labelledby para fornecer um nome a controlos da interface do utilizadorTECH:ARIA17 — Usar papéis de agrupamento para identificar controlos de formulário relacionadosTECH:ARIA20 — Usar o papel region para identificar uma região da páginaTECH:G115 — Usar elementos semânticos para marcar a estruturaTECH:H49 — Usar marcação semântica para marcar texto enfatizado ou especial
TECH:G117 — Usar texto para transmitir informação que é transmitida por variações na apresentação do textoTECH:G140 — Separar a informação e a estrutura da apresentação para permitir diferentes apresentaçõesTECH:ARIA24 — Identificar semanticamente um ícone de fonte com role="img"TECH:future-info-and-relationships-1 — Tornar programaticamente determináveis a informação e as relações transmitidas através da apresentação usando as seguintes técnicas:TECH:G138 — Usar marcação semântica sempre que forem usadas pistas de corTECH:H51 — Usar marcação de tabela para apresentar informação tabularTECH:PDF6 — Usar elementos de tabela para marcação de tabelas em documentos PDFTECH:PDF20 — Usar o Editor de Tabelas do Adobe Acrobat Pro para corrigir tabelas com etiquetagem incorretaTECH:H39 — Usar elementos caption para associar legendas de tabelas de dados a tabelas de dadosTECH:H63 — Usar o atributo scope para associar células de cabeçalho e células de dados em tabelas de dadosTECH:H43 — Usar os atributos id e headers para associar células de dados a células de cabeçalho em tabelas de dadosTECH:H44 — Usar o elemento label para associar rótulos de texto a controlos de formulárioTECH:H65 — Usar o atributo title para identificar controlos de formulário quando não é possível usar o elemento labelTECH:PDF10 — Fornecer rótulos para controlos de formulário interativos em documentos PDFTECH:PDF12 — Fornecer informação de nome, papel e valor para campos de formulário em documentos PDFTECH:H71 — Fornecer uma descrição para grupos de controlos de formulário usando os elementos fieldset e legendTECH:H85 — Usar optgroup para agrupar elementos option dentro de um selectTECH:H48 — Usar ol, ul e dl para listas ou grupos de ligaçõesTECH:H42 — Usar h1-h6 para identificar cabeçalhosTECH:PDF9 — Fornecer cabeçalhos marcando o conteúdo com etiquetas de cabeçalho em documentos PDFTECH:SCR21 — Usar funções do Document Object Model (DOM) para adicionar conteúdo a uma páginaTECH:PDF11 — Fornecer ligações e texto de ligação usando a anotação Link e o elemento de estrutura /Link em documentos PDFTECH:PDF17 — Especificar numeração de páginas consistente para documentos PDFTECH:PDF21 — Usar etiquetas List para listas em documentos PDFTECH:H97 — Agrupar ligações relacionadas usando o elemento nav
Situação B: A tecnologia utilizada NÃO fornece a estrutura semântica para tornar programaticamente determináveis a informação e as relações transmitidas através da apresentação:
TECH:G117 — Usar texto para transmitir informação que é transmitida por variações na apresentação do textoTECH:future-info-and-relationships-1 — Tornar programaticamente determináveis ou disponibilizar em texto a informação e as relações transmitidas através da apresentação usando as seguintes técnicas:TECH:T1 — Usar convenções padrão de formatação de texto para parágrafosTECH:T2 — Usar convenções padrão de formatação de texto para listasTECH:T3 — Usar convenções padrão de formatação de texto para cabeçalhos
Técnicas de Apoio
TECH:C22 — Usar CSS para controlar a apresentação visual do texto
TECH:G162 — Posicionar rótulos para maximizar a previsibilidade das relações
TECH:ARIA1 — Usar a propriedade aria-describedby para fornecer um rótulo descritivo para controlos da interface do utilizador
TECH:ARIA2 — Identificar um campo obrigatório com a propriedade aria-required
TECH:G141 — Organizar uma página usando cabeçalhos
Falhas Comuns
TECH:F2 — Falha do Critério de Sucesso 1.3.1 devido ao uso de alterações na apresentação do texto para transmitir informação sem utilizar a marcação ou o texto apropriado
TECH:F33 — Falha do Critério de Sucesso 1.3.1 e 1.3.2 devido ao uso de caracteres de espaço em branco para criar múltiplas colunas em conteúdo de texto simples
TECH:F34 — Falha do Critério de Sucesso 1.3.1 e 1.3.2 devido ao uso de caracteres de espaço em branco para formatar tabelas em conteúdo de texto simples
TECH:F42 — Falha dos Critérios de Sucesso 1.3.1, 2.1.1, 2.1.3 ou 4.1.2 ao emular ligações
TECH:F43 — Falha do Critério de Sucesso 1.3.1 devido ao uso de marcação estrutural de uma forma que não representa relações no conteúdo
TECH:F46 — Falha do Critério de Sucesso 1.3.1 devido ao uso de elementos th em tabelas de disposição
TECH:F48 — Falha do Critério de Sucesso 1.3.1 devido ao uso do elemento pre para marcar informação tabular
TECH:F87 — Falha do Critério de Sucesso 1.3.1 devido à inserção de conteúdo não decorativo usando os pseudo-elementos ::before e ::after e a propriedade "content" em CSS
TECH:F90 — Falha do Critério de Sucesso 1.3.1 por associar incorretamente cabeçalhos e conteúdo de tabelas através dos atributos headers e id
TECH:F91 — Falha do Critério de Sucesso 1.3.1 por não marcar corretamente os cabeçalhos de tabela
TECH:F92 — Falha do Critério de Sucesso 1.3.1 devido ao uso de role=presentation em conteúdo que transmite informação semântica
1.3.2 — Sequência Com Significado
A
Quando a sequência na qual o conteúdo é apresentado afeta o seu significado, pode ser determinada programaticamente uma sequência de leitura correta.
Técnicas Suficientes
TECH:G57 — Ordenar o conteúdo numa sequência com significado
TECH:G57 — Ordenar o conteúdo numa sequência com significadoTECH:H34 — Usar uma marca Unicode da direita para a esquerda (RLM) ou da esquerda para a direita (LRM) para misturar a direção do texto em linhaTECH:H56 — Usar o atributo dir num elemento em linha para resolver problemas com sequências direcionais aninhadasTECH:C6 — Posicionar conteúdo com base na marcação estruturalTECH:C8 — Usar CSS letter-spacing para controlar o espaçamento dentro de uma palavra
TECH:C27 — Garantir que a ordem no DOM corresponde à ordem visual
TECH:PDF3 — Garantir a ordem correta de tabulação e de leitura em documentos PDF
Falhas Comuns
TECH:F34 — Falha do Critério de Sucesso 1.3.1 e 1.3.2 devido ao uso de caracteres de espaço em branco para formatar tabelas em conteúdo de texto simples
TECH:F33 — Falha do Critério de Sucesso 1.3.1 e 1.3.2 devido ao uso de caracteres de espaço em branco para criar múltiplas colunas em conteúdo de texto simples
TECH:F32 — Falha do Critério de Sucesso 1.3.2 devido ao uso de caracteres de espaço em branco para controlar o espaçamento dentro de uma palavra
TECH:F49 — Falha do Critério de Sucesso 1.3.2 devido ao uso de uma tabela de disposição HTML que não faz sentido quando linearizada
TECH:F1 — Falha do Critério de Sucesso 1.3.2 devido a alterar o significado do conteúdo ao posicionar informação com CSS
1.3.3 — Características Sensoriais
A
As instruções fornecidas para compreender e operar o conteúdo não dependem exclusivamente de características sensoriais dos componentes, tais como forma, cor, dimensão, localização visual, orientação ou som.
Técnicas Suficientes
TECH:G96 — Fornecer identificação textual de itens que, de outra forma, dependem apenas de informação sensorial para serem compreendidos
Falhas Comuns
TECH:F14 — Falha do Critério de Sucesso 1.3.3 devido a identificar conteúdo apenas pela sua forma ou localização
TECH:F26 — Falha do Critério de Sucesso 1.3.3 devido ao uso de um símbolo gráfico isolado para transmitir informação
1.3.4 — Orientação
AA
O conteúdo não restringe a sua visualização e operação a uma única orientação de ecrã, como retrato ou paisagem, exceto quando uma orientação de ecrã específica for essencial.
Técnicas Suficientes
TECH:G214 — Usar um controlo para permitir acesso ao conteúdo em diferentes orientações que, de outro modo, estaria restrito
Falhas Comuns
TECH:F97 — Falha devido ao bloqueio da orientação para vista em paisagem ou retrato
TECH:F100 — Falha do Critério de Sucesso 1.3.4 devido a apresentar uma mensagem a pedir para reorientar o dispositivo
1.3.5 — Identificar o Propósito da Entrada
AA
O propósito de cada campo de entrada que recolhe informação sobre o utilizador pode ser determinado programaticamente quando:
Técnicas Suficientes
TECH:H98 — Usar atributos autocomplete do HTML 5.2
Falhas Comuns
TECH:F107 — Falha do Critério de Sucesso 1.3.5 devido a valores incorretos do atributo autocomplete
1.3.6 — Identificar o Propósito
AAA
Em conteúdo implementado utilizando linguagens de marcação, o propósito de componentes da interface do utilizador, ícones e regiões pode ser determinado programaticamente.
Técnicas Suficientes
TECH:future-identify-purpose-1 — Indicar programaticamente o propósito de ícones, regiões e componentes da interface do utilizador
TECH:ARIA11 — Usar marcos ARIA para identificar regiões de uma página
TECH:future-identify-purpose-1 — Usar microdados para marcar componentes da interface do utilizador (ligação futura)
Técnicas de Apoio
TECH:future-identify-purpose-1 — Permitir que os agentes do utilizador encontrem a versão do conteúdo que melhor se adequa às suas necessidades
TECH:future-identify-purpose-1 — Usar semântica para identificar funcionalidades importantes (por exemplo, coga-simplification="simplest")
TECH:future-identify-purpose-1 — Usar aria-invalid e aria-required
1.4 — Distinguível
Facilitar aos utilizadores ver e ouvir o conteúdo, incluindo separar o primeiro plano do fundo.
1.4.1 — Uso da Cor
A
A cor não é utilizada como o único meio visual para transmitir informação, indicar uma ação, solicitar uma resposta ou distinguir um elemento visual.
Técnicas Suficientes
Situação A: Se a cor de palavras específicas, fundos ou outro conteúdo for usada para indicar informação:
TECH:G14 — Garantir que a informação transmitida por diferenças de cor também está disponível em textoTECH:G205 — Incluir uma pista textual para rótulos coloridos de controlos de formulárioTECH:G182 — Garantir que existem pistas visuais adicionais quando diferenças na cor do texto são usadas para transmitir informaçãoTECH:G183 — Usar uma relação de contraste de 3:1 com o texto circundante e fornecer pistas visuais adicionais ao passar o cursor para ligações ou controlos em que apenas a cor é usada para os identificar
Situação B: Se a cor for utilizada dentro de uma imagem para transmitir informação:
TECH:G111 — Usar cor e padrãoTECH:G14 — Garantir que a informação transmitida por diferenças de cor também está disponível em texto
Técnicas de Apoio
TECH:C15 — Usar CSS para alterar a apresentação de um componente da interface do utilizador quando este recebe foco
Falhas Comuns
TECH:F13 — Falha do Critério de Sucesso 1.1.1 e 1.4.1 devido a ter uma alternativa em texto que não inclui a informação transmitida por diferenças de cor na imagem
TECH:F73 — Falha do Critério de Sucesso 1.4.1 devido à criação de ligações que não são visualmente evidentes sem visão das cores
TECH:F81 — Falha do Critério de Sucesso 1.4.1 devido a identificar campos obrigatórios ou com erro utilizando apenas diferenças de cor
1.4.2 — Controlo de Áudio
A
Se algum áudio numa página Web reproduzir automaticamente durante mais de 3 segundos, então está disponível um mecanismo para pausar ou parar o áudio, ou está disponível um mecanismo para controlar o volume do áudio de forma independente do nível de volume global do sistema.
Técnicas Suficientes
TECH:G60 — Reproduzir um som que se desliga automaticamente dentro de três segundos
TECH:G170 — Fornecer um controlo perto do início da página Web que desliga sons que são reproduzidos automaticamente
TECH:G171 — Reproduzir sons apenas a pedido do utilizador
Falhas Comuns
TECH:F23 — Falha do Critério de Sucesso 1.4.2 devido à reprodução de um som durante mais de 3 segundos sem existir um mecanismo para o desligar
TECH:F93 — Falha do Critério de Sucesso 1.4.2 devido à ausência de uma forma de pausar ou parar um elemento multimédia HTML5 que é reproduzido automaticamente
1.4.3 — Contraste (Mínimo)
AA
A apresentação visual de texto e imagens de texto tem uma relação de contraste de, pelo menos, 4,5:1, exceto nos seguintes casos:
- Texto Grande: Texto em grande escala e imagens de texto em grande escala têm uma relação de contraste de, pelo menos, 3:1;
- Incidental: Texto ou imagens de texto que fazem parte de um componente da interface do utilizador inativo, que são puramente decorativos, que não são visíveis para ninguém ou que fazem parte de uma imagem que contém outro conteúdo visual significativo, não têm requisitos de contraste.
- Logótipos: Texto que faz parte de um logótipo ou nome de marca não tem requisitos de contraste.
Técnicas Suficientes
Situação A: o texto tem menos de 18 pontos se não estiver a negrito e menos de 14 pontos se estiver a negrito
TECH:G18 — Garantir que existe uma relação de contraste de, pelo menos, 4,5:1 entre o texto (e imagens de texto) e o fundo por trás do textoTECH:G148 — Não especificar a cor de fundo, não especificar a cor do texto e não usar funcionalidades tecnológicas que alterem esses valores predefinidosTECH:G174 — Fornecer um controlo com uma relação de contraste suficiente que permita aos utilizadores mudar para uma apresentação que use contraste suficiente
Situação B: o texto tem pelo menos 18 pontos se não estiver a negrito e pelo menos 14 pontos se estiver a negrito
TECH:G145 — Garantir que existe uma relação de contraste de, pelo menos, 3:1 entre o texto (e imagens de texto) e o fundo por trás do textoTECH:G148 — Não especificar a cor de fundo, não especificar a cor do texto e não usar funcionalidades tecnológicas que alterem esses valores predefinidosTECH:G174 — Fornecer um controlo com uma relação de contraste suficiente que permita aos utilizadores mudar para uma apresentação que use contraste suficiente
Técnicas de Apoio
TECH:G156 — Usar uma tecnologia cujos agentes do utilizador, normalmente disponíveis, conseguem alterar o primeiro plano e o fundo de blocos de texto
Falhas Comuns
TECH:F24 — Falha do Critério de Sucesso 1.4.3, 1.4.6 e 1.4.8 devido a especificar cores de primeiro plano sem especificar cores de fundo, ou vice-versa
TECH:F83 — Falha do Critério de Sucesso 1.4.3 e 1.4.6 devido ao uso de imagens de fundo que não fornecem contraste suficiente com o texto em primeiro plano (ou imagens de texto)
1.4.4 — Redimensionar Texto
AA
Exceto para legendas e imagens de texto, o texto pode ser redimensionado até 200 por cento sem tecnologias de apoio, sem perda de conteúdo ou funcionalidade.
Técnicas Suficientes
TECH:G142 — Usar uma tecnologia cujos agentes do utilizador, normalmente disponíveis, suportam zoom
TECH:future-resize-text-1 — Garantir que os contentores de texto redimensionam quando o texto redimensiona E usar medidas relativas a outras medidas do conteúdo, aplicando uma ou mais das seguintes técnicas:TECH:C28 — Especificar o tamanho de contentores de texto usando unidades emTECH:future-resize-text-1 — Técnicas para medidas relativasTECH:C12 — Usar percentagens para tamanhos de letraTECH:C13 — Usar tamanhos de letra nomeadosTECH:C14 — Usar unidades em para tamanhos de letra
TECH:future-resize-text-1 — Técnicas para redimensionamento de contentores de textoTECH:SCR34 — Calcular tamanho e posição de forma a escalar com o tamanho do textoTECH:G146 — Usar uma disposição fluida
TECH:G178 — Fornecer controlos na página Web que permitam aos utilizadores alterar incrementalmente o tamanho de todo o texto na página até 200 por cento
TECH:G179 — Garantir que não há perda de conteúdo ou funcionalidade quando o texto é redimensionado e os contentores de texto não alteram a sua largura
Técnicas de Apoio
TECH:C17 — Dimensionar elementos de formulário que contêm texto
TECH:C20 — Usar medidas relativas para definir larguras de coluna de forma a que as linhas possam ter, em média, 80 caracteres ou menos quando o navegador é redimensionado
TECH:C22 — Usar CSS para controlar a apresentação visual do texto
Falhas Comuns
TECH:F69 — Falha do Critério de Sucesso 1.4.4 quando o redimensionamento de texto renderizado visualmente até 200 por cento faz com que o texto, a imagem ou os controlos sejam cortados, truncados ou ocultados
TECH:F80 — Falha do Critério de Sucesso 1.4.4 quando controlos de formulário baseados em texto não redimensionam quando o texto renderizado visualmente é redimensionado até 200%
TECH:F94 — Falha do Critério de Sucesso 1.4.4 devido ao uso incorreto de unidades viewport para redimensionar texto
1.4.5 — Imagens de Texto
AA
Se as tecnologias utilizadas conseguirem alcançar a apresentação visual, o texto é usado para transmitir informação em vez de imagens de texto, exceto nos seguintes casos:
- Personalizável: A imagem de texto pode ser personalizada visualmente de acordo com os requisitos do utilizador;
- Essencial: Uma determinada apresentação de texto é essencial para a informação transmitida.
Técnicas Suficientes
TECH:C22 — Usar CSS para controlar a apresentação visual do texto
TECH:C30 — Usar CSS para substituir texto por imagens de texto e fornecer controlos da interface do utilizador para alternar
TECH:G140 — Separar a informação e a estrutura da apresentação para permitir diferentes apresentações
TECH:PDF7 — Executar OCR num documento PDF digitalizado para disponibilizar texto real
1.4.6 — Contraste (Melhorado)
AAA
A apresentação visual de texto e imagens de texto tem uma relação de contraste de, pelo menos, 7:1, exceto nos seguintes casos:
- Texto Grande: Texto em grande escala e imagens de texto em grande escala têm uma relação de contraste de, pelo menos, 4,5:1;
- Incidental: Texto ou imagens de texto que fazem parte de um componente da interface do utilizador inativo, que são puramente decorativos, que não são visíveis para ninguém ou que fazem parte de uma imagem que contém outro conteúdo visual significativo, não têm requisitos de contraste.
- Logótipos: Texto que faz parte de um logótipo ou nome de marca não tem requisitos de contraste.
Técnicas Suficientes
Situação A: o texto tem menos de 18 pontos se não estiver a negrito e menos de 14 pontos se estiver a negrito
TECH:G17 — Garantir que existe uma relação de contraste de, pelo menos, 7:1 entre o texto (e imagens de texto) e o fundo por trás do textoTECH:G148 — Não especificar a cor de fundo, não especificar a cor do texto e não usar funcionalidades tecnológicas que alterem esses valores predefinidosTECH:G174 — Fornecer um controlo com uma relação de contraste suficiente que permita aos utilizadores mudar para uma apresentação que use contraste suficiente
Situação B: o texto tem pelo menos 18 pontos se não estiver a negrito e pelo menos 14 pontos se estiver a negrito
TECH:G18 — Garantir que existe uma relação de contraste de, pelo menos, 4,5:1 entre o texto (e imagens de texto) e o fundo por trás do textoTECH:G148 — Não especificar a cor de fundo, não especificar a cor do texto e não usar funcionalidades tecnológicas que alterem esses valores predefinidosTECH:G174 — Fornecer um controlo com uma relação de contraste suficiente que permita aos utilizadores mudar para uma apresentação que use contraste suficiente
Técnicas de Apoio
TECH:G156 — Usar uma tecnologia cujos agentes do utilizador, normalmente disponíveis, conseguem alterar o primeiro plano e o fundo de blocos de texto
Falhas Comuns
TECH:F24 — Falha do Critério de Sucesso 1.4.3, 1.4.6 e 1.4.8 devido a especificar cores de primeiro plano sem especificar cores de fundo, ou vice-versa
TECH:F83 — Falha do Critério de Sucesso 1.4.3 e 1.4.6 devido ao uso de imagens de fundo que não fornecem contraste suficiente com o texto em primeiro plano (ou imagens de texto)
1.4.7 — Baixo ou Sem Áudio de Fundo
AAA
Para conteúdo apenas áudio pré-gravado que (1) contém principalmente fala em primeiro plano, (2) não é um CAPTCHA áudio nem um logótipo áudio, e (3) não é vocalização destinada principalmente à expressão musical, como cantar ou rap, verifica-se pelo menos um dos seguintes:
- Sem Fundo: O áudio não contém sons de fundo.
- Desligar: Os sons de fundo podem ser desligados.
- 20 dB: Os sons de fundo são, pelo menos, 20 decibéis mais baixos do que o conteúdo de fala em primeiro plano, com exceção de sons ocasionais que duram apenas um ou dois segundos. De acordo com a definição de "decibel", o som de fundo que cumpre este requisito será aproximadamente quatro vezes mais silencioso do que o conteúdo de fala em primeiro plano.
Técnicas Suficientes
TECH:G56 — Misturar ficheiros de áudio de forma a que sons que não sejam fala fiquem, pelo menos, 20 decibéis abaixo do conteúdo de áudio da fala
1.4.8 — Apresentação Visual
AAA
Para a apresentação visual de blocos de texto, está disponível um mecanismo para alcançar o seguinte:
Falhas Comuns
TECH:F24 — Falha do Critério de Sucesso 1.4.3, 1.4.6 e 1.4.8 devido a especificar cores de primeiro plano sem especificar cores de fundo, ou vice-versa
TECH:F88 — Falha do Critério de Sucesso 1.4.8 devido ao uso de texto justificado (alinhado tanto à margem esquerda como à margem direita)
1.4.9 — Imagens de Texto (Sem Exceção)
AAA
As imagens de texto são usadas apenas para pura decoração ou quando uma determinada apresentação de texto é essencial para a informação transmitida.
Técnicas Suficientes
TECH:C22 — Usar CSS para controlar a apresentação visual do texto
TECH:C30 — Usar CSS para substituir texto por imagens de texto e fornecer controlos da interface do utilizador para alternar
TECH:G140 — Separar a informação e a estrutura da apresentação para permitir diferentes apresentações
TECH:PDF7 — Executar OCR num documento PDF digitalizado para disponibilizar texto real
Técnicas de Apoio
TECH:C12 — Usar percentagens para tamanhos de letra
TECH:C13 — Usar tamanhos de letra nomeados
TECH:C14 — Usar unidades em para tamanhos de letra
TECH:C8 — Usar CSS letter-spacing para controlar o espaçamento dentro de uma palavra
TECH:C6 — Posicionar conteúdo com base na marcação estrutural
1.4.10 — Refluxo
AA
O conteúdo pode ser apresentado sem perda de informação ou funcionalidade, e sem exigir deslocamento em duas dimensões, para:
Técnicas Suficientes
TECH:C32 — Usar media queries e CSS grid para ajustar colunas
TECH:C31 — Usar CSS Flexbox para reajustar o conteúdo
TECH:C33 — Permitir Refluxo com URLs longos e sequências de texto
TECH:C38 — Usar CSS width, max-width e flexbox para ajustar rótulos e campos de entrada
TECH:SCR34 — Calcular tamanho e posição de forma a escalar com o tamanho do texto
TECH:G206 — Fornecer opções dentro do conteúdo para mudar para uma disposição que não exija que o utilizador se desloque horizontalmente para ler uma linha de texto
TECH:future-reflow-1 — Usar PDF/UA ao criar PDFs (técnica potencial futura)
Técnicas de Apoio
TECH:C34 — Usar media queries para deixar de fixar cabeçalhos/rodapés fixos (sticky)
TECH:C37 — Usar CSS max-width e height para ajustar imagens
TECH:future-reflow-1 — CSS: Refluxo de tabelas de dados simples (técnica potencial futura)
TECH:future-reflow-1 — CSS: Ajustar células de dados dentro da largura do viewport (técnica potencial futura)
TECH:future-reflow-1 — Mecanismo para permitir vista móvel a qualquer momento (técnica potencial futura)
Falhas Comuns
TECH:F102 — Falha do Critério de Sucesso 1.4.10 devido a o conteúdo desaparecer e não estar disponível quando o conteúdo foi reajustado
1.4.11 — Contraste não texto
AA
A apresentação visual do seguinte tem uma relação de contraste de, pelo menos, 3:1 em relação à(s) cor(es) adjacente(s):
- Componentes da Interface do Utilizador: Informação visual necessária para identificar componentes e estados da interface do utilizador, exceto para componentes inativos ou quando a aparência do componente é determinada pelo agente do utilizador e não modificada pelo autor;
- Objetos Gráficos: Partes de gráficos necessárias para compreender o conteúdo, exceto quando uma determinada apresentação dos gráficos for essencial para a informação transmitida.
Técnicas Suficientes
Situação A: A cor é usada para identificar componentes da interface do utilizador ou para identificar estados de componentes da interface do utilizador
TECH:G195 — Usar um indicador de foco visível fornecido pelo autorTECH:G174 — Fornecer um controlo com uma relação de contraste suficiente que permita aos utilizadores mudar para uma apresentação que use contraste suficiente
Situação B: A cor é necessária para compreender conteúdo gráfico
TECH:G207 — Garantir que é fornecida uma relação de contraste de 3:1 para íconesTECH:G209 — Fornecer contraste suficiente nos limites entre cores adjacentes
Falhas Comuns
TECH:F78 — Falha do Critério de Sucesso 2.4.7 devido a estilizar contornos e bordas de elementos de forma a remover ou tornar não visível o indicador visual de foco
1.4.12 — Espaçamento do Texto
AA
Em conteúdo implementado utilizando linguagens de marcação que suportam as seguintes propriedades de estilo de texto, não ocorre perda de conteúdo ou funcionalidade ao definir todos os seguintes valores e ao não alterar qualquer outra propriedade de estilo:
Técnicas Suficientes
TECH:C36 — Permitir a substituição do espaçamento do texto
TECH:C35 — Permitir espaçamento do texto sem quebra de linha
Técnicas de Apoio
TECH:C8 — Usar CSS letter-spacing para controlar o espaçamento dentro de uma palavra
TECH:C21 — Especificar espaçamento entre linhas em CSS
TECH:C28 — Especificar o tamanho de contentores de texto usando unidades em
Falhas Comuns
TECH:F104 — Falha do Critério de Sucesso 1.4.12 devido a conteúdo cortado ou sobreposto quando o espaçamento do texto é ajustado
1.4.13 — Conteúdo ao Passar o Cursor ou no Foco
AA
Quando receber e depois remover o hover do ponteiro ou o foco do teclado desencadeia conteúdo adicional que se torna visível e depois oculto, verifica-se o seguinte:
- Dispensável: Está disponível um mecanismo para dispensar o conteúdo adicional sem mover o hover do ponteiro ou o foco do teclado, a menos que o conteúdo adicional comunique um erro de entrada ou não oculte nem substitua outro conteúdo;
- Passível de Hover: Se o hover do ponteiro puder desencadear o conteúdo adicional, então o ponteiro pode ser movido sobre o conteúdo adicional sem que o conteúdo adicional desapareça;
- Persistente: O conteúdo adicional permanece visível até que o acionador de hover ou foco seja removido, o utilizador o dispense, ou a sua informação deixe de ser válida.
Técnicas Suficientes
TECH:SCR39 — Tornar o conteúdo em foco ou em hover passível de hover, dispensável e persistente
TECH:future-content-on-hover-or-focus-1 — ARIA: Usar role="tooltip" (técnica potencial futura)
TECH:future-content-on-hover-or-focus-1 — CSS: Usar pseudo-classes hover e focus (técnica potencial futura)
Falhas Comuns
TECH:F95 — Falha do Critério de Sucesso 1.4.13 devido a o conteúdo mostrado ao passar o cursor não ser passível de hover
TECH:future-content-on-hover-or-focus-1 — Falha em tornar o conteúdo dispensável sem mover o hover do ponteiro ou o foco do teclado (técnica potencial futura)
TECH:future-content-on-hover-or-focus-1 — Falha em cumprir devido a o conteúdo em hover ou em foco não permanecer visível até ser dispensado ou até ficar inválido (técnica potencial futura)