HTML の rel 属性の分析

HTML の rel 属性の分析

クラスメートがWeiboにこの記事を再投稿して収集していることに気づいたので、この何気なく翻訳された記事をもう一度見直しました。その後、w3cschools.com.cnにすでに対応する中国語翻訳があることがわかったので、ここでこの記事を改善し続け、より価値のあるものにしたいと思います。この文書を翻訳するアイデアは、最初に記事 http://vanessa.b3log.org/research-a-rel-value から生まれました。rel 属性には珍しい意味値がたくさんあることがわかりました。元の記事では、これらの属性値の使用シナリオをリストすることに重点を置いていました。rel 属性をこのように理解することは非常に必要だと感じました。

rel 属性を持つリンク:

<a rel="external" href="http://www.xxoo.com/">ooxx</a>

ブラウザのサポート

rel 属性はすべての主要なブラウザでサポートされています。

注:瀏覽器渲染時會忽略此屬性,然而搜索引擎可以從它獲得更多的信息(a標簽僅在href屬性存在時有效)。

定義と使用

rel 属性は、現在のドキュメントとリンクされたドキュメント間の関係を指定します。

文法

<a rel="value">

HTML 4.01 と HTML 5 の違い

削除された値: 付録、章、目次、著作権、用語集、索引、セクション、開始、サブセクション。

新しい値: archives、author、bookmark、external、first、索引、最後、ライセンス、nofollow、noreferrer、検索、サイドバー、タグ、上。

プロパティ値
価値説明するシナリオ | 例HTML4.01 HTML5
付録文書の付録ページへのリンク
代替代替ソースへのリンク(例:印刷ページ、翻訳、ミラー)ウェブサイトのAtomとフィードをheadタグで設定する
ショートカットアイコンショートカットアイコンタイトルバー、アドレスバー、お気に入りバーに小さいアイコンを指定します
アーカイブドキュメントセットまたは履歴データへのリンク<link rel='archives' href='http://www.ooxx.com/2012/07' />
著者文書の著者へのリンクヘッドタグで文書の著者を宣言する
正統な権威、モデル

現在のウェブサイト上の重複または類似のウェブページのうち、どのページがウェブマスターがクロールして含めたいページであるかを検索エンジンに知らせます。

<link rel="canonical" href="http://xxoo.com/" />
  • canonical 属性値は通常、 rel 属性に表示されます。
  • 参考URL: http://www.xxoo.com/xhtml/rel_canonical/
  • 機能的な観点から見ると、canonical は 301 永続リダイレクトの補助機能として理解できます。
  • Canonical は相対リンクでも絶対リンクでも使用できますが、絶対リンクが推奨されます。
  • Google は正規ページを次のように定義しています: 正規ページとは、非常に類似したコンテンツを持つ一連のページの中で優先されるバージョンです。
  • 標準: 「モデル」の中国語の意味
スタイルシート文書の外部スタイルシート<link rel="stylesheet" href="base.css">
サイトのホームページへのリンク<link href="http://www.ooxx.com" rel="home" />
初めコレクションの最初のドキュメントへのリンク<link rel="first" href="index.html">
始める現在のドキュメントの最初のページへのリンク<link rel="start" href="about:blank">
コレクション内の次のドキュメントへのリンク<link rel="next" href="about:blank">
前へコレクション内の前の文書へのリンク<link rel="chapter" href="about:blank">
最後コレクション内の最後のドキュメントへのリンク<link rel="last" href="index.html">
ドキュメントへのリンクを提供します。このドキュメントは、現在のドキュメントのコンテキストを提供します。
検索ドキュメント検索ツールへのリンク
サイドバーブラウザのサイドバーに表示されるドキュメントへのリンク
コンテンツ現在のドキュメントの目次へのリンク通常、メインドキュメントコンテンツのサイドバーに配置され、現在のページのトピック間を移動するのに便利です。
索引現在のドキュメントのインデックスへのリンク
用語集現在のドキュメント用語集へのリンク
著作権現在のドキュメントの著作権またはプライバシー ページへのリンクウェブサイトの下部にある著作権
現在のドキュメントのセクションへのリンク
セクションドキュメントリストのセクションへのリンク
サブセクション現在のドキュメント リストのサブセクションへのリンク。 (セクションには複数のサブセクションを含めることができます。)
コレクション内の最上位ドキュメントへのリンク
目次コレクションのディレクトリへのリンク
上記のソース文書へのリンク
子供ソース文書へのリンクは下記
ヘルプヘルプドキュメントへのリンク<link rel="help" href="http://www.xxoo.net/help.html" />
ブックマークブックマーク用の永続的なURLリストタイトル
外部の外部文書へのリンク記事内で引用されている外部リンク
ノーフォロー有料リンクなど、許可されていない文書へのリンク
Googleは「nofollow」を使用して、検索スパイダーがリンクをたどらないように指定します。
サイト上の関連記事、サイト上のランダム記事、コメント返信、コメント、リストと記事ページの参照および著者リンク、サイドバーのコメントアドレス、ホームページナビゲーションの「ホーム」リンク、最もコメントされた記事、最もアクセスされた記事
参照なしユーザーがこのハイパーリンクをたどったときに、ブラウザがHTTPリファラーヘッダーを送信しないように指定します。
ライセンス文書の著作権情報へのリンク
タグ現在のドキュメントタグ(キーワード)サイドバーのタグクラウド、記事のタグ、リストのタグ、タグページのタグ
友人スポンサーフレンドリーリンク、テーマは下部にあります

