✅ Formulários em HTML5 - Novos Tipos de Dados

Índice

Um dos problemas que tivemos com a versão anterior do HTML ou seja 4, foi a validação já que tivemos que usar outra tecnologia para a sua validação, claro que com o Javascript demos o toque que precisávamos para dar o que faltava a esses formulários .
No HTML5 isso foi resolvido uma vez que algumas grandes melhorias foram feitas para sua própria validação e outras para seu fácil manuseio para parecer mais atraente.
Neste capítulo, veremos uma pequena amostra dos novos recursos de formulários em HTML5. E entenderemos que seus novos recursos são muito importantes para a web de hoje.
Agora, lembre-se de que nem todos os navegadores oferecem suporte a esses novos recursos e aqueles que mostram os resultados de sua própria maneira, mas vamos começar:
Todos nós sabemos que O rótulo especifica um campo de entrada onde o usuário pode inserir dados. Bem, em HTML5 vemos que tem vários tipos de entrada ou. Esses novos recursos permitem um melhor controle de entrada e validação.
Tipo de dados
: especifica que o usuário deve preencher o campo com texto
: especifica que o usuário deve preencher o campo com um e-mail válido
: especifica que o usuário deve preencher o campo com url
: especifica que o usuário deve preencher o campo com uma cor
: especifica que o usuário deve preencher o campo com uma data
: especifica que o usuário deve preencher o campo com um dos meses
Alguns exemplos de elementos HTML5
Atributos de validação
Os atributos de validação permitem fazer com que uma caixa de texto ou caixa de texto aceite um único tipo de dados como os mencionados acima e o HTML5 irá validar se os dados estão corretos, antes que tivesse que ser feito com javascript ou jquery.
Um exemplo de validação de um e-mail

 E-mail:

O Atributo Keygen
Sempre que usamos uma senha, gostaríamos de poder criptografá-la para maior segurança
O objetivo do elemento é fornecer uma maneira segura de autenticar usuários.
O rótulo especifica um campo gerador de duas chaves em um formulário.
Quando o formulário é enviado, duas chaves são geradas, uma privada e uma pública.
A chave privada é armazenada localmente e a chave pública é enviada ao servidor. A chave pública pode ser usada para gerar um certificado de cliente para autenticar o usuário no futuro ou para salvar como uma senha em um banco de dados ou para validar sessões.

 Senha do usuário:

O atributo Autofocus
O foco automático fornece uma maneira declarativa de enfocar um controle de formulário durante o carregamento da página. Anteriormente, um desenvolvedor precisava escrever Javascript usando control.focus (). A nova forma permite que o navegador faça coisas inteligentes como não centralizar o controle se o usuário já estiver digitando em outro.