ハイパーリンクを表示して開く方法

ハイパーリンクを表示して開く方法
<br />インターネット上の無数の情報は基本的に HTML ドキュメントで構成されており、それらがリンクされてインターネット全体が形成されています。これはちょうど人体の骨と肉のようなものです。経絡を通じてのみ、それらが直列に接続され、完全な人体が形成されるのです。
<a /> タグは最も基本的なタグのように思われるかもしれませんが、HTML ドキュメントでは重要かつ欠かせないタグです。この <a /> タグはページ間のリンクであり、ブリッジとして機能します。このブリッジはページ上でさまざまな方法で表示されます。Web サイトによってブリッジの装飾方法は異なりますが、最終的な目標は同じです。つまり、ユーザーにとってより直感的で使いやすいリンク プロンプトを提供することです。
<a /> タグは、HTML ドキュメント内のさまざまなプロンプト モードとさまざまなオープニング モードで設定できます。この記事では、これら 2 つの側面について簡単に分析するだけです。詳しい情報をお待ちしています。
リンクプロンプト:
1. テキストに色と下線が付けられます。これはブラウザのデフォルトのリンク プロンプト方式であり、クリックできるリンクがある場所とリンクがない場所をユーザーに明確に伝えることができます。 Sina.com や Sohu.com など、多くの Web サイトでは、このデフォルトのリンク プロンプト方式が使用されています。しかし、このタイプのリンク プロンプトは、ニュース リスト ページには不適切です。ニュース リスト ページのテキストは基本的にタイトルであり、すべてクリック可能なリンクがあります。ページ全体のすべてのテキストにクリック可能なリンクがあるため、この方法を使用してリンクを促すことはまったく不要と思われます。さらに、ページ全体に下線が引かれているため、視覚的に深刻な疲労を引き起こします。この方法は、リンクの少ないコンテンツ ページでリンク プロンプト タスクを完了するために使用できます。

2. テキストは色付きですが、下線は引かれていません。これは、多くの Web サイトのニュース リスト ページで使用されているリンク プロンプト方式です。この方法はニュース リスト ページに非常に適しており、ページ全体の煩わしい下線を削除します。多くのウェブサイトでは、リンク テキストとコンテンツ テキストの違いを強調するため、コンテンツ ページでもこの方法を使用しています。ただし、私の意見では、この方法はコンテンツ ページでは前の方法ほど効果的ではありません。
3. テキストに色も下線もありません。これは、ニュース リスト ページで使用される別のリンク プロンプト メソッドです。ページ全体のテキストがリンク可能なので、ページを美しくするために色付きのテキストを使用する以外に特別な意味はなく、テキストが色付きであるかどうかは無視できると思われます。 PCPOP のコンテンツ ページなど、コンテンツ ページでこのプロンプト メソッドを使用している Web サイトもいくつかあります。これには、リンク テキストの上にマウスを移動して、テキストの色を変更し、下線を追加することで、リンク可能であることを示すプロンプトを表示する必要があります。コンテンツ ページでこのプロンプト メソッドを使用する前提は、リンクはコンテンツ ページ自体のオプションのアクセサリにすぎないということです。
4. 下線は点線です: これは非常に特殊なプロンプト方法で、基本的にコンテンツ ページ内のポップアップ広告リンクで使用されます。
私の意見では、リンクを示す最良の方法は、ニュース一覧ページでは下線を付けず、コンテンツページではリンクテキストに下線を付けることだと思います。リンクテキストに色を付けるかどうかは、主にページのデザインによって決まります。
リンクを開く方法:
1. 現在のページにジャンプ: これは、ブラウザでリンクを開くデフォルトの方法でもあります。多数のタブやブラウザ ウィンドウをポップアップ表示することに比べると、現在のページにジャンプすることは間違いなく最も簡潔で快適であり、当然ながらブラウザを開くデフォルトの方法になっています。しかし、実際のアプリケーションではそうではありません。リンクがニュース一覧ページにある場合、現在のページにジャンプすることは大きな問題ではありません。しかし、リンクテキストがコンテンツページにある場合、現在のページにジャンプすることは不合理です。現在のページにジャンプするということは、ブラウザが現在のデータを破棄することを意味します。しかし、コンテンツページのリンクテキストは大きなコンテンツの中に混ざっています。これは、現在のテキストに関する関連情報を提供する論理的な接続です。ユーザーはリンクテキストを読むと、自然に関連情報をクリックして表示します。ユーザーがテキスト全体を読んだ後、リンクテキストをクリックしてジャンプすることは不可能です。
2. ポップアップ ページ ジャンプ: これは、リンクを開く最も安全で最も一般的な方法です。このオープニング方法は、コンテンツページ内のリンクテキストに使用され、ユーザーの現在の読書行動への影響を最小限に抑え、ユーザーによる情報のスムーズな取得を確保しながら、関連情報を最大限に提供することができます。
3. ポップアップ表示:この表示方法は、一般的に現在のリンクテキストの簡単な説明に使用され、もちろん広告表示にも使用されます。
リンクを開く方法はユーザーに一定の影響を与えますが、より大きな影響はリンクを開く方法の統一性から生じます。同じタイプのリンクを開く方法は、統一された現在のページへのジャンプまたはポップアップページへのジャンプを使用しますが、せいぜいユーザーがスムーズに使用できるかどうかに影響するだけです。ただし、同じタイプのリンクを開く方法が現在のページにジャンプしてからポップアップページにジャンプする場合、ユーザーにスムーズな操作感を与えることはなく、ユーザーに混乱を感じさせます。

