Front-end Acessível - Projeto IHC

Implementação prática dos critérios WCAG 2.2: 1.1.1, 1.2.1 e 1.2.2

1.1.1 - Conteúdo Não-texto

Todo conteúdo não-texto deve ter uma alternativa em texto equivalente.

Imagem Informativa

Gráfico de barras mostrando crescimento de vendas de 25% no último trimestre

Alt text: "Gráfico de barras mostrando crescimento de vendas de 25% no último trimestre"

Ícones Funcionais

Cada ícone possui aria-label descritivo.

Imagem Decorativa

Imagem decorativa com alt="" e role="presentation".

1.2.1 - Apenas Áudio e Apenas Vídeo (Pré-gravado)

Mídia apenas com áudio ou vídeo deve ter alternativas equivalentes.

Conteúdo Apenas Áudio

Transcrição:

Narrador: "Bem-vindos ao tutorial de acessibilidade web. Neste áudio, vamos aprender sobre textos alternativos e como tornar conteúdo multimídia acessível."

Duração: 30 segundos

Vídeo Apenas Visual

Descrição do Vídeo:

O vídeo demonstra navegação por teclado em uma interface web:

  1. Navegação pelos links usando Tab
  2. Ativação de botões com Enter
  3. Navegação em formulários

1.2.2 - Legendas (Pré-gravado)

Legendas devem ser fornecidas para todo áudio em mídia sincronizada.

Vídeo com Legendas

Transcrição Completa

Tutorial: Acessibilidade Web

[00:00-00:15] Instrutor: Bem-vindos ao tutorial sobre acessibilidade web.
[00:16-00:30] Instrutor: Hoje aprenderemos sobre textos alternativos.
[00:31-00:45] [Som de digitação] Vamos ver exemplos práticos.

Recursos Adicionais

Ferramentas de Validação

Documentação WCAG

Mídia Alternativa