フォームの基本

フォームのスマホ対応|1画面に詰め込まない作り方と決め方

2026年9月1日 ・ Halict編集部

「フォーム スマホ 対応」で検索する人がいま困っているのは、たいてい見た目の話ではありません。スマートフォンで開いたときに画面から文字がはみ出す、といった分かりやすい崩れは、いまの道具ではほとんど起きなくなりました。それでも検索するのは、開いてはもらえているのに送信まで届かない、届いた内容が途中で切れている、電話番号の欄に数字以外が混ざっている、といった詰まりが受付側に残っているからです。

この記事では、スマートフォンで答えやすいフォームをどう決めるかを、受け取って返す側の立場から整理します。先に結論を書くと、軸は1つです。1画面に詰め込まないこと。指で押せる大きさを確保することも、入力の種類に合ったキーボードを出すことも、縦に長い選択肢を分けることも、すべてこの1つの考え方から出てきます。スマートフォンの画面は、机の上のパソコンの画面と比べて情報を置ける面積が圧倒的に狭く、しかも片手で、移動中に、通知に割り込まれながら操作されます。そこに机の上と同じ密度で並べると、答える側の手が止まります。

読み進めながら、いま運用しているフォームを実際にスマートフォンで開いてみてください。作った本人がパソコンでしか確認していないフォームは珍しくなく、開いた瞬間に直すべき場所がいくつも見つかります。

スマホで答えづらいフォームは、受付側の仕事を増やしている

フォームのスマホ対応は、答える側への配慮の話として語られがちです。しかし受付を回している立場から見ると、これは自分の仕事量を決める問題でもあります。答えづらいフォームから届くものには、決まった傾向があるからです。

まず、途中でやめられた分は、そもそも届きません。届かないので、受付側の画面には何の記録も残りません。件数が少ないという結果だけが見えて、原因は見えない状態になります。採用の応募でも、助成金や公募の申請でも、受け取れなかった人の存在は数字に出てこないので、対応する必要がないように見えてしまいます。

次に、届いたものの中身が荒くなります。小さな入力欄に長い文章を書くのは苦痛なので、相談内容が一行で終わります。「詳しくは折り返しお願いします」とだけ書かれた問い合わせが増えれば、そのぶん電話やメールの往復が増えます。フォームで一度に聞けていれば済んだやりとりが、答えづらさのせいで受付側に戻ってきます。

さらに、入力の誤りが増えます。半角で入れてほしい電話番号に全角が混ざる、メールアドレスの一文字が抜けている、郵便番号にハイフンが入ったり入らなかったりする。パソコンなら気づく打ち間違いも、狭い画面では見落とされます。届いたあとに直すのは受付側なので、その手間はそのまま人件費です。特にメールアドレスの誤りは深刻で、返信が届かず、しばらくしてから「連絡が来ない」と別経路で問い合わせが来ることになります。

最後に、同じ人から何度も届きます。送信できたのか分からなくてもう一度送る、通知で画面が切り替わってやり直す。こうして生まれた重複は、受付側では別々の1件として並びます。担当が分かれていれば、同じ人に二重に返信することも起こります。よく聞くのは、重複の判定に時間を取られて、本来の返信が後回しになるという困り方です。

つまり、スマホで答えやすくする作業は、親切のためだけにやるものではありません。届く件数、届く内容の質、直す手間、重複の量。この4つがまとめて動きます。だから、見た目が崩れていないことをもって「スマホ対応済み」と判断するのは早すぎます。判断の基準は、狭い画面で最後まで答え切れるかどうかに置いてください。

1画面に詰め込まない、という考え方が中心にある

スマートフォンの画面に一度に映る範囲は、パソコンの画面と比べてかなり狭くなります。縦にスクロールできるので置ける情報量は無限に見えますが、答える人が同時に把握できる範囲は、映っている範囲に限られます。ここが設計の出発点です。

縦に長い1枚は、読めるけれど終わらない

