ユーザーインターフェイスにデータテーブルがあるWebアプリケーションを開発しています。 Datatableには、基本的なCRUD操作のように実行するいくつかの一般的なアクションがあります。
質問は、ボタンを編集、削除、作成する方法と場所をユーザビリティの観点からどのように配置するかです。
以下は example で、テーブルには各行に編集と削除があります。各行のボタンが重複しているように感じますが、代わりに1行を選択して、次のように上部のどこかで編集/削除ボタンをクリックできます 例
しかし、後者の方が理解しやすいか、またはナイーブなユーザーにとって使いやすいかはわかりません。どんな考えでも役に立ちます。
最初の例でのホバー時の明るい色は、使いやすく、速くてシンプルだと思います。 2番目のものは本当に混乱する可能性があり、各行をクリックする必要はありません(最初は、各行がクリック可能であることに気づきませんでした)。
簡単な解決策を提案します。ホバー状態で編集/削除ボタン(またはアイコン)を表示するだけです。この場合、最後の列を削除したため、テーブルは同じサイズ(またはそれ以下)のままです。そのスペースでは、アイコンは各行のホバーにのみ表示されます。
作成ボタンはおそらく左上にあり、最初の例の単なるテキストボタンよりも、2番目の例のようなもの(よりわかりやすいボタン)の方が優れています。また、「Show -number- entries」フィルターは「Create new record」に近すぎます。この例のように、作成ボタンがより見やすく、要素が近すぎると混乱し、その重要性が正しく認識されない可能性があります。