由于本人水平有限,難免存在一些錯誤,看官們如果覺得有不妥或者需要補充的地方,請留言指出,謝謝!

参照する

http://www.w3schools.com/TAGS/att_a_rel.asp

http://vanessa.b3log.org/research-a-rel-value

http://www.w3school.com.cn/htmldom/prop_anchor_rel.asp

rel-authorタグについて言及する必要がある

HTML rel canonical属性値

リンクタグのrel属性の意味

rel="canonical" について (Google ウェブマスター ツール)

<<:  MySQL 接続とコレクションの簡単な分析

>>:  Nginx メモリプールのソースコード分析

推薦する

よく使用される MySQL 関数の完全なリスト (分類および要約)

1. 数学関数ABS(x) xの絶対値を返します。 BIN(x) xの2進値を返します(OCTは8...

Linux デバイスに空き容量がありません inode の満杯により 500 エラーが発生します

iノードとは何ですか? inode を理解するには、まずファイル ストレージから始める必要があります...

VMware Workstation16 と Navicat リモート接続での Centos7 での MySQL8.0 インストール プロセス

目次1. CentOS7+MySQL8.0、yumソースインストール2. MySQLにログインしてパ...

CSS3 でクールなスライス画像カルーセル効果を実現

今日は、CSS を使用してクールな画像カルーセル コンポーネントを作成する方法を学びます。その原理は...

CSS と HTML とフロントエンド テクノロジーのレイヤー図

JavascriptとDOMの関係は非常に曖昧で、CSSやHTMLのフロントエンド技術層も理解してい...

ウェブデザインの仕事に応募する方法

<br />みなさんこんにちは!ここで皆さんとチャットできて光栄です! (*^__^*)...

IE6、IE7、IE8 で CSS3 の丸い角と影のスタイルをサポートする

CSS3 の角丸や影の効果を使ったページを作りたいのですが、IE ブラウザでは対応していません。こ...

オンラインチャットを実現するVue+sshフレームワーク

この記事では、オンラインチャットを実現するためのVue + sshフレームワークの具体的なコードを参...

DockerにTomcatコンテナを追加したときにホームページにアクセスできない問題の解決方法

質問docker run コマンドを使用して、tomcat コンテナが正常に追加されました。ポートも...

ヘッダーのチェックボックスをテキスト実装コードに変更するための選択テーブルを持つ要素

方法1: テーブル属性を使用する: header-cell-class-name テーブルインターフ...

JavaScript データ構造 双方向リンクリスト

単方向リンク リストは、先頭から末尾、または末尾から先頭への方向のみを走査できます。そのため、単方向...

MySQL のキーとインデックスの違い

まずはコードを見てみましょう: ALTER TABLE reportblockdetail ADD ...

Docker Swarm クラスタ管理の使用と原理の分析

Swarm クラスター管理導入Docker Swarm は Docker 用のクラスター管理ツールで...

node.jsのコアモジュールとは

目次グローバルオブジェクトグローバルオブジェクトとグローバル変数プロセスコンソール一般的なツールユー...

Linux サーバー上の hosts ファイル構成の詳細な説明

Linux サーバーのホスト ファイルの構成hosts ファイルは、Linux システム内の IP ...