設問を上から順に全部並べた1枚のページは、作るのが最も簡単です。パソコンで見れば全体が視界に入り、残りがどれくらいかも分かります。ところがスマートフォンで同じものを開くと、見えるのは常に数問だけで、全体の長さはスクロールバーの細さでしか分かりません。

この状態で起きるのは、「まだ終わらない」という感覚の蓄積です。答える側は、何問残っているか分からないまま指を動かし続けます。途中で自由記述が現れたり、添付を求められたりすると、そこで「あとどれだけあるのか」という不安が一気に膨らみます。設問の内容が難しいわけではなく、終わりが見えないことが理由で手が止まります。

分けたほうがよい目安として、1画面あたり5問から7問程度に収めるという考え方があります。厳密な根拠のある数字ではありませんが、スマートフォンで一度に映る範囲と、人が「ここまで」と区切って意識できる量を考えると、この程度が扱いやすくなります。全体で15問あるなら、3つに分けるという判断になります。

分ける単位は、設問の数ではなく話題の切れ目

ページを分けるとき、機械的に5問ずつ区切ると、かえって答えにくくなります。住所の途中で次のページに移るような分け方をすると、答える側は同じ話題を2つの画面にまたいで扱うことになり、頭の中で流れが切れます。

分ける単位は、話題の切れ目に置いてください。連絡先を聞く画面、内容を聞く画面、書類を出してもらう画面、確認する画面。この並びなら、それぞれの画面に入った瞬間に「いま何を聞かれているのか」が分かります。画面の先頭に短い見出しを付けておくと、さらに迷いが減ります。

もう1つ大事なのが、順番です。答えやすいものを先に置きます。名前、メールアドレス、どの件についての連絡かを選ぶ選択肢。この3つが埋まっていれば、途中で離れた人にもこちらから連絡を取れる可能性が残ります。逆に、志望動機や相談内容の長文、添付ファイル、住所といった重いものを先頭に置くと、離れた人の情報が何も残りません。受付側にとって、この差は大きく効きます。

あと何問あるのかを見せる

分けたページには、進み具合を示すものを置いてください。「3つのうち1つめ」といった表示でも、点が3つ並ぶだけの表示でも構いません。終わりが見えるかどうかで、途中で離れる人の数は変わります。

進み具合の表示には、もう1つの効果があります。答える側が、いまの画面に集中できるようになることです。全体が見えていないと、人は「この先に何が待っているのか」を気にしながら答えます。残りが3画面だと分かっていれば、目の前の設問だけを見て答えられます。1画面に詰め込まないという考え方は、面積を空けるためだけのものではなく、答える側の意識の範囲を狭く保つためのものでもあります。

なお、ページを分けると入力済みの内容が消える仕組みでは、この方法は使えません。戻るボタンを押した瞬間に全部消えるフォームは、分けないほうがまだましです。分ける前に、前の画面に戻っても内容が残るかどうかを必ず確かめてください。

指で押せる大きさを確保する

スマートフォンの操作はマウスの矢印ではなく指の腹で行われます。矢印は1点を指しますが、指は面で触れます。この違いを踏まえずに作られたフォームは、押しているつもりの場所と、実際に反応する場所がずれます。

押す場所の大きさは、指の面積で決まる

主要なスマートフォン向けの設計指針では、指で押す部分の大きさを、おおむね44ピクセル四方から48ピクセル四方以上にすることが推奨されています。これはボタンだけの話ではありません。チェックボックス、ラジオボタン、日付の選択、削除の印、そしてリンクも同じです。

見落とされやすいのが、チェックボックスとラジオボタンです。ブラウザが標準で表示する四角や丸は小さく、そのままでは指で正確に押せません。ここで効くのが、ラベルの文字を含めて押せるようにしておくことです。四角そのものではなく「同意する」という文字を押しても反応するようにしておけば、押せる面積は一気に広がります。ラベルと入力欄が正しく結び付けられているかどうかは、スマートフォンでの押しやすさに直結します。

