web-dev-qa-db-ja.com

ページ上のすべてのリンクに下線を付けるか、すべて色を付ける必要がありますか?

私はウェブサイトを再設計していて、現在ホームページに取り組んでいます。ホームページからいくつかのリンクまたはエントリポイントがあります。すべてのリンクに下線を引くか、異なる色と太字のフォントのみを使用するなど、リンクのスタイルを設定するための1つの規則に従う必要があるかと思いました。

ホームページが両方のスタイルの組み合わせを使用している場合、混乱するでしょうか?たとえば、一部のリンクには下線が引かれていますが、一部のリンクは太字で色が異なります(赤や緑ではありません)。

5
Namrata Kannan

すべてのテキストリンクは識別規則に従うことが標準です。これはどのスタイリングの組み合わせの選択でもかまいませんが、一般的に言えば、それらはすべて同じようにする必要があります。

例外はナビゲーション要素です。 hugeテキストフッター領域を使用する一部のサイトは、準サイトマップリンクに対してこれらの規則に厳密に従う必要はありません。ほとんどはまだ要素を共有しています(暗い/明るいa:hover、ある種の下線など)。

これはかなり良い記事ですリンクのスタイリングに関するWeb標準について語るSmashing Magazineから。

基本的に、リンクをできるだけ読みやすくする必要があります。ユーザーはコンテンツのリンクをスキャンします-しないでください各Wordを調べてリンクであるかどうかを確認します。これが、すべてのリンクがたどる統一されたスタイルの規則を持つことが重要な理由です。ユーザーが「リンクがどのように見えるか」を識別すると、UIボタンなどの露骨な「リンク」を除いて、今後のすべてのインスタンスでこの説明に依存する可能性があります。

テキストリンクに複数のスタイルを共存させることにより、ユーザーaをどのリンクに混乱させる危険性がありますすべきサイトでの外観、そしておそらく混乱を招くリンクスタイリングシステムが原因で、彼らが望んでいたコンテンツを見逃す

これが、スタイルガイドを確立することが重要な理由でもあります。つまり、設計プロセス全体で一貫した感覚と論理を維持し、設計のまとまりを作り出します。

8
Arman

ほぼすべてのUXと同様に、学習能力が重要です。すべてのテキストリンクを1つの扱いに固執する必要はありませんが、明確なルールがあるはずです。

アーマンが指摘したように、すべてに下線が引かれていたり、何らかの方法で明るく強調表示されていたりすると、フッターナビゲーションのようなリンクの広い領域が混乱します。しかし、それがナビゲーションであることを示すためにそのセクションを分離することはisが重要です。また、見出しやその他のテキストと一貫して区別することも重要です。

リンクがテキストの流れに含まれている場合や、コンテンツの多いページのより広いコンテキストにある場合は、おそらく別のものが必要です。このコンテキストでリンクをスキャンできるようにする必要がある場合は、さらに差別化する必要があります。

デスクトップの変更できないルールと私が考える1つのことはホバーです。ユーザーがクリックしようとしていることが実際に何かを実行しようとしていることをホバー表示で確認する必要があります。

3
plainclothes

いくつかの考え:

  1. ホームページは、インタラクション言語を確立する機会であり、サイト全体で一貫している必要があります。

  2. デフォルトのブラウザリンクの色に固執する必要はありませんが、それらから離れるほど、ユーザーの成功率は低下します。このウェブサイトでは、選択された青は、相互作用を示すために本文との十分なコントラストが含まれています。これは一貫して使用され、青のテキスト=ハイパーリンクである他のほとんどのサイトから学んだユーザーを利用しています。

  3. 下線を削除すると、リンクのクリックスルー率が低下します(私がGoogleでの実験に基づいた声明)。ただし、下線を削除すると、ページ上のノイズが減り、単語の読みやすさが向上します。これは、Webテキストの下線が文字の形に干渉する可能性があるためです。

  4. ホバーの下線はヘルプに役立ち、このテキスト装飾を削除する場合はこれを使用することをお勧めしますが、それでも、テキストリンクを見るだけでなく、対話中にユーザーがフィードバックを得ることに依存します。コントラスト。

どのような選択をしても、インタラクション言語を確立してそれに固執するだけです。幸運を。

1
designninja