Validación HTML: Valor incorrecto X para el atributo "required" en el elemento "input".

Acerca de este problema HTML

En HTML, los atributos booleanos como required funcionan de manera diferente a lo que muchos desarrolladores esperan. Su presencia en un elemento significa que el valor es verdadero, y su ausencia significa que el valor es falso. Según la especificación HTML de WHATWG, el valor de un atributo booleano debe ser la cadena vacía o coincidir con el nombre canónico del atributo sin distinción entre mayúsculas y minúsculas ASCII. Para el atributo required, esto significa que los únicos valores válidos son "" (cadena vacía) y "required".

Un error común es escribir required="true" o required="false". El valor "true" no es un valor válido para atributos booleanos en HTML y provocará este error de validación. Aún más confuso, escribir required="false" no hace que el input sea opcional — ya que el atributo sigue presente, el navegador aún trata el campo como obligatorio. Esto puede llevar a errores sutiles donde un campo de formulario parece ser opcional en tu código pero en realidad es requerido por el navegador.

Esto es importante por varias razones:

Cumplimiento de estándares: Los valores de atributos inválidos violan la especificación HTML y causarán errores de validación W3C.
Claridad del código: Usar valores no estándar como "true" o "false" confunde a otros desarrolladores sobre cómo funciona el atributo.
Comportamiento inesperado: required="false" aún hace que el campo sea obligatorio, lo que puede causar comportamientos confusos en el formulario.

Para hacer que un campo sea opcional, simplemente elimina el atributo required por completo en lugar de establecerlo como "false".

Ejemplos

Incorrecto: Valores inválidos para `required`

Todos estos provocarán el error de validación “Valor incorrecto para el atributo required“:

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

Correcto: Usos válidos del atributo `required`

Las tres formas siguientes son válidas y hacen que el input sea obligatorio:

<!-- Preferido: sin valor (más conciso) -->

<input type="text" required>

<!-- También válido: cadena vacía -->

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

<!-- También válido: nombre canónico como valor -->

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

Correcto: Hacer que un campo sea opcional

Para hacer que un campo sea opcional, elimina el atributo por completo:

<input type="text">

Ejemplo de formulario completo

<form action="/submit" method="post">
  <label for="name">Nombre (obligatorio):</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">Enviar</button>
</form>

Esta misma regla se aplica a otros atributos booleanos en HTML, como disabled, checked, readonly, multiple, y autofocus. Todos siguen el mismo patrón: usa el atributo sin valor, con una cadena vacía, o con el propio nombre del atributo como valor. Nunca les asignes "true" o "false".