もう1つは、必須の印や説明を開くための小さな印です。「?」のような小さなものを置いても、指では押せません。説明が必要なら、開かせるのではなく最初から短い文で書いておくほうが確実です。狭い画面では、隠して開かせる仕組み全般が機能しにくくなります。

隣との間隔が足りないと、押し間違いが起きる

大きさと同じくらい重要なのが、押せる場所どうしの間隔です。選択肢が縦に詰まっていると、隣を押してしまいます。間隔の目安として、押せる部分の間に8ピクセル程度の余白を確保しておくと、押し間違いが目に見えて減ります。

押し間違いが特に起きやすいのが、送信ボタンとその近くにある取り消しや戻るのボタンです。この2つを横に並べると、片手で操作している人は高い確率で間違えます。送信ボタンは大きく、単独で、他の操作から離して置いてください。取り消しの操作は、そもそも同じ画面に置かない選択肢もあります。

画面の下端に固定して送信ボタンを置く作りもよく見かけますが、この場合は端末側の操作領域と重ならないかを確認してください。機種によっては、画面の一番下に別の操作が割り当てられています。固定するなら、余白を十分に取ります。

文字の大きさと、ラベルの置き方

入力欄の文字が小さいと、一部のスマートフォンでは、その欄を押した瞬間に画面が自動的に拡大されます。拡大されると横位置がずれ、答える側は指で戻す操作を強いられます。これを避けるため、入力欄の文字サイズは16ピクセル以上を確保しておくのが基本です。小さくして詰め込みたくなる場面ほど、この基準を守ってください。

ラベルの置き方にも注意が要ります。入力欄の左側にラベルを置く形は、パソコンの画面では自然ですが、狭い画面では入力欄の幅を圧迫します。スマートフォンでは、ラベルを入力欄の上に置いて、入力欄を横幅いっぱいに使うほうが扱いやすくなります。

そして、入力欄の中に薄い文字でラベルを表示する作りは避けてください。文字を打ち始めた瞬間にラベルが消えるため、何を聞かれていたのか分からなくなります。特に複数の欄が並ぶ画面では、途中で顔を上げて戻ったときに、どの欄が何なのか判別できなくなります。薄い文字は、ラベルではなく入力例を示すためだけに使ってください。

入力の種類に合ったキーボードを出す

スマートフォンには複数のキーボードがあります。文字を打つもの、数字だけのもの、メールアドレスを打ちやすくしたもの、電話番号用のもの。どれが出るかは、入力欄の側で指定できます。ここを指定していないフォームは、答える側に余計な操作をさせています。

メール、電話、数字で出るキーボードは違う

メールアドレスの欄には、メールアドレス用の指定をしておきます。すると、記号や「.com」といった入力が一手で済むキーボードが出ます。電話番号の欄には電話番号用の指定をしておきます。すると数字が大きく並んだキーボードが出て、片手でも正確に押せます。郵便番号や金額のように数字だけを入れる欄には、数字用の指定を入れます。

この指定を怠ると、答える側は毎回キーボードを切り替える操作を挟むことになります。1つの欄では小さな手間でも、欄が5つ並べば5回です。そして切り替えを面倒に感じた人は、文字用のキーボードのまま全角で数字を打ちます。ここで、届いた電話番号に全角が混ざるという現象が起きます。答える側の不注意ではなく、フォームの側が指定していないことが原因です。

もう1つ、キーボードとは別に、入力できる文字を制限する仕組みもあります。数字だけを受け付ける、といった指定です。ただしこれを強くかけすぎると、貼り付けた内容が弾かれたり、海外の電話番号が入らなかったりします。制限で弾くよりも、届いたあとに整える方針のほうが、取りこぼしは少なくなります。

自動入力に任せられるところは任せる

