ウェブサイトのハイパーリンクを開く方法に関する議論

ウェブサイトのハイパーリンクを開く方法に関する議論

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

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

3. リンク可用性設計ガイドライン
    意味があり、理解しやすく、認識しやすいリンク ラベルを使用します。リンク ラベルがリンク先のページのタイトルと一致していることを確認します。リンクではないテキストや画像をクリックするようにユーザーを誘導しないでください。重要なリンクを繰り返します。可能な限り、テキストをリンク ラベルとして使用します。ユーザーが使用したリンクと使用していないリンクを区別するために、異なる色を使用します。一貫したリンク ラベルを提供します。ユーザーがリンクを開けるように、「ポイント アンド クリック」方式を使用します。適切なリンク長を使用し、リンク ラベルは 1 行以内にします。内部リンクと外部リンクをユーザーに通知します。ページにリンクされている画像がある場合は、ページ上のすべての画像がクリック可能であることを確認します。

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

5. 一般的な国内ウェブサイトのリンクを開く方法
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
なし
※チャンネル切り替えの場合、すべてのウェブサイトは現在のページで開かれ、その他のリンク操作は主に新しいウィンドウで開かれます
2. 総合ポータル

現在のウィンドウ 0
新しいウィンドウ 1
チャンネルスイッチのホームページ/チャンネル内のリンク
シナ
0
1
捜狐
0
1
ヤフー中国
0
1
ネットイース
1
1
テンセント
1
1
中国ドットコム
1
1
3. 包括的な検索

現在のウィンドウ 0
新しいウィンドウ 1
チャンネルスイッチのホームページ/チャンネル内のリンク
グーグル
0
1
百度
0
1
ヤフー
0
1
ソゴウ
0
1
テンセントソソ
0
1
※チャンネル切り替えの場合は現在のページで開く方式、他ページでの操作の場合は新しいウィンドウで開く方式を採用しています。<br />そのため、チャンネル切り替えの場合は現在のページで開く方式、他ページでの操作の場合は新しいウィンドウで開く方式を推奨します。 Alipayのウェブサイトにも、無理なウィンドウの開き方がたくさんあります。上記の議論が、ウィンドウの開き方を設計する皆さんの助けになれば幸いです。

<<:  MySQL の Like の概念と使用法の説明

>>:  スーパーバイザーウォッチドッグの使い方を3分で学ぶ

推薦する

VUE でタブページを切り替える 4 つの方法

目次1. 静的実装方法: 2. 第2のシミュレーション動的方法3. 3番目の動的データ方式4. 動的...

JS を使用してバイナリ ツリー トラバーサル アルゴリズムのサンプル コードを実装する

目次序文1. バイナリツリー1.1. 二分木の走査1.2. jsを使用してバイナリツリーを表現する1...

ハイパーリンクの幅と高さを直接設定できない問題の解決策

幅と高さを直接使用することはできません。 display:block; または display:in...

XHTML の一般的な構造タグ

構造本文、見出し、HTML、タイトル文章abbr、頭字語、アドレス、引用ブロック、br、引用、コード...

テーブルを使用してフォームコントロールの形式を調整し、見栄えを良くします。

自分でウェブページを書きたいので、HTML 言語についても少し勉強しています。これは、大学時代にウェ...

ウェブページで Enter キーを押すと自動的にフォームを送信し、他のページにジャンプするソリューション

ウェブページでEnterキーを押すと、フォームは自動的に送信され、他のページに移動します。クエリフォ...

MySQL での mysqladmin 日常管理コマンドの概要 (必読)

mysqladmin ツールの使用形式は次のとおりです。 mysqladmin [オプション] コ...

IDEA は MySQL への接続時にエラーを報告します。サーバーが無効なタイムゾーンを返します。タブに移動して serverTimezone プロパティを設定してください。

これからの道は常に困難で、棘だらけです。歯を食いしばって、乗り越えられると信じてください。さあ、さあ...

JavaScript はクリックして画像の形状を変更する (変換アプリケーション) を実装します。

JavaScriptをクリックすると画像の形状が変わります(変形の応用)。参考までに具体的な内容は...

uniapp WeChatミニプログラムのグローバル共有を実装するためのサンプルコード

目次グローバル共有コンテンツファイルを作成するファイルをインポートしてグローバルに登録するページ共有...

MySQLはライブラリ内の主キーなしでテーブルインスタンスコードを素早く取得します

概要MySQL データベースで主キーのないテーブルを表示するための SQL ステートメントをいくつか...

スネークゲームのアイデアを実現するためのJavaScript

JavaScriptゲームSnakeの実装アイデア(完全なコード実装)を参考までに説明します。具体...

InnoDBのインデックスページ構造、挿入バッファ、適応ハッシュインデックスについての簡単な説明

InnoDB インデックスの物理構造すべての InnoDB インデックスは Btree インデックス...

ウェブデザインのためのロイヤルブルーのカラーマッチング入門

古典的な色の組み合わせは力と権威を伝え、強いロイヤルブルーはあらゆる古典的な色の組み合わせの中心的な...

Nofollowタグの書き方と使い方

「nofollow」タグは数年前に Google、Yahoo、Microsoft によって提案されま...