[1] [[HTML]] の [DFN[[CODE(HTMLe)[area]] 要素型]]の要素は、 [[クライアント側画像写像]]の[RUBYB[領域] [region / area]]を定義します。 * 仕様書 [REFS[ - [17] '''[CITE@en-US-x-hixie[HTML Standard]] [CSECTION@en[The [CODE(HTMLe)@en[area]] element]] ''' - [18] [CITE@en-US-x-hixie[HTML Standard]] [CSECTION@en[Image maps]] - [19] [CITE@en-US-x-hixie[HTML Standard]] [CSECTION@en[Links]] - [20] [CITE@en-US-x-hixie[HTML Standard]] [CSECTION@en[Focus management]] - [21] [CITE@en-US-x-hixie[HTML Standard]] [CSECTION@en[Image maps]] ]REFS] * 属性 [2] ,属性名 ,属性値 ,既定値 ,説明 ,状態 ,出典 ,[CODE(HTMLa)[[[accesskey]]]] ,[CODE(SGML)[%[[Char]]]] ,(自動) ,活性化鍵 ,[HTML 4] ,[CODE(HTMLa)[[[alt]]]] ,[CODE(SGML)[%[[Text]]]] ,(必須) ,代替文 ,[HTML 4] ,[CODE(HTMLa)@en[[[bulletin-date]]]],,,,"[[満期]] [DEL@en[([[IETF]] [[I-D]])]]" ,[CODE(HTMLa)@en[[[bulletin-expires]]]],,,,"[[満期]] [DEL@en[([[IETF]] [[I-D]])]]" ,[CODE(HTMLa)@en[[[bulletin-image]]]],[CODE(SGML)@en[%[[URI]];]],,,"[[満期]] [DEL@en[([[IETF]] [[I-D]])]]" ,[CODE(HTMLa)@en[[[bulletin-text]]]],[CODE(SGML)@en[%[[Text]];]],,,"[[満期]] [DEL@en[([[IETF]] [[I-D]])]]" ,[CODE(HTMLa)[[[class]]]] , , ,[[級]] ,[HTML4] %[[coreattr]] ,[CODE(HTMLa)[[[coords]]]] ,[CODE(SGML)[%[[Coords]]]] , ,座標 ,[HTML 4] ,[CODE(HTMLa)[[[csout]]]] , , , ,非標準 ,[[Adobe]] ,[CODE(HTMLa)[[[csover]]]] , , , ,非標準 ,[[Adobe]] ,[CODE(HTMLa)[[[dir]]]] , , ,[[書字方向]] ,[HTML4] %[[i18n]] ,[CODE(HTMLa)[[[href]]]] ,[CODE(SGML)[%[[URI]]]] , ,[HTML 4] ,[CODE(HTMLa)[[[id]]]] , , ,一意識別子 ,[HTML4] %coreattr ,[CODE(HTMLa)[[[lang]]]] , , ,[[自然言語]] ,[HTML4] %i18n ,[CODE(HTMLa)[[[xml]]:lang]] , , ,自然言語 ,[XHTML1] ,[CODE(HTMLa)[[[nohref]]]] ,([[真偽値属性]]) ,(偽) ,リンク先なし ,[HTML 4] ,[CODE(HTMLa)[[[onblur]]]] ,[CODE(SGML)[%[[Script]]]] ,(なし) , ,[HTML 4] ,[CODE(HTMLa)[[[onclick]]]] , , , ,[HTML4] %[[events]] ,[CODE(HTMLa)[[[ondblclick]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onfocus]]]] ,[CODE(SGML)[%[[Script]]]] ,(なし) , ,[HTML 4] ,[CODE(HTMLa)[[[onkeydown]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onkeypress]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onkeyup]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onmousedown]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onmousemove]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onmouseout]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onmouseover]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[onmouseup]]]] , , , ,[HTML4] %events ,[CODE(HTMLa)[[[shape]]]] ,[CODE(SGML)[%[[Shape]]]] ,[CODE(HTML)[rect]] ,図形 ,[HTML 4] ,[CODE(HTMLa)[[[style]]]] , , ,スタイル情報 ,[HTML4] %coreattr ,[CODE(HTMLa)[[[tabindex]]]] ,[CODE(SGML)[[[NUMBER]]]] ,(自動) ,焦点移動順 ,[HTML 4] ,[CODE(HTMLa)[[[target]]]] , , ,対象枠・窓 ,[HTML 4] 非推奨 ,[CODE(HTMLa)[[[title]]]] , , ,注釈的題 ,[HTML4] %coreattr ,[CODE(XMLa)[[[xmlns]]]] ,[CODE(URI)[[[http://www.w3.org/1999/xhtml]]]] 固定 ,== ,W3C 勧告 ,[[XHTML m12n]] [[#comment]] * レンダリング [4] [CODE(HTMLe)[area]] は強制空要素で[[内容]]を持ちませんから、 普通 UA はレンダリングしません。画像や画像写像に対応していないときには、 [[代替文]] ([CODE(HTMLa)[[[alt]]]] 属性) が使われます。 著者は [CODE(HTMLa)[alt]] を指定しなければなりません。 [5] [CODE(HTMLe)[map]] の内容に [CODE(HTMLe)[area]] と[[ブロック水準要素]]が混ざっているときは、 UA は [CODE(HTMLa)[area]] を無視しなければなりません [SUP[ [HTML 4] ]]。 * CSS と選択子 [22] [[画像写像]]中の[[shape]]は、 [[CSS]] の[[カスケード]]にあっては、その元となった [CODE(HTMLe)@en[[[area]]]] [[要素]]とは別個ながらも同じ[[スタイル規則]]を与えられた[[要素]]のように扱われることが[[期待されています]]。 [SRC[>>21]] [25] ただし [CODE(HTMLe)@en[[[area]]]] [[要素]]の[[親要素]]からではなく、[[画像写像]]を使っている [CODE(HTMLe)@en[[[img]]]] [[要素]]や [CODE(HTMLe)@en[[[object]]]] [[要素]]から[[継承]]します。 [SRC[>>21]] ;; [23] 1つの [CODE(HTMLe)@en[[[map]]]] [[要素]]が複数の [CODE(HTMLe)@en[[[img]]]] [[要素]]から参照されている場合、 同じ [CODE(HTMLe)@en[[[area]]]] [[要素]]が1つの[[文書]]に複数箇所登場することになってしまうので、 このような変則的な扱いになっています。 ;; [26] [[HTML]] の[[利用者エージェント・スタイル・シート]]において [CODE(HTMLe)@en[[[area]]]] [[要素]]は [CODE(CSS)@en['[[display]]: [[none]]']] となることが[[期待されています]]が、この変則的な規定により、 [[shape]] に対する指定はその状態でも適用されます。 [24] [[shape]] の[[レンダリング]]に関しては、 [CODE(CSS)@en['[[cursor]]']] [[特性]]だけが効果を持つことが[[期待されています]]。 [SRC[>>21]] [REFS[ -[14] [CITE@en[''''''[''''''whatwg'''''']'''''' Styling of area elements (as displayed within referencing image)]] ( ([[L. David Baron]] 著, [TIME[2007-05-11 03:21:21 +09:00]] 版)) -[15] [CITE@en[''''''[''''''whatwg'''''']'''''' Styling of area elements (as displayed within referencing image)]] ( ([[L. David Baron]] 著, [TIME[2009-02-12 04:36:25 +09:00]] 版)) -[16] [CITE@en[''''''[''''''whatwg'''''']'''''' Styling of area elements (as displayed within referencing image)]] ( ([[Ian Hickson]] 著, [TIME[2009-02-14 05:03:53 +09:00]] 版)) -[13] [CITE@en[Using cursor property on elements that have a display of 'none']] ( ([[Michael A. Puls II]] 著, [TIME[2011-02-18 00:55:00 +09:00]] 版)) ]REFS] [27] この規定は [[Gecko]] の実装を元に [[HTML]] に取り入れられました [SRC[>>14]]。現時点で [[WinIE]] と [[Chrome]] は対応していないようです。 [TIME[2012-06-09T04:14:29.500Z]] [[Opera]] は [[Gecko]] と同様に実装しているようではありますが、 [CODE(CSS)@en['[[display]]: [[none]]']] では適用されなくなっていたようです [SRC[>>13]]。 [28] [CODE(CSS)@en[[[:link]]]], [CODE(CSS)@en[[[:hover]]]] などの[[擬似クラス]]も通常通り適用されます。 * 歴史 ** HTML4 -[3] [[HTML 4]] -- [CSECTION[13.6.1 Client-side image maps: the [CODE(HTMLe)[MAP]] and [CODE(HTMLe)[AREA]] elements]] ** XHTML2 [11] [[XHTML2]] では2つ目の[[作業原案]]で削除され、3つ目の[[作業原案]]で復活しています。 3つ目の[[作業原案]]の状態の章で2つ目の[[作業原案]]には編集上の誤りがあったと指摘されており、 素直に信じるなら削除はミスということになります。2つ目の[[作業原案]]では [CODE(HTMLa)@en[[[src]]]] と関連する[[属性]]が[[大域属性]]化され、 [CODE(HTMLa)@en[[[usemap]]]] [[属性]]を削除するつもりで他の[[要素]]まで削除してしまった可能性があります。 あるいは、本当は [CODE(HTMLe)@en[[[area]]]] [[要素]]も削除するつもりで、 後から方針を変更したのかもしれません。いずれにしても、[[大域属性]]化で [CODE(HTMLe)@en[[[area]]]] [[要素]]は本質的に不要になったのになぜ残したのかは謎です。 ;; [CITE@en[- XHTML Client-Side Image Map Module]] ([TIME[2002-12-18 19:57:57 +09:00]] 版) [12] しかし1ヵ月後にはあっさり削除されています。 ;; [CITE@en[XHTML 2.0]] ([TIME[2003-05-08 01:23:41 +09:00]] 版) * 実装 [8] [[画像]]に対応していても、[[画像写像]]には対応していない[[Webブラウザ]]もあります (例: [[Emacs/W3]])。 [[Emacs/W3]] の場合は[[画像]]とは別に[[代替文]]から作られた選択肢一覧が[[レンダリング]]されるようです。 * 関連 [6] 画像写像の領域の定義には [CODE(HTMLe)[area]] を使う方法と [CODE(HTMLe)[[[a]]]] を使う方法があって、 HTML 4 では後者をすすめています ([CODE(HTMLe)[[[map]]]] の説明を参照してください)。 混在している場合は [CODE(HTMLe)[area]] が無視されるので (>>5)、 すべて [CODE(HTMLe)[area]] にするか、すべて [CODE(HTMLe)[a]] にするか、すべて両方で二重に定義するかしかありません。 [9] [[SMIL]] には同様の[[要素]]として [CODE(XMLe)@en[[[anchor]]]] があります。 * メモ [10] [CITE[The SMIL 3.0 Linking Modules]] ([TIME[2008-12-02 00:45:09 +09:00]] 版) [29] [CITE@en[Web Applications 1.0 r7829 I couldn't find a normative statement requiring that only be inside .]] ( ([TIME[2013-04-14 02:18:00 +09:00]] 版))