web-dev-qa-db-ja.com

リンクされたテキストを表示する最良の方法は何ですか?

私はいつも次の質問に興味がありました:

情報として、またリンク(たとえば、より詳細な情報へのリンク)として機能するテキストを提示するための、UXの最良の方法は何ですか。

私は常に次のオプションを検討しています:

  • 旧式の方法でテキストを青に着色し、その下に下線を引きます。例えば:

enter image description here

  • テキストを青色で表示するだけです(テキストをホバーすると下線が表示されます)。例えば:

enter image description here

  • 同様の方法は、テキストをデフォルトの色のままにしますが、テキストにカーソルを合わせると色が変わります。

  • リンクありとリンクなしのテキストの違いを使用しないでください。ただし、テキストにカーソルを合わせるときに、これがリンクテキストであることを説明するツールチップを使用してください。

  • テキストをリンクとして使用しないでください。テキストの近くの.insted使用アイコン。

これはコンテキストが展開され、テキストが表示されるオブジェクトであると言う人がいることは承知しています。具体的には、表内のリンクテキストに興味があります。テーブル内のリンクテキスト?

リンクテキストを表示する他の方法を知っていますか?

1
Gil Peretz

ユーザーはテキストをスキャンし、スキャンするときは、アイコン、下線、大文字などの「邪魔になるもの」があってはなりません。これらすべての言及により、テキストのスキャンが困難になり、スキャンするユーザーに認知的負荷が追加されます。覚えておくべき最も重要なことは、キーワードをリンクすると同時に 'here'をテキストリンクとして使用しないこと です。

これは多くの場合、このアドバイスを行わないでください。それで、あなたは何をすべきですか?下線、イタリック、ボールドスタイルを使用せずに、同じフォントサイズを使用します-後続のテキストがボールドまたはイタリックでない場合を除きます。変更する必要があるのは、訪問済みリンクと未訪問リンクのリンクの色だけです。他には何もありません。

2
Benny Skogberg

昔ながらの方法でテキストを青色に着色し、その下に下線を引きます。

「昔ながらの方法」はそれを説明する1つの方法です。

それを説明する他の方法:

  • 期待される方法
  • 典型的な方法
  • 明白な方法

要は、場合によっては、ホイールを再発明する必要がないこともあります。

リンクを作成するときに重要なことは、リンクがリンクされていないテキストと明確に区​​別できるようにすることです。色だけを使用する場合の問題、特に彩度の低い青は、色覚異常です(また、屋外のモバイルデバイスなど、画面が貧弱です)。

2
DA01