Legendas de fieldset

A Silktide verifica se cada grupo de campos de formulário declarado com um fieldset também inclui uma legenda que descreva para que serve o grupo. A legenda dá um nome ao grupo inteiro, para que cada opção seja ouvida no contexto.

Em , o elemento <fieldset> agrupa controles de formulário relacionados — um conjunto de botões de opção, caixas de seleção ou campos de endereço — e o elemento <legend> é a sua legenda.

<!-- Problema: o grupo não tem legenda -->
<fieldset>
  <label><input type="radio" name="size" value="s"> Pequeno</label>
  <label><input type="radio" name="size" value="l"> Grande</label>
</fieldset>

Por que isso é importante

Um visitante que enxerga vê a legenda do grupo logo acima das opções. Um utilizador de ouve cada opção uma de cada vez e, sem uma legenda, ouve apenas “Pequeno” e “Grande”, sem indicação do que está a ser escolhido. A legenda é anunciada quando a pessoa entra no grupo, para que perguntas como “Tamanho da t-shirt” cheguem a todos.

Como corrigir

Adicione um <legend> como primeiro elemento dentro de cada <fieldset>, descrevendo o grupo em poucas palavras:

<!-- Corrigido: a legenda dá um nome ao grupo -->
<fieldset>
  <legend>Tamanho da t-shirt</legend>
  <label><input type="radio" name="size" value="s"> Pequeno</label>
  <label><input type="radio" name="size" value="l"> Grande</label>
</fieldset>

Mantenha as legendas curtas — os leitores de ecrã podem repetir a legenda para cada campo do grupo.

Como a Silktide verifica isto

Encontra todos os elementos <fieldset> em cada página.
Comunica cada elemento que não tenha um elemento <legend> como filho direto.

Resolução de problemas

A minha legenda existe, mas continua a ser comunicada

O <legend> tem de ser um filho direto do <fieldset>. Uma legenda aninhada dentro de outro elemento, como um elemento <div> de agrupamento, não é reconhecida como a legenda do grupo — nem por esta verificação nem pela .