Mariana está desenvolvendo a nova página institucional de sua empresa e quer aproveitar algumas funcionalidades do HTML 5 para garantia de acessibilidade. Um dos cuidados que Mariana deve ter é:
- A)configurar o atributo data-message em cada div;
Errada: atributo data-* serve para dados personalizados, não para garantir acessibilidade de campos.
- B)utilizar o elemento label para associar a descrição de um campo ao componente do formulário;
Certa: o elemento label associa corretamente a descrição do campo ao componente do formulário, melhorando usabilidade e acessibilidade.
- C)nunca utilizar o atributo role;
Errada: o atributo role pode ser usado quando necessário, especialmente em ARIA, então não deve ser banido em bloco.
- D)evitar o uso de th nas tabelas;
Errada: th é importante para identificar células de cabeçalho em tabelas e ajuda leitores de tela a interpretar a estrutura.
- E)definir todas as imagens como atributos background-image, da configuração CSS.
Errada: imagem de conteúdo não deve ser escondida em background-image quando a informação precisa ser percebida como conteúdo acessível.
Gabarito: B
Em HTML 5, acessibilidade não é enfeite: é parte central da construção da página. Um ponto básico é garantir que os campos de formulário tenham descrição clara e associada ao controle que o usuário vai preencher. É aí que entra o elemento label, que liga o texto explicativo ao input e ajuda leitores de tela, clique no texto e navegação por teclado. Na prática, isso evita o clássico problema de campo "solto", em que a pessoa vê uma caixa, mas não sabe exatamente o que preencher. Quando o label está corretamente associado ao componente, a experiência melhora para todo mundo, inclusive para quem usa tecnologias assistivas. Esse é um dos fundamentos mais cobrados em provas quando o assunto é acessibilidade em HTML. A alternativa B está correta porque o elemento label serve justamente para associar a descrição de um campo ao componente do formulário, seja pelo atributo for ligado ao id do controle, seja envolvendo o próprio componente. Isso está em linha com as boas práticas do HTML e com as recomendações de acessibilidade do W3C/WAI, especialmente as diretrizes da WCAG, que valorizam nomes, rótulos e instruções claros. As outras opções tentam parecer "moderninhas", mas não ajudam na acessibilidade como descrito. Em resumo: se houver formulário, pense em rótulo bem amarrado. Isso costuma render ponto e evita uma página bonita, porém difícil de usar.