HTMLフォームとテキスト入力フォームの使い方を完全ガイド！初心者でもわかるフォーム作成方法
新人
「HTMLでユーザーが情報を入力できるフォームを作りたいんですが、どうすればいいですか？」
先輩
「フォームを作るには、HTMLのformタグを使います。inputタグを使って、ユーザーがテキストを入力できるようにすることができます。」
新人
「テキストを入力できるフォームって、どうやって作るんですか？」
先輩
「それでは、フォームとテキスト入力フォームの基本的な作り方を見ていきましょう！」
1. formタグとは？
formタグは、ユーザーが情報を入力するためのフォームを作成するために使います。フォームは、ユーザーがウェブページ上で情報を送信する際に使用されます。例えば、名前やメールアドレスを入力するためのフィールドを作ることができます。
<form action="submit_form.php" method="post">
<label for="name">名前:</label>
<input type="text" id="name" name="name">
<input type="submit" value="送信">
</form>
この例では、formタグ内にテキスト入力欄（inputタグ）と送信ボタン（inputタグ）があります。フォームが送信されると、データは指定されたactionで指定されたページ（ここではsubmit_form.php）に送信されます。
2. input type="text"とは？
input type="text"は、ユーザーがテキストを入力できるフォームフィールドを作成するためのものです。ユーザーが名前や住所、電話番号など、文字列を入力できるようにするために使用されます。
<form action="submit_form.php" method="post">
<label for="email">メールアドレス:</label>
<input type="text" id="email" name="email">
<input type="submit" value="送信">
</form>
このコードでは、メールアドレスを入力するためのテキストボックス（input type="text"）があります。ユーザーがメールアドレスを入力し、フォームを送信することができます。
3. フォームの送信方法
フォームは、ユーザーが入力したデータをサーバーに送信するために使用されます。フォームの送信方法には2つの主な方法があります。GETとPOSTです。
- GET: URLにデータを付加して送信します。主に、検索フォームなどで使用されます。
- POST: データをHTTPリクエストのボディに含めて送信します。より安全で、プライバシーを保護するために使用されます。
フォームの送信方法を指定するには、formタグのmethod属性を使用します。
<form action="submit_form.php" method="post">
<label for="message">メッセージ:</label>
<input type="text" id="message" name="message">
<input type="submit" value="送信">
</form>
この例では、method="post"を指定して、ユーザーが入力したメッセージがサーバーに送信されます。
4. フォームにラベルを追加する
フォームフィールドには、どんな情報を入力するべきかを示すためにラベルを追加することが重要です。labelタグを使用して、フォームフィールドにラベルを付けることができます。これにより、ユーザーはどのフィールドに何を入力すべきかを簡単に理解できます。
<form action="submit_form.php" method="post">
<label for="name">名前:</label>
<input type="text" id="name" name="name">
<input type="submit" value="送信">
</form>
labelタグを使うことで、ユーザーはフォームの各項目が何を意味しているかを理解しやすくなります。
