Como escrever uma mensagem de erro útil em um formulário da web?

Uma mensagem de erro deve indicar o que está bloqueando e como corrigir o campo. "Entrada inválida" ou uma moldura vermelha sem texto não é suficiente, especialmente para uma pessoa que usa o teclado ou o leitor de tela.

Dê uma instrução relacionada ao campo

Escreva “Indique um endereço de e-mail contendo @” em vez de “Erro 42”. Coloque o texto próximo ao campo e associe-o tecnicamente a ele. Os W3C recomenda Notificações claras, com retorno global após o envio e retorno próximo ao controle em questão.

Prevenir em vez de surpreender

Especifique antes de inserir os formatos e informações obrigatórias: comprimento de um identificador, formato de data ou tamanho máximo de um arquivo. Não exiba uma restrição conhecida somente após várias tentativas. Os exemplos devem corresponder aos formatos reais aceitos e evitar a necessidade de dados não necessários para a tarefa.

Mantenha as respostas e oriente o retorno

Após um servidor ou erro de validação, mantenha os campos já inseridos quando possível. Exiba um resumo dos erros na parte superior do formulário e das indicações locais. Coloque o foco em um local lógico para retomar a correção e, em seguida, deixe o usuário verificar as alterações antes de uma nova remessa.

Distinguir a correção, o fracasso e o sucesso

Um campo mal preenchido não é uma indisponibilidade do serviço. Se a remessa falhar por um motivo técnico, anuncie-a sem alegar que a solicitação foi recebida e forneça outro meio de contato, se possível. Por outro lado, uma remessa bem-sucedida deve fornecer uma confirmação explícita e indicar a seqüência esperada.

Teste com erros reais

Tente um campo vazio, um formato plausível, mas recusado, um arquivo muito pesado e uma perda de conexão. Teste no teclado, no telefone e com tecnologia de suporte, se disponível. Os Guia de formulário de contato Ajuda a reduzir campos antes mesmo de escrever seus erros.