HTML5概要：種類が増えて便利になった入力フォーム

入力項目の種類や属性が増え、便利になったHTML5の入力フォーム

HTML5では、従来のinput要素では作れなかった様々な入力欄が作れるようになっています。入力を必須にしたり、入力内容を制限したりもできます。これまでの入力フォームにあった不便をいくらか解消し、便利で使いやすい入力フォームが作れるでしょう。

従来の入力フォームでよくある困ったことがHTML5では簡単解決

従来のHTMLでは、たとえば以下のような不便な点がありました。

• 入力必須項目にちゃんと入力されないことがある
• メールアドレス欄にメールアドレス以外の文字列が入力されることがある
• 日付を簡単に入力できるフォームがない（年月日別に項目を用意したり、正しい年月日が入力されたかどうかを判定するのが大変）

どれも、解決するにはJavaScriptやCGIを利用する必要がありました。HTML5ではこれらが解決されています。

• HTML5では、入力が必須であることを示す属性が追加されたため、必須項目が空欄の場合にはブラウザが指摘してくれます。
• HTML5では、「メールアドレス欄」・「URL欄」専用のtype属性が増えたため、メールアドレスかどうか・URLかどうかは、ブラウザが判定してくれます。
• 日付や時刻を入力する専用のフォームを作ることができ、必要に応じてカレンダーやボタンなどの入力補助が表示されます。

他にも、正規表現で入力規則を書いておけば、その入力規則に従っているかどうかをチェックする機能など、便利な機能が加わっています。これらはすべて、HTMLだけで実現でき、JavaScriptやCGIなどを記述する必要はありません。

「ファイル選択」のように従来からある入力欄でも、（属性を加えれば）複数ファイルの選択が可能になるなど、様々な改善も加わっています。

次のページでは、新しくなった入力フォームを見てみましょう。