web-dev-qa-db-ja.com

ポップアップウィンドウに代わるユーザーエクスペリエンスのベストプラクティスは何ですか？

私はまだウェブデザイン/開発に未熟です。社内システムのデータ入力フォームに取り組んでいます。フォームでは、ユーザーはデータベースから照会されたリストからオフィスを選択できます。 （これのバックエンドはPHPとMySQL、好奇心が強い場合です。）

ユーザーが最小限の侵襲でオフィスをリストに追加できるようにする機能を追加したいと思います。会社のブラウザのデフォルトの動作はポップアップをブロックすることなので、ポップアップウィンドウを使用したくありません。新しいウィンドウの代わりにアラートの代替を作成する方法を示す this を見てきました。私にとっては基本的に同じことのように思えますが、ブラウザが新しいフォームにキボッシュを配置しないようにすることを除いて、実際には改善されていません。

私は、ポップアップ/アラート機能を完全に画像から除外し、ボタンまたはダブルクリックによってトリガーされる新しい非表示の<div>を選択することも良いと思います。そして、大丈夫かキャンセルによって閉じました。

先ほど言ったように、私はまだWebデザイン/開発に不慣れです。可能な限り最高のユーザーエクスペリエンスでこのタスクを達成するために、現在受け入れられているベストプラクティスは何なのかと思っています。

更新：実際の質問は、「このタスクを可能な限り最高のユーザーエクスペリエンスで達成するための現在のベストプラクティスはありますか？」です。その答えは、「いいえ、多くのオプションがあり、普及しているものはありません」です。私が探しているのは、それか、「はい、この場合のユーザーエクスペリエンスの現在受け入れられているベストプラクティスはXです。」

javascriptuser-interfaceuser-experience
5
user25791

「JavaScriptでこれを行う方法」の決まりきった答えは常にjQueryです。 .dialogの呼び出しに非常に満足しています。

<div id="popup"><!-- all your markup for the dialog goes here --></div>

$("#popup").dialog ({
    autoOpen: false,
    buttons: {
        "Ok" : function() { alert("ok was clicked"); }
        "Cancel" : function() { alert("cancel was clicked"); $(this).dialog("close"); }
    },
    modal: true
});

http://jqueryui.com/demos/dialog/#modal

5
Bryan Boettcher

ここにはmanyの可能性があります：次のような例があります。*ポップアップのような外観の機能のために、fancyboxを使用*ユーザーが「追加」をクリックすると、新しいフォームをロードし、現在のページに挿入してスクロールできます。それに。 *など

私が個人的にやろうとしていることは、現在のサイトを見てみることです。同様の機能はすでに存在していますか？使えますか？新しいソリューションは現在のGUIに適合しますか？

最も使いやすいソリューションでさえ、サイトの他の部分と合わないと見栄えが悪くなります。ユーザーは現在のGUIに精通しているため、新しいものを追加すると、新しいことを学ぶように強いられます（これには多くの時間がかかり、それに関する多くの「バグレポート」が表示されます）。

1
Łukasz Gruner

フォームでは、ユーザーはデータベースから照会されたリストからオフィスを選択できます

コンボボックスを使用するだけです。

0
Morons