名前、メールアドレス、電話番号、住所、郵便番号。これらは、端末やブラウザに保存された情報から自動で埋められます。埋められるようにするには、それぞれの欄が何を意味するのかを指定しておく必要があります。指定していない欄には、自動入力の候補が出ません。

自動入力が効くかどうかは、答える側の手間に直結します。特に住所は、郵便番号から都道府県と市区町村までが自動で埋まるだけで、入力の量が半分以下になります。狭い画面で最も面倒なのが住所なので、ここが軽くなる効果は大きくなります。

ここで一度、実際に自分のスマートフォンでフォームを開き、名前の欄を押してみてください。上に自分の名前が候補として出るなら指定は効いています。何も出ないなら、指定が抜けています。作った側が気づきにくく、答える側だけが手間を負っている典型的な場所です。

全角と半角のゆれは、受け取る側で吸収する

どれだけ指定しても、全角と半角のゆれ、ハイフンの有無、姓と名の間の空白といったばらつきは必ず届きます。これを答える側の責任にして、エラーで弾く作りにすると、送信の直前で離脱が起きます。「電話番号は半角で入力してください」という赤い文字が出た瞬間に、画面を閉じる人がいます。

現実的なのは、受け取る側で整える方針です。全角の数字を半角に直す、ハイフンを取り除く、前後の空白を落とす。これらは機械的にできる処理なので、答える側に負担をかける理由がありません。弾くのは、明らかに形式として成立していないもの、たとえば「@」を含まないメールアドレスだけに絞ってください。

ここは道具の選び方にも関わります。届いた内容をそのまま表計算に流すだけの作りだと、整える処理をどこにも挟めません。届いたあとに受付側の画面で内容を編集できるかどうかは、地味ですが日々の手間を左右します。無料で広く使われているものとの違いはGoogleフォームとの比較に、サイトに埋め込む形の仕組みとの違いはContact Form 7との比較に整理しています。仕様は変わるので、判断するときは各サービスの公式資料でその時点の内容を確かめてください。

縦に長い選択肢の扱い方

スマートフォンで最も扱いに困るのが、選択肢の多い設問です。都道府県、市区町村、部署、講座名、機種名、資格の種類。パソコンの画面では折りたたんだ一覧で済んでいたものが、狭い画面では途端に扱いづらくなります。

プルダウン、ラジオボタン、検索付きの使い分け

選択肢が少ないとき、たとえば3つから5つ程度なら、ラジオボタンで縦に並べるのが最も答えやすくなります。全部が同時に見えるので、比べて選べます。押せる面積も広く取れます。折りたたんでプルダウンにすると、開く操作が1回増えるだけで、得られるものがありません。

選択肢が増えて20を超えたあたりから、プルダウンのほうが扱いやすくなります。ただしスマートフォンのプルダウンは、機種によって表示のされ方が違います。画面の下から一覧がせり上がってくるもの、画面の中央に重なって出るものがあり、いずれも一度に見える選択肢は多くありません。長い一覧を指で回して探す操作は、思っている以上に時間がかかります。

選択肢が数十を超えるなら、打ち込んで絞り込める形にするのが現実的です。「東」と打てば候補が絞られる作りなら、一覧の長さは問題になりません。この形が用意できない道具を使っている場合は、設問の分け方を変えて対処します。

選択肢が増えたら、階層に分けるか聞き方を変える

一覧を短くする方法は2つあります。1つは階層に分けることです。都道府県を選んでから市区町村を選ぶ、大分類を選んでから小分類を選ぶ。操作は1回増えますが、それぞれの一覧が短くなるので、全体としては速くなります。

もう1つは、選ばせるのをやめることです。市区町村を選ばせる代わりに郵便番号を打ってもらう、講座名を選ばせる代わりに希望日を選んでもらう。受付側が知りたい情報が最終的に得られるなら、聞き方を変えて構いません。選択肢が長くなっているときは、そもそもその聞き方が答える側の頭の順番と合っていない可能性を疑ってください。

