モーダルダイアログはWebにとって良い習慣ですか? [閉まっている]

StackOverflow https://stackoverflow.com/questions/206113

  •  03-07-2019
  •  | 
  •  

質問

モーダルウィンドウ/ダイアログは、Webサイトの良いプラクティスと見なされていますか?モーダルウィンドウの使用に関して私が心配していることの1つは、ポップアップウィンドウに非常によく似ていて、ユーザーのフラストレーションを引き起こしたり、邪魔になるためにユーザーが単純に閉じたりすることです。ユーザーの好みと使用率について話している研究を知っていますか?

JavaScriptがオフになっているときにモーダルウィンドウリンクが新しいページにコンテンツをロードする以外に、アクセシビリティの問題はありますか?モーダルウィンドウを使用するサイトやWebアプリは好きですか?なぜですか?モーダルウィンドウを実装するための良い方法と悪い方法は何ですか?モーダルはおそらく写真やギャラリーを表示するときに最も頻繁に使用されることを知っていますが、他の実用的な使用例は何ですか?あなたはあなたのサイトでそれらを使用しますか、そして何があなたの決定につながりますか?

役に立ちましたか?

解決

実践の観点から-アクセシビリティを除く-モーダルウィンドウは、たとえばダイアログボックスとして驚くほど少なく、ポップアップウィンドウよりも邪魔にならない代替手段を提供します。それらは通常、前述の2つの方法のいずれよりも、サイトに対してよりまとまりがあります。写真やメディアは別として、モーダルダイアログを使用して、ダイアログボックスと同じ目的を果たしました。ユーザーに何らかの形式の必要な入力を提供したり、サイトとやり取りする前に何かを確認したりするためです。

純粋にアクセス可能な観点からは、それほど素晴らしいものではありません。通常はJavaScriptを必要とし、DOMに関してモーダルが管理される方法のため、スクリーンリーダーはJavaScriptを適切に解釈しません。これに対処するために、優雅に劣化させることは常に良い考えです。1つの提案は、モーダルダイアログのコンテンツを取得してページに配置することです。モーダルダイアログが表示される 場合は常に、現在のページを「モーダルページ」にリダイレクトし、ユーザーの入力を取得して、元のページに戻ります。

最後に、私の個人的な意見に関する限り、モーダルウィンドウは気にしません。正しく使用すると、まともな体験が得られると思います-何かが私の注意を引くためにがある場合、ページからリダイレクトせずにそれを行い、operatingいオペレーティングシステムをテーマにしたダイアログ、またはポップアップ(とにかくブラウザがブロックする可能性があります)。要約すると、中断する方法をどのように選択する必要がある場合は、モーダルダイアログを選択します。

他のヒント

多くの場合、モーダルウィンドウとレイヤードパネルを混同しているようです。ダイアログボックスはモーダルウィンドウにすることができ、ポップアップはモーダルウィンドウです。レイヤードパネルはウィンドウではありませんが、ポップアップまたはダイアログボックスの外観を持っています。基礎となるレイヤーが利用できないという意味でモーダルです。モーダルウィンドウは、ポップアップブロッカーの影響を受けないため、Webサイトで人気があります。

モーダルウィンドウは、基盤となるアプリケーションが続行するために必要な情報またはユーザーアクションを取得するために設計されました。非モーダルウィンドウを使用すると、ユーザーはウィンドウと基になるアプリケーションを切り替えることができます。非モーダルウィンドウの適切な使用法は、ユーザーが参照ツールと基になるアプリケーションへのアクセスを必要とする画面ヘルプまたはチュートリアルです。

IMHO、モーダルウィンドウは狭い特定の目的のために設計されており、現在では多くの場合不適切に使用されています。何かできるからといって、やるべきだというわけではありません!:-)

ウェブアプリでモーダルウィンドウを使用するのは、「背景を忘れる」ためにユーザーが完全に集中する必要があるシンプルな質問やアクション、つまりモーダルの目的だけです。アプリケーションが求めていることに集中します...

例:

"許可された最大ローンが限度に達しました。この新しいローンをクライアントに送信してもよろしいですか?"

たとえば、電子メールを送信するためのプレテキストの選択(件名と本文のテキストを右にしたり、クライアントに送信する定義済みの件名/本文を選択するために使用できるモーダルウィンドウ...

そのようなもの:)

ユーザーがすべての財務データを入力するWebサイトから、数回クリックするだけで完了したPDFで契約を送信するWebサイトで動作する多くの財務Webアプリを実行します。これらはモーダルウィンドウを使用するアクションです。

お役に立てばと思います

37Signalsには、モーダルに関する興味深い投稿があります。ここ。彼らは、モーダルオーバーレイを使用して新しいページに移動する必要があるほど重要ではない、画面サイズを通じて重要性を示すためにモーダルを使用することについて話します。

私は、データ入力画面にWebアプリでモーダルウィンドウをよく使用します。たとえば、ユーザーにはリストまたは検索結果画面があり、レコードをクリックしてモーダルウィンドウで開いて編集できます。 Webサイトでは、サイトの雰囲気のように「アプリケーション」をやや少なくしたいので、モーダルウィンドウはあまり使用しません。

実装が不十分な場合のWebセンターでのダイアログの問題のほとんど。考慮事項は次のとおりです。

  • 画面サイズ
  • ブラウザウィンドウのサイズ変更
  • ダイアログを開く場所
  • フォーム要素の送信
  • 粗いオーバーレイストロボライト効果
  • グレースフルデグラデーション(前述)

これらのすべては、いくつかの先見の明とプログラミング技術で簡単に克服でき、適切に実装するとWeb上のダイアログが非常に便利になります。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top