サイト制作

電話番号の入力欄はtelにすれば安心？自動チェックとキーボードの違い

慈愛妃きづな

2026-11-07

この記事には広告・アフィリエイトリンクが含まれます。

inputのtel型は電話番号向けの入力欄です。専用キーボードの表示と、入力内容の検証は別の機能として考えましょう。

telは電話番号向けの入力を助ける

電話番号の欄にinputのtel型を使うと、スマートフォンでは電話番号を入力しやすいキーボードが表示されることがあります。数字や記号を探す手間を減らせるのが利点です。

ただし、表示されるキーや使い勝手は端末によって異なります。パソコンで入力欄が出たことだけで確認を終えず、利用者が使うスマートフォンでも見てみましょう。

tel型は、送信前に電話番号として特定の形式へ自動で照合するものではありません。国や地域によって番号の形式が違うためです。入力しやすいことと、正しい連絡先であることは別になります。

必要ならpatternなどで受け付ける形を指定できますが、ハイフンや国番号を許すのかを先に決める必要があります。使える形式は、入力欄の近くに文章で示しておくと迷いにくくなります。

電話番号は計算のための数量ではなく、文字列として扱う情報です。桁数や区切りの扱いを、足し算をする数値欄と同じ感覚で決めないようにしましょう。

欄には何を入力するのかがわかるラベルを付けます。入力すると消える例示だけに説明を任せず、受け付ける形式を確認できる場所も残します。最後に、許可した形式が通り、対象外の形式にはわかる説明が出るかを確かめると、使う人の負担を減らせます。