複数選べる設問も、狭い画面では注意が必要です。四角を並べて「当てはまるものをすべて選んでください」とする形は、選択肢が多いと縦に長く伸びます。全部が見えないまま選ぶことになるので、選び漏れが起きます。数を絞るか、話題ごとに設問を分けるかを検討してください。

「その他」と自由記入の置き方

「その他」を選んだときに自由記入の欄が出てくる作りは便利ですが、スマートフォンでは注意が要ります。欄が現れた位置が画面の外だと、答える側は何も起きていないように見えます。書かないまま次へ進み、送信の直前でエラーが出て戻される、という流れになります。

現れる欄は、選んだ場所のすぐ下に置いてください。そして、現れたときに画面がそこまで動くようにしておくと、見落としが減ります。細かい話に見えますが、狭い画面では「見えていない」ことが即座に「無いこと」になります。

そもそも「その他」が多く選ばれている設問は、選択肢の設計が実態と合っていません。届いた自由記入の内容を定期的に見て、よく出てくるものを選択肢に足してください。選択肢に入れば、答える側の入力が減り、受付側の集計も揃います。

途中で中断されることを前提に作る

スマートフォンでの入力は、机の前で腰を据えて行われるものではありません。この前提を設計に織り込んでいるかどうかで、最後まで届く割合が変わります。

中断は例外ではなく、通常の使い方

入力の途中で電話がかかってくる、通知が出る、電車が着く、子どもに呼ばれる。これらはすべて、スマートフォンで何かを入力しているときの通常の出来事です。中断されたあと、答える側が戻ってきたときに何が残っているか。ここが最初の分かれ目になります。

別の画面に切り替えて戻ってきたとき、入力内容が消えているフォームがあります。この場合、答える側は最初からやり直すか、あきらめるかを選びます。多くの人はあきらめます。もう一度同じことを打つ気力が残っていないからです。特に、長文を書いている途中で消えたときの失望は大きく、その窓口に二度と書かない理由になります。

対策は、入力した内容を端末側に一時的に保存しておくことです。仕組みとして用意されている道具もあります。用意されていない場合でも、ページを分けて1画面あたりの入力量を減らしておけば、消えたときの損失は小さくなります。ここでも、1画面に詰め込まないという方針が効いてきます。

一度に全部聞くのをやめる

中断を前提にすると、設計の考え方が変わります。1回のフォームで必要な情報をすべて集めようとするのをやめ、2段階に分ける方法が現実的な選択肢になります。

最初のフォームでは、名前、連絡先、どの件かの3つだけを聞きます。ここまでなら、電車の中でも1分かからずに送れます。届いたら受付側から返信し、その返信の中で詳しい内容や書類をお願いします。落ち着いた場所で、パソコンから答えてもらえる可能性が高くなります。

この方法の利点は、途中で離れた人が存在しなくなることです。最初の3つが埋まった時点で送信されているので、受付側には必ず連絡先が残ります。あとはこちらから追いかけられます。採用の応募や、書類の多い申請では、この分け方が効きます。

欠点もあります。やりとりが1往復増えるので、受付側の手間は増えます。だからこの方法は、届いたあとの管理ができている場合にだけ成立します。誰に返信したか、まだ書類が届いていないのは誰か。これが表計算の手作業だと、2段階にした瞬間に追いきれなくなります。送信されたあとの状態が同じ画面に残る仕組みがあるなら、2段階にする判断は取りやすくなります。

送れたかどうかを、回答者の手元に残す

送信ボタンを押したあと、何が起きたのかが分からないフォームは、重複を生みます。狭い画面では、送信後の画面が一瞬で流れてしまうこともあります。押した直後に画面が切り替わって通知が来れば、送れたのかどうか本人にも分かりません。

対策は2つです。1つは、送信後の画面をはっきり分かる形にすること。「送信しました」の一行ではなく、受け付けた内容の要点と、いつごろ返信があるかを書いておきます。もう1つは、自動返信のメールを送ることです。手元にメールが残っていれば、送れたかどうかを本人が確認できます。

