web-dev-qa-db-ja.com

データテーブルでは、アクションは左または右にある必要があります

テーブルを操作するときは、行に固有のアクション(つまり、編集、削除など)を行内に配置します。アクションメニューを使用することもあれば、編集または削除のアイコンを使用することもあります。 enter image description here

私が参加したプロジェクトの中で、私はいつもこれらのアクションがテーブルの左端に配置されているのを見てきました。同僚との最近の議論では、グリッドの右端にアクションを配置することが提案されました。私はこれを見たことがないので、テーブルの右側に置くのは「おかしい」と感じました。

「アクション」ボタン/リンクをテーブルの左側または右側に配置する理由または正当化はありますか?

3
contactmatt

表形式のデータを表示する場合、多くの場合、最初の列はプライマリフィールドを示し、デフォルトの並べ替え順序を駆動します。これは、テーブルが左から右に読み取られ、左側に重要なデータ列が表示されるためです。

アクションボタンはデータではないため、一般的なUI規則では、を右側に配置します。 「webアプリケーションテーブルデザイン」のgoogle画像検索を実行できます。ほとんどの場合、アクションは右側にあります。

この規則の一般的な例外は、チェックボックスとツリー階層のドリルダウンのコントロールを配置する場合です。ほとんど常に左側にあります。

4
Jung Lee

状況によって異なります...

答えられる必要がある質問は次のとおりです:

ユーザーとして、見ている行が「編集」または「削除」したい行であるかどうかを判断する前に、行全体をスキャンする必要がありますか?

一般的な考え

エンドユーザーがスキャンする必要がある情報の量がかなり少なく、「アドレス」列だけを見ればその決定を下すことができる場合は、左側にアクションがあることが最も理にかなっています。エンドユーザーが最初の列を確認した後で決定した場合、行全体を追跡してその項目を操作するように強制したくない場合。

一方、エンドユーザーが行全体をスキャンして決定する必要がある場合、右側のアクションが最も理にかなっています。

重要

さらに物事を複雑にするために、アプリ/ウェブサイトはテーブル行アクションの周りに異なるデザインパターンを使用しないでください。行アクションは一貫した場所に配置して、エンドユーザーがページ間でパターンを再学習する必要がないようにする必要があります。

Salesforce CRMSalesforce Example

Magento eCommerce管理パネルMagento Example

4
Igorek

一番左に固執する。これにより、Webサイトまたはアプリが応答する場合、水平スクロールなしで常にアクションを使用できます。特にあなたのサンプル画像とあなたが表示しているコンテンツを考えると。

0
S August