Rullst AcademyRullst Academy/Lição
HTML semântico e acessibilidade · Lição 09 / 10

Revisar além da aparência

Agora vamos percorrer a página como quem precisa encontrar caminhos previsíveis.

Trilhas de aprendizado14 min

Vamos descobrir juntos

  1. 1

    Tab e Shift+Tab percorrem controles e links; Enter ativa links, e botões nativos oferecem sua operação por teclado. Nem todo texto deve receber Tab. Preserve a ordem natural do documento; não adicione tabindex positivo para forçar uma sequência visual.

  2. 2

    O foco deve ser visível. Um link inicial “Pular para o conteúdo” reduz repetição de navegação; aponta para main com id. No projeto, tabindex="-1" permite focar esse destino sem acrescentá-lo à sequência normal de Tab.

  3. 3

    Confira também títulos, nomes dos links, textos alternativos e labels. Abra details com summary por teclado. A revisão automática da oficina faz apenas verificações simples: não é um validador completo de HTML nem uma auditoria WCAG.

  4. 4

    No computador, confira o arquivo local com zoom e janela estreita; aumente texto e observe cortes. Um leitor de tela e testes com pessoas acrescentam evidências que uma inspeção visual não oferece. Registre ambiente, observação, correção e o que ainda falta testar.

  5. 5

    Na revisão de formulários, não impeça colar conteúdo nem o uso de gerenciadores de senhas. Evite pedir novamente uma informação já fornecida sem necessidade. Esses cuidados se relacionam à entrada redundante e à autenticação acessível da WCAG 2.2; não bastam, sozinhos, para declarar conformidade.

Oficina de HTML: escrever, observar, revisar

Edite o HTML em “Meus arquivos e GitHub” e atualize a prévia. Ela usa elementos de estudo e estilos de leitura: scripts, CSS próprio e navegação externa ficam desativados. Apenas route.svg do kit é exibida como imagem.

Ir ao meu HTML

Estas verificações simples não são uma validação completa de HTML nem uma auditoria WCAG. Confira conteúdo, teclado, zoom e tecnologias assistivas; registre o que ainda não testou.

Links oficiais e próximo passo

✦
SUA MISSÃO

Fazer uma revisão inicial de teclado, foco, estrutura e conteúdo.

Agora é a sua vez

Oficina de descobertas

Leia, preveja, experimente

Uma página parece boa com mouse, mas um div usado como botão não recebe foco com Tab.
Monte suas respostas e confira quando estiver pronto.
Uma pausa para entender

Zero pistas automáticas prova conformidade completa?

Preciso de uma pista

Compare a intenção com o significado dos elementos; aparência sozinha não demonstra acessibilidade.

Carregando sua jornada…

Leve com você

Faça três verificações manuais e registre uma limitação real. Se não usou leitor de tela, escreva que esse teste ainda está pendente.

No seu ritmo

Meus arquivos e GitHub

Toda lição pode virar um registro seu: código, anotações ou um plano de prática. Guardar um arquivo no GitHub é opcional e não altera seu XP.

Manual do aluno

O editor e os downloads abrem quando esta lição estiver liberada para sua conta. Confira o acesso abaixo ou volte ao mapa da trilha.

Conferindo seu acesso à lição…

Rullstpetbot

A IA pode errar. Confira no material da lição.