Formulários
Erro de validação
Validation message
Explica o que impede um campo de ser aceito e como corrigir.
Exemplo didático · Experimente os controles acima
Quando usar
Guiar a correção de dados antes de prosseguir.
Cuidados e acessibilidade
Use texto específico, associe o erro ao campo e preserve o que já foi preenchido.
Partes e comportamento
Estado inválido, mensagem específica e vínculo com o controle.
Não confunda
Não exiba erro de formato agressivamente antes de a pessoa terminar a entrada.
Exemplo de código
<label for="email">E-mail</label>
<input id="email" type="email" aria-invalid="true" aria-describedby="erro">
<p id="erro">Informe um e-mail completo.</p>Trecho didático. Integre e teste no contexto do seu projeto.