Para melhorar a sua experiência, escute esse artigo. |
Validações de campos para formulários em HTML5
Você já teve problemas com spam preenchendo os campos de qualquer jeito dentro do seus formulários feitos com HTML5? Sim, nós sabemos como isso é horrível, e por isso estamos compartilhando com você umas das nossas métricas de configuração dos sites dos nossos clientes. As validações de campos para formulário em HTML5 é somente uma das maneiras de evitar o preenchimento robótico, e até mesmo confundir um cliente que não leu corretamente o que deveria ser preenchido em um campo específico.
Validações:
Ocorre muito a confusão quando o campo é apropriado para telefone, e-mail e até mesmo o nome ou sobrenome em alguns casos. A validação ela permite reforçar o que as vezes já vem diretamente setado no código, como no caso o campo e-mail. Dessa forma estamos deixando abaixo algumas das mais importantes validações que você pode aplicar de forma simples e rápida em qualquer formulário em HTML5
- Apenas letras:
<input type="text" required="required" name="text" pattern="[a-zA-Z\s]+$" />
- Apenas números:
<input type="text" required="required" name="numbers" pattern="[0-9]+$" />
- Data:
<input type="date" required="required" maxlength="10" name="date" pattern="[0-9]{2}\/[0-9]{2}\/[0-9]{4}$" min="2012-01-01" max="2014-02-18" />
- Hora:
<input type="time" required="required" maxlength="8" name="hour" pattern="[0-9]{2}:[0-9]{2} [0-9]{2}$" />
- Telefone:
<input type="tel" required="required" maxlength="15" name="phone" pattern="[0-9]{2}-[0-9]{4,6}-[0-9]{3,4}$" />
- E-mail:
<input type="email" required="required" class="input-text" name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" />
- Desabilitar select automático de campos com opção para selecionar:
value="" disabled selected
Você pode usar todo o input como no exemplo acima, ou apenas usar o pattern=”” isso porque em alguns casos o seu input pode necessitar de uma classe específica para funcionar com o estilo certo.
Com isso você consegue inibir e dificultar o preenchimento incorreto do seus campos no formulário. Sim nós sabemos que somente essa ação não será 100% eficaz contra spam, existem inúmeros robôs forçando o preenchimento a todo instante, então assim como tudo na vida, precisamos evoluir constantemente os nossos métodos.
De toda forma você aplicando essas validações de campos para formulários em HTML5 você começa a desviar de spam com frequência em seus endereços.