rel属性

このエントリーをはてなブックマークに追加

rel属性はlink要素やa要素、area要素で参照するリソースのタイプを指定できる属性です。

すべての要素で以下の値を共通で取ることができます。

alternate 現在のドキュメントの代替リソースを指定します
author 現在のドキュメントの記事の筆者を指定します
help 現在のドキュメントのヘルプを指定します
icon 現在のドキュメントのアイコンを指定します
license 著作権情報を指定したページへのリンクを指定します
next 一つ後の文書へのリンクを指定します
prefetch 先読みするリソースを指定します
prev 一つ前の文書へのリンクを指定します
search 親ページや関連ページのURLを指定します

a要素・area要素

a要素やarea要素では以下の値も指定できます。

bookmark パーマリンク
nofollow 重要でないリンク
noreferrer リファラを送信しないリンク
tag タグのページのURL 
<object data="http://www.webcreativepark.net/sample/images/2013-12-05%2013.22.31.jpg" width="500" height="500" usemap="#sample"></object>
<map name="sample">
<area shape="rect" coords="0,0,250,250" href="http://www.webcreativepark.net/sample/" rel="bookmark">
</map>
<a href="/html/tag/interactive-contents/" rel="tag">インタラクティブコンテンツ</a>

link要素

link要素では以下の値も指定できます。

stylesheet 読み込むスタイルシートを指定します 
<link rel="stylesheet" href="../style.css">

また、HTML5では定義されていませんが以下のようなrel属性がlink要素で利用されます。

IEなどを考慮していfavicon(ファビコン)を指定する場合はrel=”icon”ではなく以下のrel=”shortcut icon”を利用します。favicon画象には.ico形式のファイルを指定します。

shortcut icon faviconの画象URL

GoogleによりSEOの観点から以下のrel属性の値の利用が推奨されています。

canonical 類似したページの中で優先されるページを指定する
publisher 著作権をもつ団体のGoogle+ページのURL

また、Googleはrel=”author”に著作権者のGoogle+のアカウントページを指定することも推奨しています。

iPhoneやAndroidなどのスマートフォンでは独自の仕様として以下のrel属性でスマートフォンのホームページに登録できるウェブクリップアイコンのURLを指定できます。(Android端末は端末により対応状況が異なります。)

apple-touch-icon 指定されて画象に角丸と光沢を加えて利用する
apple-touch-icon-precomposed 指定されて画象そのままウェブクリップアイコンとして利用する

登録日 : 2014年03月20日 最終更新日 : 2014年3月20日

同じカテゴリー(属性)のエントリー

検索

スポンサードリンク

バージョン

リファレンス