web-dev-qa-db-ja.com

ユーザーのテスト中にワイヤーフレームにリンクを表示する方法は?

私たちが作成したインタラクティブなワイヤーフレームのセットに対して、ユーザーに実行するいくつかのタスクを与えるユーザーテストを実施していました。ページ上のすべてのリンクは青でした(以下に表示)。

リンクはページ上の黒ではない唯一のテキストであり、画像がないため、ユーザーはすぐに青いリンクに惹かれました。このため、ユーザーテストを実行している人は、リンクを黒くすることを決定しました。

リンクを青色にすると、ユーザーはページ上の他のすべてを無視することになります。これは非現実的ですが、リンクを再度黒色にすると、どのテキストがリンクで何がそうでないかがわかりにくくなります。リンクも常に色があるため非現実的です。 。

リンクを表示する最良の方法は何ですか?

enter image description here

6
Rich

すべてのハイパーリンクを灰色にして下線を引いてみませんか?そうすれば、黒いコンテンツテキストに対して柔らかく見えます。下線は定義に役立ちます。スクリーンショットは非常にローファイなプロトタイプなので、ナビゲーションの容易さ、コンテンツと情報の配置、重要な情報へのアクセスなど、テスト対象にも依存すると思います。このようなプロトタイプはある程度実施する必要がありますユーザーは視覚的に利用可能なものに応じて動作を変更するため、解釈の柔軟性が向上します。

6
TheSaint

ワイヤーフレームでテストを実行する場合は、エクスペリエンスを実際のWebサイトエクスペリエンスにできる限り近づける必要があります(もちろん、ワイヤーフレームの忠実度が低いことを考慮しているため、グラフィックスを使用するつもりはありません)。

最終的なWebサイトでは、リンク、タブ、ボタンが表示されます(オンマウススタイルを含む適切なスタイル設定により)。これらを提供しないと、エクスペリエンスが悪用され、テスト結果が不十分になります。

だから、私のアドバイスは:

  • リンクを非表示にせず、適切なスタイル設定で公開する
  • 他のクリック可能な要素についても同じようにします。

このようにして、テスターがリンク、ボタン、タブに集中できるようにします(実際のユーザーは最終製品と同じです)。

2
Dominik Oslizlo
  1. リンクがより明白であることは必ずしも悪いことではありません-リンクすべき視覚的に区別され、明白です。私は色付きのリンクが付いた黒と白のワイヤーフレームを使用して、多数のユーザビリティテストを実施しましたが、問題はありませんでした。青は少しはっきりしているかもしれませんが、忠実度の低いワイヤーフレームをテストしている場合は、ビジュアルデザインをテストしていません。ナビゲーションパスやコンテンツの構成などを見ていると思います。リンクが青色になっているからといって、フィードバックが影響を受けることはほとんどありません。

  2. あなたが本当に反青である場合の別のオプションは、サイト上のすべての非リンクテキスト(16進数の色#666など)を灰色にし、リンクを黒にすることです。視覚的な違いが必要です。これは青を使用するよりも現実的ではないと思いますが、それでも青に対する抵抗に直面している場合は、少なくともすべてがグレースケールのままになります。

0
Michael Histen