Criar um formulário HTML com campos relevantes

Criar um formulário HTML pode ser um desafio para muitos desenvolvedores, especialmente se eles estão iniciando. Neste artigo, vamos mostrar como criar um formulário HTML com campos relevantes, fornecendo exemplos para ajudar nós desenvolvedores a entender melhor a criação de formulários.

1. Formulário de contato

Um formulário de contato é um dos tipos mais comuns de formulários HTML que você pode criar. Ele permite que os usuários enviem mensagens para você através do site. Um exemplo de código para um formulário de contato pode ser:

<form action="enviar.php" method="post">

  <label for="nome">Nome:</label>
  <input type="text" id="nome" name="nome" required>

  <label for="email">E-mail:</label>
  <input type="email" id="email" name="email" required>

  <label for="mensagem">Mensagem:</label>
  <textarea id="mensagem" name="mensagem" required></textarea>

  <input type="submit" value="Enviar">
</form>

Neste exemplo, há campos para o nome, e-mail e mensagem do usuário, todos com a tag <label> para indicar o tipo de informação solicitada. Além disso, há a tag <textarea> para o campo de mensagem, permitindo que o usuário escreva mais texto.

2. Formulário de cadastro

Outro tipo comum de formulário é o formulário de cadastro, que é usado para coletar informações do usuário para criar uma conta ou perfil. Um exemplo de código para um formulário de cadastro pode ser:

<form action="cadastrar.php" method="post">
  <label for="nome">Nome:</label>
  <input type="text" id="nome" name="nome" required>

  <label for="email">E-mail:</label>
  <input type="email" id="email" name="email" required>

  <label for="senha">Senha:</label>
  <input type="password" id="senha" name="senha" required>

  <label for="confirma_senha">Confirme a senha:</label>
  <input type="password" id="confirma_senha" name="confirma_senha" required>

  <input type="submit" value="Cadastrar">
</form>

Neste exemplo, há campos para o nome, e-mail, senha e confirmação de senha do usuário, todos com a tag <label> para indicar o tipo de informação solicitada. Além disso, há a tag <input type="password"> para os campos de senha, ocultando a entrada do usuário.

3. Formulário de pesquisa

Um formulário de pesquisa é usado para permitir que os usuários encontrem informações específicas no seu site. Um exemplo de código para um formulário de pesquisa pode ser:

<form action="buscar.php" method="get">
  <label for="pesquisa">Pesquisar:</label>
  <input type="text" id="pesquisa" name="pesquisa" required>

  <input type="submit" value="Buscar">
</form>

Neste exemplo, há um campo para o usuário inserir o termo de pesquisa, com a tag <label> para indicar o tipo de informação solicitada. Além disso, o formulário utiliza o método.

Stefany Repetcki - Dev Front End