Skip to main content
Validação HTML

O papel “group” é desnecessário para o elemento “fieldset”.

Sobre este problema HTML

Muitos elementos HTML vêm com papéis ARIA incorporados que as tecnologias assistivas já reconhecem. O elemento <fieldset> é um destes — o seu papel implícito é group, que informa os leitores de ecrã de que os controlos de formulário contidos estão relacionados. Quando adiciona role="group" a um <fieldset>, está a dizer ao navegador algo que ele já sabe.

Esta redundância é importante por algumas razões:

  • Limpeza do código: Atributos desnecessários adicionam confusão, tornando a sua marcação mais difícil de ler e manter.
  • Boas práticas ARIA: A primeira regra do ARIA é “Se puder usar um elemento ou atributo HTML nativo com a semântica e comportamento que precisa já incorporados, em vez de reorientar um elemento e adicionar um papel, estado ou propriedade ARIA para o tornar acessível, então faça-o.” Adicionar role="group" ao <fieldset> viola este princípio em espírito — sugere que o programador pode não compreender a semântica nativa do elemento.
  • Confusão potencial: Definir explicitamente papéis que correspondem ao padrão pode induzir outros programadores em erro, fazendo-os pensar que o papel está a fazer algo especial, ou que removê-lo mudaria o comportamento.

Este mesmo princípio aplica-se a outros elementos com papéis implícitos, como role="navigation" em <nav>, role="banner" em <header>, ou role="button" em <button>. Se o elemento já carrega o significado semântico nativamente, não há necessidade de o duplicar com um papel ARIA explícito.

Para corrigir isto, simplesmente remova o atributo role="group" do elemento <fieldset>. Não é necessária substituição — o navegador e as tecnologias assistivas continuarão a tratar o <fieldset> como um grupo automaticamente.

Exemplos

Incorreto: role="group" redundante em <fieldset>

<form>
  <fieldset role="group">
    <legend>Endereço de Envio</legend>
    <label for="street">Rua:</label>
    <input type="text" id="street" name="street">
    <label for="city">Cidade:</label>
    <input type="text" id="city" name="city">
  </fieldset>
</form>

O validador reportará que o papel group é desnecessário para o elemento <fieldset>.

Correto: <fieldset> sem papel explícito

<form>
  <fieldset>
    <legend>Endereço de Envio</legend>
    <label for="street">Rua:</label>
    <input type="text" id="street" name="street">
    <label for="city">Cidade:</label>
    <input type="text" id="city" name="city">
  </fieldset>
</form>

O elemento <fieldset> comunica inerentemente o papel group às tecnologias assistivas, pelo que não é necessário nenhum atributo ARIA.

Quando role em <fieldset> é apropriado

Há casos em que pode legitimamente definir um papel diferente num <fieldset> — por exemplo, role="radiogroup" quando o fieldset contém um conjunto de botões de opção relacionados e quer transmitir semântica mais específica:

<form>
  <fieldset role="radiogroup" aria-labelledby="color-legend">
    <legend id="color-legend">Cor Favorita</legend>
    <label><input type="radio" name="color" value="red"> Vermelho</label>
    <label><input type="radio" name="color" value="blue"> Azul</label>
    <label><input type="radio" name="color" value="green"> Verde</label>
  </fieldset>
</form>

Isto é válido porque radiogroup é um papel diferente que fornece significado mais específico do que o group padrão. O validador apenas avisa quando o papel explícito corresponde ao papel implícito do elemento.

Encontre problemas como este automaticamente

O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.

Ajude-nos a melhorar os nossos guias

Este guia foi útil?

Pronto para validar os seus sites?
Comece o seu teste gratuito hoje.