自動返信には、もう1つの役割があります。返信が届かないときに、メールアドレスの誤りに本人が気づくきっかけになることです。受け取った側が誤りに気づいても連絡する手段がないので、ここは答える側に気づいてもらうしかありません。

そして、送信ボタンは押したあとに反応が要ります。押せなくなる、文字が変わる、といった変化が無いと、反応が遅い回線では何度も押されます。二重送信は、答える側の落ち度ではなく、作りの問題です。

スマートフォンから届く添付ファイル

スマートフォンから書類を出してもらう場合、届くものの形は、パソコンから出してもらう場合とかなり違います。ここを想定していないと、受付側で開けない、読めない、という事態が起きます。

まず、写真として届きます。紙の書類をその場で撮って送るのが最も手軽だからです。撮られた写真は、傾いていたり、影が入っていたり、端が切れていたりします。読み取れる程度に撮ってもらうため、フォームの説明に「文字が読める明るさで、四隅が入るように」と一行書いておくだけでも、届くものの質が変わります。

次に、容量が大きくなります。最近の端末で撮った写真は、1枚あたり3MBから5MB程度になることが珍しくありません。複数枚を求める受付では、合計の上限に引っかかります。上限を超えたときにエラーだけが出て理由が分からないと、答える側はそこで止まります。上限がいくつなのかを、添付の欄のそばに書いておいてください。

そして、ファイル名がばらばらです。数字の羅列や、撮影日時だけの名前で届きます。受付側で誰の書類か分からなくなるので、届いたものを回答と一緒に管理できるかどうかが重要になります。ファイルだけが別の場所にたまる仕組みだと、突き合わせの作業が毎回発生します。

アカウント登録を求める形の添付にも注意が要ります。ファイルを置く先が特定のサービスで、そこへの登録や許可が必要になると、そこで手が止まります。回答者にアカウント登録を求めない形で受け取れるかどうかは、応募や申請の受付では特に効きます。社内の環境をそのまま使う場合の考え方はMicrosoft Formsとの比較に整理してあります。

確認画面とエラー表示を、狭い画面で考える

確認画面を挟むかどうかは、受け付けているものによって決めます。問い合わせのように短いものは、確認画面を挟むと手数が増えるだけです。応募や申請のように、内容が選考や審査に影響するものでは、確認画面がある方が安心して送れます。

確認画面を置く場合、狭い画面では表示の仕方に注意が要ります。入力した内容をすべて縦に並べると、確認画面自体が長くなり、下までスクロールしないと送信ボタンにたどり着けません。そして、間違いを見つけたときに戻る手段が無いと、そこで詰まります。項目ごとに直せるようにしておくか、少なくとも前の画面に戻っても内容が消えないようにしてください。

エラー表示は、送信の直前にまとめて出す形をやめてください。画面の上のほうにまとめて赤い文字が並ぶ作りだと、狭い画面では該当の欄がどこなのか分かりません。エラーは、その欄のすぐそばに、その場で出します。入力し終わって次の欄に移った時点で「この形式では受け付けられません」と出れば、答える側はその場で直せます。

エラーの文言も、狭い画面ほど短く具体的にします。「入力内容に誤りがあります」では何をすればよいのか分かりません。「メールアドレスに@が含まれていません」まで書けば、直せます。必須の項目についても、なぜ必要なのかを一行添えておくと、入力への抵抗が下がります。

誰でも答えられる状態にしておくことは、配慮であり義務でもある

押しやすさや文字の大きさは、好みの問題ではありません。手元が不自由な人、細かい文字が見えにくい人、読み上げを使っている人にとっては、答えられるかどうかを直接左右します。そして、受付の窓口を開いている以上、この点には法律上の位置づけもあります。

