Solucionado
Sobre aquela mensagem padrão ("Por favor satisfaça o formato requisitado"). Ao meu ver deixa o usuário perdido.
Sei que o placeholder já dá uma dica do formato requisitado mas se essa mensagem pudesse ser mais clara, ajudaria o nosso usuário.
Há alguma boa prática nesse sentido?
Fala ai Rafael, tem como fazer isso usando javascript, você usa o validity dos inputs, ai o ideal seria você ter um validity para cada pattern, segue abaixo um exemplo bem simples.
document.querySelector('input[type=email]').oninvalid = function() {
// remove mensagens de erro antigas
this.setCustomValidity("");
// reexecuta validação
if (!this.validity.valid) {
// se inválido, coloca mensagem de erro
this.setCustomValidity("Email inválido");
}
};Perfeito!