ツールチップ

解説

ツールチップは、ボタンや項目名などの近くに小さく浮かび上がり、その要素の意味や使い方を補うポップアップです。W3CのWAI-ARIAのガイドでは、要素にキーボードのフォーカスが移ったときや、マウスのポインターが重なったときに表示されるものと定義されています。また、Microsoftのドキュメントでは「ツールヒント」と呼ばれ、タッチ操作では長押しで表示されると説明されています。

ツールチップを使うと、画面を常に文字で埋めることなく、必要な人にだけ説明を示せます。

実務での使われ方

ツールチップは、小さな疑問をその場で解消し、問い合わせを減らすために使います。設定項目の意味が分からないという問い合わせは、一つひとつは小さな疑問です。「この欄に何を入れればよいか」をその場で示せれば、顧客がFAQを探したり問い合わせたりする手間を減らせます。問い合わせの多い設定項目を抽出し、そこから順に説明を添えていくのが効率的です。

ツールチップの文面は、次の点を押さえて書きます。

• 1～2文に収める。説明が長くなる場合は、ツールチップではなく、画面上に置いたFAQへのリンクで案内する
• 項目名を言い換えるだけの説明にしない（「公開設定：公開の設定です」は情報量がゼロ）
• 入力例や、選んだときに何が起きるかを書く
• タッチ操作ではホバーが使えないため、タップや長押しでも表示できるようにする
• キーボードで操作する人のために、フォーカスが移ったときにも表示されるようにする

注意点

作業に欠かせない情報は、ツールチップに入れません。NN/gは、利用者がツールチップを探さなくても作業を完了できるようにし、重要な指示や入力条件は常にページ上に表示すべきだとしています。さらに、Microsoftも、エラーや警告、状態の情報をツールヒントで表示しないよう求めています。