事業者は、その事業を行うに当たり、障害者から現に社会的障壁の除去を必要としている旨の意思の表明があった場合において、その実施に伴う負担が過重でないときは、障害者の権利利益を侵害することとならないよう、当該障害者の性別、年齢及び障害の状態に応じて、社会的障壁の除去の実施について必要かつ合理的な配慮をしなければならない。 出典: e-Gov

障害者差別解消法における合理的配慮の提供は、2026年時点で民間の事業者にも義務として求められています。フォームを開けない、答えられないという申し出があったときに、別の受付手段を用意することも含まれます。電話や窓口、紙での受付を残しておくのは、そのための備えでもあります。

具体的な作りとしては、押せる部分の大きさと間隔を確保すること、文字と背景の明暗の差を十分に取ること、ラベルと入力欄を正しく結び付けること、色だけで必須や誤りを示さないこと。この4つを押さえるだけで、答えられる人の幅は広がります。いずれもスマートフォンで答えやすくする作業と重なるので、別々に取り組む必要はありません。

なお、フォームで集めた個人情報の扱いについては、利用目的を示すことなどが求められます。具体的な運用がこれで足りるかどうかは事案によるので、判断に迷う場合は所管の窓口や専門家に確かめてください。

受け付けているものによって、直す優先順位は変わる

同じ「スマホ対応」でも、何を受け付けているかによって、先に直すべき場所は変わります。手を付ける順番を決めるために、受付の種類ごとに整理しておきます。

採用の応募受付では、書類の添付と長文が同時に発生します。狭い画面で最も重い組み合わせなので、2段階に分ける効果が最も大きい領域です。最初に連絡先だけを受け取り、返信してから書類を受け取る形にすれば、応募の入り口が軽くなります。採用の応募受付に、受け取ったあとの選考の進み具合をどう記録するかをまとめています。

助成金や公募の受付では、締切の直前に集中します。集中する時間帯にスマートフォンから送られることが多くなるので、途中で消えない作りと、送れたことが分かる仕組みが特に重要になります。締切をまたいだ扱いをどうするかも、事前に決めておく必要があります。助成金・公募の受付を参照してください。

問い合わせの受付は、最も軽くできる領域です。名前、連絡先、用件の3つで返信は始められます。狭い画面で答えることを考えれば、この3つ以外を必須にする理由はほとんどありません。問い合わせの受付に、担当の割り振りと返信の記録の考え方を整理しています。

イベントや講座の申し込みでは、定員と締切が絡みます。移動中に思い立って申し込む人が多いので、入力の軽さがそのまま申込数に効きます。同伴者の人数のように選択肢で済むものは、自由記述にせず選ばせてください。イベントの申し込み講座の受講申し込みに、それぞれで必要になる項目を整理しています。

施設の利用申請では、日時の指定が入ります。日付の選択は狭い画面で押しにくい部分の代表なので、押せる大きさの確保が直接効きます。第2希望まで聞いておくと、重なったときのやりとりが1往復減ります。施設利用の申請にまとめてあります。

会員の入会や、修理とサポートの受付では、すでに登録がある人かどうかの見分けが必要になります。会員番号を必須にすると、外出先で番号が分からない人が離れます。番号は任意にして、名前と連絡先で照合できるようにしておくのが現実的です。会員の入会申し込み修理・サポートの受付に、それぞれで起きやすい詰まりをまとめています。

受付の画面から見た、スマホ対応の直し順の考察

届いたものを受け取って返す側の画面から、フォームの作りと詰まりの関係を眺めていくと、見た目を比べるだけでは気づきにくい傾向がいくつも見えてきます。ここでは3つ挙げます。

1つ目は、スマートフォンでの答えにくさが、受付側では「誤入力」と「重複」という別の形で現れるという点です。途中でやめた人は記録に残らないので、直すきっかけが得られません。代わりに手がかりになるのが、届いた内容の側です。電話番号に全角が混ざっている、メールアドレスが誤っていて返信が戻ってくる、同じ人から短い間隔で2件届いている。この3つが目立つなら、狭い画面での答えにくさを疑ってください。届いた記録は、フォームの作りを映しています。

