ホームページ > ウェブフロントエンド > htmlチュートリアル > Web サイトのハイパーリンクを開く方法についてのディスカッション_HTML/Xhtml_Web ページの制作

Web サイトのハイパーリンクを開く方法についてのディスカッション_HTML/Xhtml_Web ページの制作

WBOY
リリース: 2016-05-16 16:43:24
オリジナル
1385 人が閲覧しました

新しいウィンドウが開きます。 利点: ユーザーがリンクをクリックしても、現在閲覧しているコンテンツは置き換えられません。また、閲覧したコンテンツを表示するために前後に移動する必要はありません。 欠点: 短時間のアクセスの後、多数のウィンドウが生成され、リソースが占有されます。各ウィンドウを手動で閉じる必要があります。
1.リンクの開き方
    新しいウィンドウで開きます
    利点: ユーザーがリンクをクリックしても、現在閲覧しているコンテンツは置き換えられず、閲覧したコンテンツを表示するために前後に移動する必要はありません。
    欠点: 短時間アクセスすると、多数の Windows がリソースを占有します。各ウィンドウは手動で閉じる必要があります。 現在のウィンドウが開いています
    利点: 多くのウィンドウを開いてリソースを占有しすぎずに、いつでも 1 つのウィンドウでコンテンツを表示できます。ウィンドウが 1 つしかなく、閉じるのが簡単です。
    欠点: ユーザーが複数のページの内容を確認する必要がある場合、またはそれらを比較する必要がある場合、非常に面倒です。または、Shift キーを押しながらリンクをクリックする必要がありますが、この操作を知っていて使用している人はほとんどいません。 新しいウィンドウと現在のウィンドウを選択的に使用します
    利点: 上記 2 つの方法によって引き起こされる不便さを、より人道的な方法で解決できます。ウィンドウの数は大幅に増加せず、ユーザーは複数のウィンドウでの読み取りを切り替えることもできます。
    欠点: 特定のリンクをクリックするときのユーザーのニーズは、デザイナーのアイデアとまったく同じではない可能性があります。ユーザーは、リンクが新しいウィンドウで開かれるか現在のウィンドウで開かれるかを判断できないため、ユーザーにある程度の心理的「プレッシャー」が生じます。

2. リンクを開く方法の選択方法
    同じ種類の情報については、同じリンクを開く方法を使用してください。 中国人はリンクが新しいウィンドウで開くことをより受け入れています。 次の状況では、新しいウィンドウを使用して開きます:
    チャネル コンテンツ リンク、ナビゲーション リンク、記事内の詳細な読み物へのリンク、記事内の関連コンテンツ リンク、ユーザーが同じ種類の製品を比較する必要がある場合。 現在のウィンドウを開くために次の状況が使用されます:
    記事のページング タグ、リストのページ送りタグ、記事の前/次の記事へのリンク、直線的なタスク (ユーザー登録、公開情報、など)、リンクがユーザーのリニアに属する場合、読み取り/操作に必要な場合。

3. リンクのユーザビリティ設計ガイドライン
    意味があり、理解しやすく、簡単に識別できるリンク ラベルを使用します。 リンク タグがリンク先のページのタイトルと一致していることを確認してください。 リンクではないテキストや画像をクリックするようにユーザーを誤解させないでください。 重要なリンクを繰り返します。 テキストをリンク ラベルとして使用してみてください。 ユーザーが未使用/使用済みのリンクを区別するには、異なる色を使用します。 一貫したリンクラベルを提供します。 ユーザーがリンクを開けられるようにするには、「ポイント アンド クリック」を使用します。 適切なリンク長を使用してください。リンクのテキスト ラベルは 1 行を超えてはなりません。 どのリンクが内部リンクでどのリンクが外部リンクであるかをユーザーに伝えます。 ページ上に画像へのリンクがある場合は、ページ上のすべての画像がクリック可能であることを確認してください。

4.新しい視点
    ユーザーがリンクを開く方法を選択できるようにします。たとえば、デザイナーは、リンクを開く方法をユーザーが決定できる小さなチェックボックスをユーザーに提供します。 一部の Web サイトでは、リンクの性質を説明およびガイドするためにアイコンを使用しています。たとえば、Wikipedia の外部リンクは、サイト内のリンクと区別するために小さな矢印を使用しています。

5. 一般的な国内 Web サイトのリンクを開く方法
1. オンラインショッピング

現在のウィンドウ 0
新しいウィンドウ 1
チャンネル切り替え
リスト
詳細
カテゴリから
から探す
内部
製品写真
企業/店舗に入る
アリババ
0
1
1
1
1
1
HC
0
1
1
1
1
1
中国製ネットワーク
0
0
0
0
0
0
グローバルソース
0
0
0
0
0
なし
拍手
0
1
0
1
1
0
タオバオ
0
1
1
1
1
1
素晴らしいアマゾン
0
0
0
0
0
なし
* チャンネルを切り替える場合、すべての Web サイトは現在のページで開く方法を使用し、その他のリンク操作は主に新しいウィンドウで開く方法を使用します
2. 総合ポータル

現在のウィンドウ 0
新しいウィンドウ 1
チャンネル切り替え
ホームページ/チャンネル内のリンク
シーナ
0
1
ソフ
0
1
Yahoo China
0
1
NetEase
1
1
テンセント
1
1
チャイナドットコム
1
1
3. 総合検索カテゴリ

現在のウィンドウ 0
新しいウィンドウ 1
チャンネル切り替え
ホームページ/チャンネル内のリンク
Google
0
1
百度
0
1
ヤフー
0
1
ソウゴウ
0
1
テンセントまあまあ
0
1
※チャンネルを切り替える場合は全て現在のページで開く方法、他のリンクを操作する場合は新しいウィンドウで開く方法となります
したがって、チャンネルを切り替える場合は現在のページで開く方法を使用し、他のページを操作する場合は新しいウィンドウで開く方法を使用することをお勧めします。 Alipay の Web サイトには、不合理な窓口開設方法も多数掲載されています。上記の議論が窓口開設方法を設計する際に、皆様のお役に立てば幸いです。
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート