web-dev-qa-db-ja.com

検索バー内の検索アイコンはタブ可能にする必要がありますか?

検索バーを開発しています。入力フィールドとアイコンはデザインが統一されており、入力フィールドにフォーカスがあるときにEnterキーを押したときのデフォルトの動作はフォームの送信であるため、タブ付きアイコンは不必要に感じられます。 tab> enterを押すと、まったく同じ結果が得られます。ただし、アイコンはクリック可能なボタンであり、必要だと思います。タブとクリックの間には1対1の関係があるべきですか?何かがクリック可能である場合、それはタブ可能でなければならないという意味ですか?

The search bar in question

もう1つの課題は、検索アイコンの左側にある「X」で、入力をクリアする役割があります。デフォルトの入力フィールドとは動作が異なるため、タブ化できるようになっています。しかし、現時点では、フォーカスを合わせるときに後方にタブ移動しているように感じます。また、焦点を合わせた状態では少し変に見えます。

enter image description here

この状況について何か意見はありますか?ありがとう。

6
Audun Olsen

概観

このUI要素を作成して、ユーザーが検索入力基準を簡単にクリアできるようにしました。ほとんどの場合、フォームを操作するためにキーボードを使用するユーザーは、これが主要なアクションであるため、クリアボタンではなく検索ボタンを選択します。キーボードナビゲーションを使用する場合、最初の問題はインデックスの順序です。 clear search の前に置くべきですか?

タブ可能?

私の意見では、優れたデザインは包括的であり、一部のユーザーは支援技術を使用している可能性があります。 index からclearを削除すると、これらのユーザーからこの機能が削除されます。そうは言っても、はいクリアボタンをインデックス登録可能にする必要があります。

検索前に消去するか、消去前に検索しますか?

Enter を押してフォームで主要なアクションを完了することは一般的になっています。ほとんどの場合、ユーザーはタブの順序が一般的なデザインから変更されないことを期待します(上から下、左から右)。ユーザーは入力フィールドにタブで移動し、タブでクリアにアクセスし、最後にタブで検索にアクセスする必要があります。フォーカスがフォーム(入力フィールド)にある限り、いつでもEnterキーを押して検索を送信できます。

考慮すべきこと

  • 情報アーキテクチャ

「クリア」はフォームではなくこの入力フィールドに固有であるため(フォームに入力フィールドが1つしかない場合でも)、入力フィールド(非常に一般的なUIアーキテクチャの親->子)内にクリアボタンを配置することは理にかなっています。ただし、「検索」アイコンはフォームの主要なアクションです。これを入力フィールドの外に置く方が理にかなっています。これにより、すべてのフォームが同じ情報アーキテクチャに従います。

  • 行動を促すフレーズ

検索結果が表示された場合、「クリア」でも結果が削除されますか、それともフォームの入力だけが削除されますか? 「閉じる」、「削除」、「停止」アイコンは全体的なものであり、ユーザーに通知しようとしているアクションを正確に表すものではありません。このアイコンを削除することを検討し、テキストを使用してこれが何をするかをユーザーに伝えてください。おそらくツールチップを使用しますが、スクリーンリーダーのalt=""属性を使用することを忘れないでください。

同じ考慮事項が、検索の行動を促すフレーズにも当てはまります。現在、ラベルを使用して、入力フィールドではなく入力フィールドアクションを通知しています。ただし、ラベルではなくアクションとして「検索」を使用することでこれを実現できます。これにより、すべてのフォームが同じパターンに従い、あいまいさがなくなります。

検索はサイトの上部にあるため、ユーザーは上から下、左から右に読みます。この入力フィールドを見たとき、彼らはそれが何をしているかについてほとんどコンテキストを持っていないかもしれません。これは製品、連絡先情報、ブログ、検索エンジンを検索しますか?たとえば、「商品を検索」のように、行動を促すフレーズを明確で簡潔なものにしてください。スペースがあまりない場合は、プレースホルダーテキストを使用してこれをユーザーに伝えることができます。

ユーザーに考えさせないでください。 " 私に考えさせないでください "

6
Bromox

私が期待するユーザーとして、「タブ可能」と言ったときに動詞としてタブを適用していると思います。検索アイコンをタップまたはクリックしたとき、またはコントロールがフォーカスを失ったときに実行される検索です。

クリアボタンには入力を、物理タップには入力をクリアする必要があると思います。

タブリストにクリアボタンを含めた場合、それが非常に不愉快になり、人々がうっかりして検索語を削除してしまうことに私は驚かされます。

1
DarrylGodden

どちらの行動も正しいので、このような立場をとるべきだと思います。自問してみてください:これはあなたが奨励したい行動ですか?ユーザーにタブを押してからEnterキーを押しますか、それとも単にEnterキーを押しますか?私自身は単にEnterキーを押して、Tabキーを押しながらEnterキーを押すことを禁止しています。キーボードを使用する上級ユーザーはおそらくEnterキーを押しますが、マウスユーザーもおそらくそうしますが、万が一ユーザーが検索ボタンを持っていない場合に備えて。

1
VitskyDS

ユーザーが検索するときに検索アイコンをXに置き換えることをお勧めします。ユーザーがXボタンを押すと、入力の選択が解除され、Xが再び検索アイコンに置き換えられます。

1