サブミット (送信) ボタンをデフォルトで無効化しない | Accessible & Usable

公開日 : 2021年10月14日 (2023年10月11日 更新) カテゴリー : ユーザビリティ / アクセシビリティ ウェブのフォームにおいて、サブミットボタンをデフォルトで無効化しておいて、ユーザーの入力不備がなくなったときにボタンを有効化する UI があります。たとえば、利用規約などの文書を読んで同意する旨のチェックを入れないと、あるいは、入力必須フィールドにすべて正しく情報を入れないと、ボタンがアクティブにならない、というものです。 サブミットボタンがデフォルトで無効化されているフォームの例。 このような UI は、アクセシビリティやユーザビリティの観点で、以下の問題があります。 そこに存在しているはずのサブミットボタンが使用できないことに対して、その理由をユーザーが理解できずに、混乱してしまう恐れがある。(ユーザーの側に誤っているという自覚がなくても、ちょっとした見落としや入

[aceraceae]

わかる。ちゃんと入力したはずなのになぜか送信できないのってイラッとくる。送信押してから適切に怒られるほうがわかりやすい。

[masatomo-m]

視覚障碍者向けのアクセシビリティ考慮が必要なことは同意できるが、エラーになるのが分かっている状態でボタンを押す選択肢を用意してエラー返すのはそれはそれで体験として悪いのでは？実装都合の押し付けに思える

[kako-jun]

同意できないわ。クリックしてエラーメッセージを見せられるストレスは、意思の否定なので、なぜボタンが無効なのかを考えるストレスより大きい。Tabキーでフォーカスが当たるように、擬似的に無効化すればいい

[hennamanao]

うーん、個人的にはリアルタイムにエラー出る方が好きだな。ボタン押した時に出てくると「なんでもっと早く教えてくれないの」とイラつく。慣れてるせいなのかな。障害者への配慮は必要だけど。

[ghostbass]

ちゃんと実装できるならリアルタイムバリデーションの方がましじゃないか、と思う

[anonruru]

フォームに1文字目を入力した時点で「正しくない内容です」みたいなエラー出すのも禁止にしてほしい。Safariは早くrequestSubmitに対応してください。

[imash]

ボタン押してチェックNGだっときに、どこが駄目だったのか分かりづらいページが多すぎる。エラーの提示の仕方もセットで足並み揃えて欲しい。

[mayumayu_nimolove]

あれは使わない方がいいよ。一般の人は、入力不備があるとは思ってなくて単純に押せない何コレ不具合？って思われるから。アラート最強。

[kvx]

アクセシビリティの勉強続けると一般的に正しい方法と言われているもでも、実はあまり正しくないというものに気付ける。disabled処理はエラー箇所を自分で探さないといけないから最悪な方法だよ。

[tattyu]

個人的には受け付け無い時にメッセージ出るタイプはイラつくので嫌いだわ。フォームの内容が一部消えたり最悪全部消えたりするのがストレス。

[AmaiSaeta]

"多くのフォームでは、なにもデフォルトではサブミットボタンを無効化しなくても済むのでは？という観点で検討してみてもよいと思います。"

[ku_marin]

結構難しい問題。ブコメでも意見バラバラだ

[elf]

納得感しかない

[strawberryhunter]

「フォームを開いた当初から入力不備が解消されるまで、エラーが提示される形になり」作り方が悪いだけ。でも私の結論はボタンは押せる方が良い派。リアルタイム検証しつつボタン押下で全部検証すればいいよね。

[barlog]

3rdパーティやブラウザーのパスワードマネージャーが検出しづらいという懸念もありますね。

[bleu-bleut]

フールプループ（誤操作の未然防止）よりもフェイルセーフのほうがストレスがない？

[Insite]

「それってあなたの感想ですよね」案件だが、対案を列挙しつつ論点をあげつつ評価している。是非についてはつくる人が考えればいいんじゃないの？反発する必要はない。

[infobloga]

これ結構難しい問題。「サブミットボタン押すまで」エラーメッセージを出したくないっていう要望があるのが問題。最初からエラーメッセージ出して良いなら、この問題は発生しない。

[oktnzm]

押せるほうが絶対いいよ。ユーザーのアクションによって理由を教えられるのに使わない手はない。

[Dai44]

入力フォームの周りにエラー表記するならサブミットボタンにまだ送信できる状態じゃないよ的に書いとくのじゃあかんのか 何度も送信ボタンを押させる感じにも見える

[nilab]

サブミット (送信) ボタンをデフォルトで無効化しない | Accessible & Usable

[eroyama]

最初の、リアルでなく、オンラインでもない元々の脱出ゲームみたいで面白いと思う　/　ローグにも必要要素を集めないと進めないところがあったから、これもローグライク

[tamanecoplus]

本来のHTMLの思想からすればごもっともなんだけど、今や非同期通信は当たり前だし、特にreCAPTCHA導入するとデフォルトdisabledの方が色々都合がいい訳で

[rawwell]

アクセシビリティという点で同意。アメリカのオンライン契約書のサインを求めるドキュメントは全てサインしたら自動的にサブミットボタンが有効になり、フォーカスが当たるのでとても気持ち良かった

[since20200516]

この結論のUXを「ユーザーがストレスなく利用でき」と結ぶのが反発を招く原因だと思った。どちらのUXであってもストレスはあり得るが、それを無視しているように見える

[develtaro]

世の中にはエラーメッセージで怒られてる、萎縮するって人多いらしいからあまりそうしたくない

[primedesignworks]

ネットサーフィンしてて、送信フォームを見つけるたびに何も入力せずに送信ボタンを押す人です。まぁまぁな確率で「ありがとうございました」って出る。disabled は少なくとも連打防止に必要。

[Shinwiki]

フールプルーフとか大層なもんじゃなくて、ゴミみてえな書きかけメールとかがバシバシ来るのが嫌なだけなんで。

[sd-craft]

エラーメッセージでストレスなんて感じるのか。不適切なエラーだからじゃないのか

[kijtra]

デフォルトで無効化してるのあんまり見たことないなあ

[AKIMOTO]

validなデータが揃わないと送信ボタンがそもそも登場しない、みたいなUIだとどうなんだろう

[oakbow]

Web開発者だけど確かに「なんでボタン押せないんだろ」ってなることあるわ。一般人だと余計に混乱するかも。ボタン押させてバリデーションエラー出すのはフロントエンドでも出来るし、押させるのもありか

[spark7]

こういう仕掛けしてるフォームは大抵ほかの部分でもロクでもないUXを提供してる。ブラウザ標準のバリデーションの方がマシな場合もある。

[dollarss]

非常に重要な観点。しかしその前にそもそもTABINDEXが貼られていないフォームが放置になっていてキーボードだけで操作できない画面が異常に多いんだよいまどき。。

[sgo2]

入力内容の(簡易)チェックボタンを(送信ボタンとは別に)用意するのが最も使い勝手が良くなる気が。無駄に遷移、押して何が起きるのか不明、一挙一動に一々反応はいずれも鬱陶しい。

[minase_mira]

disableだとスクリーンリーダー使ってたりすると不都合あるのか。 aria-labelで解決できるらしいけど、確かに実装の手間考えたらアラート出す方が楽だしわかりやすそう

[napsucks]

リアルタイムバリデーションは便利だがだいたい見落としたまま最後まで行ってsubmitが押せねーなんでだーって遡って小さな赤い文字に気づくことが多いな。フィールドの色を赤くするのはわかりやすいけど晴眼者限定かな