「タップして検索」のトリガーを管理する

「タップして検索」は、2015 年 6 月にほとんどの Android スマートフォン向けの Chrome 43 でリリースされました。ユーザーが Chrome でページのテキストをタップすると、関連する周囲のテキストとともに単語が選択されます。検索キーワードは画面下部のバーに表示されます。ユーザーはこのバーをオーバーレイ パネルに開いて、検索結果全体を表示できます。

「タップして検索」のアニメーション

選択可能で、非インタラクティブまたはフォーカス不可能な書式なしテキストの場合は、タップトリガーが有効になります。ページにテキストのタップに応答するクリック ハンドラがある場合、「タップして検索」は自動的にその応答を検出し、デベロッパーがイベントを処理するつもりであったことがわかっているため無視します。長押しのジェスチャーでテキストを手動で選択すると、「タップして検索」バーもトリガーされます。この機能は、Chrome の [プライバシー設定] で有効または無効にできます。

サイトの作成者は、特定の要素に対するタップ操作によって検索をトリガーしたくない場合がよくあります。Chrome で意図したとおりに 動作させるためには

  1. フォーカス可能: 要素に tabindex=-1 プロパティを追加します。
  2. インタラクティブ: 次のような標準的な方法のいずれかを使用して、要素がインタラクティブであることを示します。
    • 要素に投資iロールまたはウィジェット属性が割り当てられていることを示すには、ユーザー補助マークアップを使用します。 たとえば、role=button を含む要素はトリガーされません。ユーザー補助機能のマークアップを追加すると、視覚障がいのあるユーザーでもページを読みやすくなるという利点があります。
    • preventDefault() の呼び出し、または DOM または CSS の操作を行う JavaScript クリック ハンドラでは、「タップして検索」がトリガーされません。
  3. 選択不可: -webkit-user-select: none を使用。選択不可能なテキストは、長押し操作を使用しても「タップして検索」をトリガーしません。

「タップして検索」がトリガーされるタイミングや場所がトリガーされない場合、または断続的にトリガーされる場合、フォーカス可能またはインタラクティブではない要素がフォーカス可能またはインタラクティブとしてマークされている可能性があります。「タップして検索」がトリガーされない原因を特定するには、次の手順を実施します。

  1. 長押しのジェスチャーでテキストが選択可能かどうかを確認します。テキストは選択されるのに、「タップして検索」バーが表示されない場合は、スマートフォンの Chrome の [プライバシー] の「タップして検索」設定で、この機能が無効になっていないことを確認してください。また、一部のローエンド デバイスはタップによる検索をサポートしていません。
  2. テキストを選択すると「タップして検索」バーが表示され、タップしても表示されない場合、タップをトリガーする問題があります。トリガーが断続的に発生する場合は、要素の JavaScript ハンドラによってアニメーションが条件付きでアクティブになっていることが原因の可能性があります。
  3. トリガーが発生しない場合は、上記のトリガー理由を参照します(要素がフォーカス可能か、インタラクティブかを確認します)。

それでもページが想定どおりに動作しない場合は、crbug.com でバグを報告し、ラベル Cr-UI-Browser-Mobile-TouchToSearch を追加してください。