Verificação HTML: Valor inválido X para o atributo "required" no elemento "input".

Sobre este problema HTML

Em HTML, atributos booleanos como required funcionam de forma diferente do que muitos programadores esperam. A sua presença num elemento significa que o valor é verdadeiro, e a sua ausência significa que o valor é falso. De acordo com a especificação HTML WHATWG, o valor de um atributo booleano deve ser uma string vazia ou uma correspondência ASCII insensível a maiúsculas/minúsculas para o nome canónico do atributo. Para o atributo required, isto significa que os únicos valores válidos são "" (string vazia) e "required".

Um erro comum é escrever required="true" ou required="false". O valor "true" não é um valor válido para atributo booleano em HTML e irá desencadear este erro de validação. Ainda mais confuso é escrever required="false", que não torna o input opcional — uma vez que o atributo ainda está presente, o navegador ainda trata o campo como obrigatório. Isto pode levar a bugs subtis onde um campo de formulário parece ser opcional no seu código mas é na verdade obrigatório pelo navegador.

Isto é importante por várias razões:

Conformidade com padrões: Valores de atributo inválidos violam a especificação HTML e causarão erros de validação W3C.
Clareza do código: Usar valores não-padrão como "true" ou "false" confunde outros programadores sobre como o atributo funciona.
Comportamento inesperado: required="false" ainda torna o campo obrigatório, o que pode causar comportamento confuso no formulário.

Para tornar um campo opcional, simplesmente remova o atributo required completamente em vez de defini-lo como "false".

Exemplos

Incorreto: Valores inválidos para `required`

Todos estes irão desencadear o erro de validação “Valor inválido para o atributo required“:

<input type="text" required="true">
<input type="email" required="false">
<input type="text" required="yes">
<input type="text" required="1">

Correto: Usos válidos do atributo `required`

Todas estas três formas são válidas e tornam o input obrigatório:

<!-- Preferido: sem valor (mais conciso) -->

<input type="text" required>

<!-- Também válido: string vazia -->

<input type="text" required="">

<!-- Também válido: nome canónico como valor -->

<input type="text" required="required">

Correto: Tornando um campo opcional

Para tornar um campo opcional, remova o atributo completamente:

<input type="text">

Exemplo de formulário completo

<form action="/submit" method="post">
  <label for="name">Nome (obrigatório):</label>
  <input type="text" id="name" name="name" required>

  <label for="notes">Notas (opcional):</label>
  <input type="text" id="notes" name="notes">

  <button type="submit">Submeter</button>
</form>

Esta mesma regra aplica-se a outros atributos booleanos em HTML, tais como disabled, checked, readonly, multiple, e autofocus. Todos seguem o mesmo padrão: use o atributo sem valor, com uma string vazia, ou com o próprio nome do atributo como valor. Nunca atribua "true" ou "false" a eles.