category
サイト構築 -制作

リンクのデザインに役立つ8+アルファのTips

  • この記事をdel.cio.usに登録する
  • この記事をはてなブックマークに登録する
  • この記事をGoogleブックマークに登録する
  • この記事をYahoo!ブックマークに登録する
  • この記事をdiggに登録する
  • この記事をlivedoor clipに登録する
  • この記事を@nifty クリップに登録する

Design vs Art Blogのエントリー「8 Tips For Better Link Design」から、リンクのデザインに役立つ8つのTipsを紹介します。

8 Tips For Better Link Design

  1. リンクのテキストには、「ここをクリック」のようにあいまいな言葉ではなく、「サンフランシスコのホテルについての情報」などのように、クリック先が何か具体的に分かるような言葉を使用する。
  2. リンクの前には、そのリンクの内容をユーザーが理解できるようなテキスト情報を与える。
  3. リンクが画像の場合、その画像で伝えたい情報をテキストでも提供する。
    altに記述するだけでなく、画像のそばにテキストで配置するともっと良い。
  4. サイトの重要なリンク(ナビゲーションや機能など)には、accesskeyを設定してキーボードでの操作を有効にするとユーザーへの手助けになります。
  5. Tabキーを押した時に、論理的な順番でフォーカスが移動するようにする。
  6. リンクに使用する文言は、一般的な文言を使用する。
    例) ショッピングバスケットではなく、ショッピングカートを使用。
  7. 同じ文言を使用して、異なるページにリンクをしないようにする。
    例) 「サポート」は、必ず同じサポートのページへリンク。
  8. 複数のリンクの文言に、似た意味のものを使用しない。
    例) 「About Us」と「Company Info.」は、どちらか一つにする。

下記は、コメントから抜粋です。

  • 外部サイトへのリンクは、明示する。
  • メールやPDFファイルなどページ以外へのリンクは明示する。
  • リンクはリンクしているようなデザインにする。
    例) テキストリンクには、下線を用いる。

以前紹介した「リンクの設置時に気をつけたい15のポイント」にも、リンクに関するTipsがあります。

Post on:2008年3月6日

  • この記事をdel.cio.usに登録する
  • この記事をはてなブックマークに登録する
  • この記事をGoogleブックマークに登録する
  • この記事をYahoo!ブックマークに登録する
  • この記事をdiggに登録する
  • この記事をlivedoor clipに登録する
  • この記事を@nifty クリップに登録する

トラックバック

トラックバック(URL)

コメント

comment:

※承認制のため、即時には反映されません。

匿名
on 2008年3月11日

5番目は、Tabキーを押した時に論理的な順番でフォーカスが移動するようにする、ということだと思います。

コリス
on 2008年3月11日

ありがとうございます。

5番目を和文にしました。

ページの先頭へ




© coliss

RSS