Este curso divide os formulários HTML em partes fáceis de entender. Nos próximos módulos, você aprenderá como funciona um formulário HTML e como usá-lo efetivamente em seus projetos. Use o painel de menu ao lado do logotipo do Learn Forms para navegar pelos módulos.
Você aprenderá a criar um formulário HTML básico, aprenderá sobre elementos de formulários HTML, estilizar formulários, ajudar usuários a inserir dados novamente, garantir que o formulário seja acessível e seguro, como testar seus formulários e sobre tipos específicos de formulários.
Cada módulo é cheio de demonstrações interativas e autoavaliações para você testar seu conhecimento.
Este curso é adequado para desenvolvedores de HTML iniciantes e avançados. Os primeiros módulos ajudam você a começar a criar formulários HTML, os outros fornecem mais detalhes. Você pode percorrer a série do início ao fim para ter uma compreensão geral dos formulários HTML ou escolher um módulo específico sobre o qual queira aprender mais.
Pré-requisitos
Antes de iniciar este curso, você precisa conhecer HTML. Para iniciantes em desenvolvimento da Web, confira o curso de introdução ao HTML do MDN para saber tudo sobre como criar marcações.
Demonstrações
Para a maioria das demonstrações, usamos o CodePen.
Você pode se perguntar de onde vêm os estilos nas demonstrações. Usamos uma folha de estilo geral incluída em todas as demonstrações, de modo que somente os estilos relevantes são mostrados nela. No CodePen, é possível selecionar os arquivos CSS incluídos nas configurações.
Controles e campos de formulários
Um controle de formulário é um elemento que permite a interação do usuário e a entrada ou seleção de dados:
um <input>
, <select>
, <textarea>
ou <button>
.
Às vezes, o campo do formulário é usado para se referir a controles de formulário,
em elementos específicos para entrada de texto: <input>
e <textarea>
.
Confira o que você aprenderá
Usar formulários para receber dados dos usuários
Aprenda as noções básicas de uso de formulários na Web com esta introdução ao elemento de formulário.
Ajudar os usuários a inserir dados em formulários
Uma visão geral dos vários elementos de formulário que você pode escolher para criar um formulário.
Ajudar os usuários a evitar a reinserção de dados em formulários
Facilitar o preenchimento de formulários para os usuários.
Ajudar os usuários a inserir os dados certos nos formulários
Saiba como validar seus formulários no front-end.
Testar seus formulários
Saiba como testar e analisar seus formulários.
Conceitos básicos de design
Saiba como criar formulários fáceis de usar.
Acessibilidade
Como criar formulários inclusivos
Internacionalização e localização
Esteja preparado para formatos de dados internacionais e saiba como planejar seu formulário para localização.
Segurança e privacidade
Saiba como proteger seus formulários e manter a privacidade dos dados dos usuários.
Preenchimento automático
Saiba tudo sobre o preenchimento automático e o atributo de preenchimento automático.
Como testar a usabilidade de formulários
Descubra como fazer testes de usabilidade e garanta que seu formulário funcione bem para todos os usuários.
Teste de formulários em vários dispositivos e plataformas
Seu formulário precisa funcionar em diferentes dispositivos, navegadores, plataformas e contextos.
Coleta de dados
Saiba como medir e analisar seu formulário.
O elemento do formulário em detalhes
Saiba em detalhes tudo sobre o elemento de formulário, quando usar um formulário e como ele funciona.
Detalhes dos campos do formulário
Saiba mais sobre os diferentes campos de formulário que podem ser usados e como escolher o elemento certo.
Detalhes dos atributos do formulário
Saiba tudo sobre atributos de formulário: como modificar o layout de teclados na tela, ativar a validação integrada e muito mais.
Como definir o estilo de formulários
Estilizar formulários usando CSS, garantindo que eles permaneçam utilizáveis e legíveis para todos.
Estilizar controles de formulários
Saiba como implementar controles de formulário com CSS.
JavaScript
Descubra como usar o JavaScript para aprimorar seus formulários.
Formulários de pagamento
Melhore as taxas de conversão criando formas de pagamento melhores.
Formulários de endereço
Ajude os usuários a preencher formulários de endereço de forma rápida e fácil.
Conclusão e próximas etapas
Outros recursos para ajudar você nas próximas etapas.
Então, você está pronto para aprender sobre formulários? Vamos começar.