HTML <area>
要素は画像のホットスポット領域の定義、また任意で領域とハイパーテキストリンクの関連づけを行います。この要素は <map>
要素内だけで使用します。
コンテンツカテゴリ | フローコンテンツ、フレージングコンテンツ |
---|---|
許可された内容 | なし。これは空要素です。 |
タグの省略 | 開始タグは必須。終了タグを記述してはならない。 |
許可された親要素 | フレージングコンテンツを受け入れるすべての要素。<area> 要素は祖先が <map> でなければなりませんが、直接の親要素である必要はありません。 |
DOM インターフェイス | HTMLAreaElement |
属性
この要素はグローバル属性を持ちます。
accesskey
HTML 4 のみ、廃止 Gecko 5.0- 要素のキーボードナビゲーションアクセラレータを指定します。ALT または同様のキーと指定した文字のキーを併せて押下すると、キーシーケンスに関係があるホットスポットを選択します。ページデザイナーは、すでにブラウザに割り当てられているキーシーケンスを避けるよう注意されます。この属性は HTML5 からグローバル属性になりました。
alt
- 画像を表示しないブラウザが代わりに表示するテキスト文字列です。テキストの内容は、代替テキストを表示しない場合に画像が提供する選択肢と同じものをユーザに与えるような表現にすべきです。HTML4 では、この属性は必須ですが空文字列 ("") でもかまいません。HTML5 では、この属性は href 属性を使用する場合にのみ必須です。
coords
- ホットスポット領域の座標を指定する値のセットです。値の数と意味は shape 属性に指定した値に依存します。
rect
または長方形では、coords の値は x,y のペアが 2 つです: 左、上、右、下を指します。circle
形状の値はx,y,r
であり、x,y
は円の中心を指定するペア、r
は半径の値です。poly
または多角形の値は、多角形の各頂点の x,y のペアのセットです:x1,y1,x2,y2,x3,y3,
などとなります。HTML4 での値はピクセル値、またはパーセント記号 (%) を付加した場合はパーセント値です。HTML5 での値は CSS ピクセル値です。 download
HTML5- この属性がある場合は、作者はハイパーリンクをリソースのダウンロードに使用すると意図することを示します。
download
属性の詳しい説明は<a>
をご覧ください。
href
- このエリアのハイパーリンク対象です。この値は、妥当な URL です。HTML4 では、この属性か nohref 属性を与えなければなりません。HTML5 では、この属性を省略できます。省略した場合、area 要素はハイパーリンクを提供しません。
name
HTML 4 のみ、廃止 Gecko 5.0- 古いブラウザでスクリプトから使用できるようにするため、クリッカブルエリアに名前を定義します。
media
HTML5- リンク先のリソースをどのメディア向けに設計しているかを示します。例えば
print and screen
です。省略した場合のデフォルト値はall
です。この属性は、href 属性を与える場合にのみ使用してください。
nohref
HTML 4 のみ、廃止 Gecko 5.0- 関連づけたエリアはハイパーリンクがないことを示します。この属性か href 属性を指定しなければなりません。
使用上の注意: この属性は HTML5 で廃止されており、代わりに href 属性を省略すれば十分です。
referrerpolicy
- リソースを読み込む際にどのリファラを使用するかを示す文字列です:
"no-referrer"
は、Referer:
ヘッダを送信しないことを表します。- "
no-referrer-when-downgrade
" は、TLS (HTTPS) を使用せずに生成元へナビゲートする場合はReferer:
ヘッダを送信しないことを表します。これは他にポリシーが定められていない場合の、ユーザエージェントのデフォルトの動作です。 "origin"
は、ページの生成元 (大まかにいえばスキーム、ホスト、ポート) をリファラとすることを表します。- "origin-when-cross-origin" は、異なる生成元へのナビゲートではリファラをスキーム、ホスト、ポートに制限します。同一生成元へのナビゲートでは、リファラのパスも含めます。
"unsafe-url"
は、リファラに生成元とパスを含めることを表します (ただし、フラグメント、パスワード、ユーザ名は含めません)。これは生成元やパスの情報が TLS で保護されたリソースからセキュアでない生成元へ漏えいしますので、安全ではありません。
rel
HTML5- href 属性を含むアンカーで、この属性は、対象オブジェクトとリンクオブジェクトの関係を指定します。属性値は、カンマで区切られたリンクタイプ値のリストです。値とそれらの意味は、ドキュメントの作者に意味づけを示す何らかの権威により登録されます。値が与えられない場合のデフォルトの関係は、空 (void) です。この属性は、href 属性を与える場合にのみ使用してください。
shape
- 関連づけたホットスポットの形状です。HTML5 および HTML4 の仕様では長方形の領域を定義する値
rect
、円形の領域を定義する値circle
、多角形を定義する値poly
、定義済みの領域以外すべての領域を示す値default
を定めています。多くのブラウザ、特に Internet Explorer 4 以降ではcirc
、polygon
、rectangle
を shape の正しい値としてサポートします。これらの値は (非標準) です。 tabindex
HTML 4 のみ、廃止 Gecko 5.0- ブラウザのタブオーダーにおける、定義したエリアの位置を示す数値です。この属性は HTML5 のグローバル属性です。
target
- この属性は、リンク先のリソースをどこに表示するかを指定します。これは、HTML4 ではフレームの名前またはキーワードでした。HTML5 では、ブラウズ・コンテキスト の名前またはキーワードです (例えば、タブ、ウィンドウ、インラインフレームなど)。以下のキーワードは特別な意味を持ちます:
_self
: 応答を現在の同じ HTML4 フレーム (または HTML5 のブラウズ・コンテキスト) に読み込みます。この値は、属性が指定されていない場合のデフォルト値です。_blank
: 応答を新しい名前の付けられていない HTML4 ウィンドウまたは HTML5 のブラウズ・コンテキストに読み込みます。_parent
: 応答を現在のフレームの HTML4 フレームセットの親要素または HTML5 の現在の親ブラウズ・コンテキストに読み込みます。親要素がない場合、このオプションは_self
と同じ振る舞いをします。_top
: HTML4 では、応答をすべて元のウィンドウに読み込み、他のフレームをすべてキャンセルします。HTML5 では、応答をトップレベルのブラウズ・コンテキストに読み込みます (現在のブラウズ・コンテキストの祖先にあたり、それ以上親のない要素です)。親要素がない場合、このオプションは_self
と同じ振る舞いをします。
type
- この属性は、リンク対象の MIME タイプの形式を表すメディアタイプを指定します。一般的に、これは厳密なアドバイザリ情報として提供されます。しかし将来、ブラウザがマルチメディアタイプの小さなアイコンを追加するかもしれません。例えば、メディアタイプが audio/wav にセットされた場合にブラウザが小さなスピーカーのアイコンを追加するでしょう。理解される MIME type の一覧は、https://www.w3.org/TR/html4/references.html#ref-MIMETYPES を参照してください。この属性は、href 属性を与える場合にのみ使用してください。
例
<map name="primary"> <area shape="circle" coords="200,250,25" href="another.htm" /> <area shape="default" nohref /> </map>
仕様
仕様書 | 策定状況 | コメント |
---|---|---|
Referrer Policy referrerpolicy attribute の定義 |
草案 | referrerpolicy 属性を追加。 |
WHATWG HTML Living Standard <area> の定義 |
現行の標準 | |
HTML5 <area> の定義 |
勧告 | |
HTML 4.01 Specification <area> の定義 |
勧告 |
ブラウザ実装状況
機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
基本サポート | (有) | (有) | (有) | (有) | (有) |
referrerpolicy |
未サポート | 42 (42)[1] | 未サポート | 未サポート | 未サポート |
機能 | Android | Android Webview | Firefox Mobile (Gecko) | IE Mobile | Opera Mini | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
基本サポート | ? | (有) | ? | ? | ? | ? | ? | (有) |
referrerpolicy |
未サポート | 未サポート | 42.0 (42)[1] | 未サポート | 未サポート | 未サポート | 未サポート | 未サポート |
[1] Firefox 42 から Firefox 44 では、referrer
という名前の属性でした。
注記
HTML 3.2、4.0、5 の仕様では、終了タグ </area>
を禁止しています。
XHTML 1.0 仕様では、末尾のスラッシュが必要です: <area />
。
id 属性、class 属性、style 属性は HTML4 仕様で定義しているコア属性と同じ意味を持ちますが、Netscape と Microsoft だけがこれらを定義しています。
Netscape 1 レベルのブラウザは target 属性を理解しません。これはフレームに関係するためです。
HTML 3.2 では alt、coords、href、nohref、shape のみ定義しています。