HTML5
The placeholder attribute of the input element of HyperText Markup Language 5.
この記事では、入力欄にヒントを薄く表示するplaceholder属性と、内容の説明やアクセシビリティを担うlabelとの使い分けを説明します。
<input placeholder>
input 要素の placeholder 属性で指定した値が、入力欄に初期値として表示されます。 例えば、テキストフィールドに初期値として、 「検索するキーワードを入力してください」などのヒントを示してユーザーの操作を補助することができます。
属性
- placeholder
- 初期表示する内容（プレースホルダー）を指定する。
Sample
<label for="placeholder-keyword">キーワード:</label>
<input type="text" id="placeholder-keyword" placeholder="キーワード">
placeholder 属性を使い、初期表示だけで「何を入力するのか」を説明するのはやめておいた方が良さそうです。なぜなら、何かしらの文字を入力するとプレースホルダーが消えてしまい、何を入力すべきかわからなくなってしまうからです。
<label>
キーワード：<br>
<input type="text" placeholder="キーワード">
</label>
label 要素を使い、各入力欄にラベルを付け、「何を入力するのか」を明確にしておくほうが良さそうです。