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

テクノロジーカテゴリーの変更を依頼記事元:

174 usersがブックマークコメント

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

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

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

2021/10/14 リンク

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

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

上流で防ぐの原則

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

UI
考え方

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

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

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

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

renu これ、ラストパスなどでオートフィルされても送信ボタンが無効化のままになっててわざわざinputに一度フォーカスしないとならないことが多くて困る

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

2021/10/26 リンク

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

未分類

2021/10/17 リンク

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

2021/10/15 リンク

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

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

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

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

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

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

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

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

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

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

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

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

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

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

はてなブックマーク

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

記事へのコメント49件

関連記事