2つ目は、直す順番に効き目の差があるという点です。効果が大きい順に並べると、まず入力の種類に合ったキーボードの指定と自動入力の指定。これは作業量が小さく、答える側の手間がすぐ減ります。次に、押せる大きさと間隔の確保。ここは誤操作の減少として現れます。その次に、ページを分けることと進み具合の表示。ここは作り直しの手間が大きいぶん、効果も大きくなります。最後が、2段階に分ける判断です。運用の変更を伴うので、届いたあとの管理ができてから着手してください。順番を逆にして、最初から2段階の設計に手を付けると、日々の受付が回らなくなります。

3つ目は、フォームを軽くする判断が、届いたあとの道具に依存しているという点です。設問を減らせない理由をたどると、たいてい「あとで聞き直す手間が読めない」というところに行き着きます。誰に何を返したかが記録に残り、追加でお願いした項目が届いていない相手がひと目で分かる。こうした送信されたあとの道具がそろっている状態になっていれば、最初に全部聞いておく必要は減ります。逆に、届いたあとが手作業のままだと、受け取る側の不安が設問の数として答える側に転嫁され、狭い画面がさらに重くなります。フォームの重さと受付の運用は、こうしてつながっています。受け取ったあとに何ができるのかはできることに整理してあります。

判断の材料として、実際の画面の動きを先に見ておくのも有効です。届いたものがどう並び、どこに状態を記録するのかが分かると、答える側に何を聞くべきかの線引きも変わります。動くところを見るで一通り確認できます。費用の目安は料金に、始める前の疑問はよくある質問にまとめています。

最後に、手を動かす前にやることを1つだけ挙げておきます。いま運用しているフォームを、自分のスマートフォンで、最初から最後まで実際に答えて送信してみてください。片手で、歩きながら、通知が来る状態で。作った側が一度もそれをしていないフォームは珍しくなく、そして詰まる場所は、たいてい最初の1周で見つかります。1画面に詰め込まないという方針は、その1周で感じた重さを分解していく作業の、出発点になります。

Q1. スマホで表示が崩れていなければ、スマホ対応はできていると考えてよいですか?

崩れていないことと、答え切れることは別です。判断の基準は、片手で最後まで答えて送信できるかどうかに置いてください。押せる部分の大きさ、入力の種類に合ったキーボードが出るか、途中で中断しても内容が残るか。この3つは表示の崩れとは無関係に詰まりを生みます。実際に自分のスマートフォンで1周答えてみるのが最も早い確認方法です。

Q2. フォームは何画面に分けるのが適切ですか?

設問の数で機械的に割るのではなく、話題の切れ目で分けてください。連絡先、内容、書類、確認といった単位です。1画面あたり5問から7問程度に収まると扱いやすくなります。ただし、前の画面に戻ると入力が消える仕組みの場合は、分けないほうが安全です。分ける前に、戻っても内容が残るかを必ず確かめてください。

Q3. 電話番号に全角が混ざって届きます。どう直せばよいですか?

入力欄に電話番号用の指定をして、数字のキーボードが出るようにするのが先です。それでもゆれは届くので、エラーで弾くのではなく、受け取る側で半角に整える方針にしてください。送信の直前にエラーで戻される作りは、そこで離脱を生みます。形式として成立していないものだけを弾き、あとは整えるのが実務的です。

Q4. 添付ファイルをスマホから受け取るとき、何に気をつければよいですか?

写真として届く前提で考えてください。1枚あたり3MBから5MB程度になることが多いので、合計の上限を添付欄のそばに明記します。ファイル名は数字の羅列で届くため、回答と一緒に管理できる仕組みかどうかが重要です。書類が多い受付では、最初に連絡先だけを受け取り、返信してから書類を受け取る2段階も選択肢になります。

ガイド一覧へ

フォームのスマホ対応|1画面に詰め込まない作り方と決め方|Halict