<<:  停止したすべてのDockerコンテナを1つのコマンドで再起動する

>>:  実用的な情報が満載のJavaScript Webフォーム機能通信

推薦する

Docker コンテナは実行後に終了します (実行を継続する方法)

現象Dockerコンテナを起動する docker run –name [コンテナ名] [コンテナID...

MySQL アップグレードのベストプラクティス

MySQL 5.7 には、オンライン DDL、マルチソース レプリケーション、拡張された半同期、テー...

CentOS7 での PostgreSQL 11 の詳細なインストールと設定のチュートリアル

1. 公式ウェブサイトアドレス公式サイトではインストールの参考手順が紹介されています。公式サイトを見...

HTML 終了タグの問題と W3C 標準

W3C の原則によれば、XML の各開始タグには対応する終了タグが必要です。つまり、<html...

シンプルな商品スクリーニング機能を実現するjs

この記事の例では、商品スクリーニング機能を実装するためのjsの具体的なコードを参考までに共有していま...

nginx を使用して 1 つのドメイン名で複数の Laravel プロジェクトを構成する方法の例

背景会社のサブプロジェクトが増えるにつれて、さまざまなサイズのプロジェクトが10個以上になります(バ...

CSS3のwebkit-box-reflectを巧みに使用して、さまざまな動的効果を実現します。

かなり前の記事で、 -webkit-box-reflectプロパティについて説明しました。リフレクシ...

MySQL Server 8.0.13.0 インストールチュートリアル(画像とテキスト付き)

MySQL 6.1.3 をベースにした 8.0.13 をインストールします。 MySQL 8.0....

WeChat アプレット学習 WXS 使用方法チュートリアル

wxsとは何ですか? wxs (WeiXin Script) は、小規模プログラム用のスクリプト言語...

MySQL でのトランザクションの使用方法

基礎トランザクションは、SQL ステートメントのグループに対するアトミック操作です。つまり、グループ...

IE6 および IE7 で DIV コンテナの固定高さを使用するためのヒント

IE6 と IE7 では CSS の解釈に多くの違いがあります。今日はそのうちの 1 つである高さに...

Nginx ロケーション ディレクティブ URI マッチング ルールの詳細な概要

1. はじめにロケーション命令は、http モジュールのコア構成です。事前に定義された URL マッ...

Vue3 コンポジション API の紹介

目次概要例なぜそれが必要なのでしょうか?設定参照、反応的計算して見るライフサイクルVue3.0 は ...

jQueryはHTML要素の非表示と表示を実装します

商品を検索するときに、すべてのブランドまたは一部のブランドを表示するTaobaoの機能を真似してみま...

Linuxでプロセスが占有するポート番号を表示する

Linux システム管理者にとって、サービスがポートに正しくバインドされているか、またはポートをリッ...