rel=relation - 関係指定

トップ > HTMLリファレンス > rel=relation

属性

<タグ名 rel=relation> - 関係指定

説明

<link>, <a>, <area>, <form>rel に指定する値として下記が定義されています。

linka/areaform意味
stylesheet××この文書に適用するスタイルシートの URL。
prevこの文書のひとつ次の文書の URL。
nextこの文書のひとつ次の文書の URL。
helpこの文書に関連するヘルプ文書の URL。
author×この文書の作者に関する文書の URL。
searchこの文書に関する検索画面の URL。
licenseこの文書に関連するライセンス文書の URL。
alternate×この文書の代替となる文書の URL。
canonical××この文書の原典となる文書の URL。
icon××この文書に関連するアイコンファイルの URL。
dns-prefetch××速度改善のために、ブラウザに事前名前解決を指示する URL を指定します。
prefetch××速度改善のために、ブラウザに事前取得を指示する URL を指定します。
preload××速度改善のために、ブラウザに事前取得と事前キャッシュを指示する URL を指定します。
prerender××速度改善のために、ブラウザに事前レンダリングを指示する URL を指定します。
modulepreload××モジュール化されたスクリプトファイルを先読みします。
nofollow×この文書の著者はリンク先の文書を是認するものではないことを示します。
opener×target="_blank" で開いたリンク先から、リンク元に window.opener でアクセスすることを許可します。
noopener×この文書はリンク先文書の opener ではないことを示します。これにより、target="_blank" で開いたリンク先文書から、この文書を window.opener で参照・操作されてしまうことを防ぎます。ただし、Chrome 88 や Firefox 79 からは標準で target="_blank" で開いたリンク先文書からは window.opener を参照できなくなりました。
noreferrer×このリンク先を参照した時、ユーザエージェント(ブラウザ)が、HTTP Refereヘッダを送信しないことを要求します。
external×リンク先が外部文書であることを示します。
tag××この文書に関するタグを示す URL。
bookmark××このアーティクルのパーマリンク(固定URL)。
manifest××Webアプリケーションのマニフェストファイル。(→ 詳細)
pingback××この文書が、他の文書から参照されたことを知るための Pingback サーバの URL を指定します。詳細は、[PINGBACK 1.0] を参照してください。5章の例がわかりやすいです。

使用例

HTML
# スタイルシート
<link rel="stylesheet" href="css/style.html" type="text/css">

# 関連文書
<link rel="prev" href="chapter1.html">
<link rel="next" href="chapter3.html">
<link rel="help" href="help.html">
<link rel="author" href="yamada_taro.html">
<link rel="license" href="license.html">
<link rel="alternate" href="simple-format.html">
<link rel="canonical" href="https://www.example.com/original.html">
<link rel="icon" href="image/favicon.png" type="image-x-icon">

# 速度改善
<link rel="dns-prefetch" href="http://www.example.com/">
<link rel="prefetch" href="http://www.example.com/">
<link rel="preload" href="http://www.example.com/">
<link rel="prerender" href="http://www.example.com/">
<link rel="modulepreload" href="script.js">

# リンク先との関係
<a rel="nofollow" href="http://www.example.com/">...</a>
<a rel="opener" target="_blank" href="http://www.example.com/">...</a>
<a rel="noopener" target="_blank" href="http://www.example.com/">...</a>
<a rel="noreferrer" target="_blank" href="http://www.example.com/">...</a>
<a rel="external" href="ex/external-document.html">...</a>

# その他
<a rel="tag" href="http://www.example.com/">...</a>
<a rel="bookmark" href="bookmark.html">...</a>
<link rel="manifest" href="/manifest.webmanifest">
<link rel="pingback" href="/cgi/pingback.php">

Copyright (C) 2015-2021 杜甫々
初版:2015年1月10日 最終更新:2021年3月24日
http://www.tohoho-web.com/html/attr/rel.htm