HTML Tag Reference

rel 属性

リンク先の位置づけを表す

rel 属性は、現在の文書からみた、リンク先となるリソースの位置づけを表します。

HTML Standard で定義されている rel 属性値は下記の通りです。また、半角スペースで区切ることで、複数の値を指定することも可能です。

属性値 意味 使用できる要素
link 要素 a 要素 area 要素 form 要素
alternate 代替文書 (例えば別言語版、別フォーマット版など) -
canonical 現在の文書の優先URLを指定する - - -
author 著者情報 -
bookmark 文書の固定リンク - - -
dns-prefetch ユーザエージェントがターゲットリソースの生成元の DNS 解決を先行して実施するよう指定 - - -
external 外部サイトへのリンクであることを示す -
help ヘルプへのリンク
icon アイコンをインポートします - - -
modulepreload ユーザエージェントが先行してモジュールスクリプトをフェッチし、文書のモジュールマップに格納しなければならないことを指定します - - -
license ライセンス文書 -
next 連続した文書における次の文書 -
nofollow 重要でないリンク - -
noopener target 属性を持つリンクを開く際、Window.opener プロパティを設定しません - -
noreferrer ユーザーがリンクを移動する際、リファラを送信しません - -
opener target 属性を持つリンクを開く際、Window.opener プロパティを設定します - -
pingback Pingback 1.0 仕様に基づき、ピングバック(トラックバック)用の URI を指定します - - -
preconnect リンク先のリソースにあらかじめ接続するように指定します (link 要素でのみ使用可能) - - -
prefetch リンク先のリソースをあらかじめキャッシュするように指定します (link 要素でのみ使用可能) - - -
preload リンク先のリソースを事前に読み込むように指定します (link 要素でのみ使用可能) - - -
prerender リンク先のリソースを読み込んでオフスクリーンでレンダリングしておくように指定します - - -
prev 連続した文書における前の文書 -
search 検索機能を提供するリソース -
stylesheet スタイルシート - - -
tag 文書に指定されたタグのページ - -

この他、HTML 4.01 の仕様書 (6.12 Link types : HTML 4.01 Specification W3C Recommendation 24 December 1999) でも属性値が定義されていますし、Microformats Wiki (existing rel values : Microformats Wiki) には様々な rel 属性値がまとめられています。

HTML5 における rel 属性値

HTML 4.01 などにおいて、rel 属性値は制作者が自由に拡張できるものとされていました。ブラウザがそれをサポートするかは別として、head 要素の profile 属性に rel 属性値とその役割を定義した文書の URI を指定することで、独自の rel 属性値を使うことが許されていたわけです。しかし、HTML5 においては、profile 属性は廃止され、自由に rel 属性値を拡張することはできなくなっています。

その代わりに、rel 属性値を提案することができるようになりました。制作者が自由に拡張できてしまう仕組みよりも、1箇所にまとめて提案を受け付けることで、ブラウザベンダがそれを取り入れやすくする意図もあってのことです。

HTML Standard 仕様書内で定義されている rel 属性値は上記で説明したとおりですが、これとあわせて、Microformats Wiki (existing rel values : Microformats Wiki) には多くの rel 属性値が提案され、まとめられています。

中には、HTML 4.01 において定義されていたものや、すでにブラウザによってはサポートされている値も多く含まれていますが、ここに登録されているものであれば、HTML5 の rel 属性値として使用することができます。

ただし、W3C が提供するバリデータ (Markup Validation Service) やそれに準拠した検証サービスでは、HTML5 仕様書で定義されていない rel 属性値以外は 「妥当でない」 とされる場合があります。また、rel 属性値のサポートはブラウザの実装に依存するため、指定したからといって、意図した通りに利用されるとは限りません。

rel 属性の仕様

この属性を使用できる要素

rel 属性のサンプルソース

<head>
 <meta charset="utf-8" />
 <title>サンプル</title>
 <link rel="stylesheet" href="/css/style.css" />
 <link rel="alternate" type="application/rss+xml" title="RSSフィード" href="/feed/" />
 <link rel="author" href="/auther/" />
 <link rel="icon" type="image/png" href="/img/favicon.png" />
 <link rel="shortcut icon" type="image/x-icon" href="/img/favicon.ico" />
</head>
<article>
 <header>
  <h1><a href="article.html" rel="bookmark">記事のタイトル</a></h1>
  <p>記事の概要</p>
 </header>
…省略…

用途から目的の要素を探す

用途から HTML 要素を逆引きできます。