<input> の type 属性は、そのUI、オンスクリーンキーボード(モバイル)、および組み込み検証を変更します。正しいタイプを使用するとユーザビリティが向上し、無料で検証が得られます。
html
<input> の type 属性は、そのUI、オンスクリーンキーボード(モバイル)、および組み込み検証を変更します。正しいタイプを使用するとユーザビリティが向上し、無料で検証が得られます。
モバイルキーボードが適応する — type="email" は @ キーを表示し、type="tel" は数字パッドを表示し、type="number" は数字を表示します。これだけでもモバイルで大きなユーザビリティの向上です。
無料の検証 — type="email" は送信時に not-an-email を拒否し、min/max は数字を制限し、type="url" は有効なURLをチェックします — JavaScriptは不要です。
<input type="radio" name="plan" value="free" /> Free
<input type="radio" name="plan" value="pro" /> Pro
<!-- same name = mutually exclusive; only one can be selected -->
正しい入力タイプを選択することで、より良いモバイルキーボード、ネイティブピッカー、および無料の組み込み検証が得られます — アクセシビリティが向上し、そうでなければ書く必要があるJavaScriptが削減されます。
これは小さな選択ですが、UXのペイオフは非常に大きいです。
ジュニアからシニアまで、詳細な回答付きのIT面接質問ライブラリ。
寄付する