<<PREV | TOP | NEXT>>

OBJECT Element

last modified 8th/Oct. 2000

OBJECT 要素は %Special; に含まれるインライン要素です。

OBJECT 要素は HTML 4 で新たに導入された要素であり、画像、他の文書、アプレットなどの「オブジェクト」を文書内に埋め込むための要素です。今までは、画像は IMG 要素、文書は IFRAME 要素、クライアント・サイドのプログラム(アプレット)は APPLET 要素などのように、オブジェクトの種類毎に異なる要素を用いていましたが、今後は全てのオブジェクト(アプレット、プラグイン、メディア・ハンドラ)を OBJECT 要素一つで実現できるようになる筈です。

挿入オブジェクト既存の要素一般要素
画像IMGOBJECT
アプレットAPPLET (非推奨) OBJECT
他のHTML文書IFRAMEOBJECT

OBJECT 要素の最大の特徴はその一般性にあり、今後新たに開発されるいかなる形式のデータであれ、一般に扱えるように設計されています。そのため、仕様が複雑になっていますが、既存の要素で実現可能な例では、 object 要素を用いても極単純に記述できます。

具体例

HTML 文書の埋め込み

他の HTML 文書を埋めこむ場合は、 iframe 要素も利用できますが、 object 要素でも実現可能です。

HTML 文書の挿入の例; ここに表示されるのは代替テキストです。

<p>html 文書の挿入の例;
<object data="./index.html" type="text/html" height="200" width="400">
ここに表示されるのは代替テキストです。</object>
</p>

埋めこむ文書の URI を data 属性で示し、対象の種類が HTML であることを type 属性で示してある。

画像の埋め込み

画像の挿入の例; ここに表示されるのは代替テキストです。

<p>html 文書の挿入の例;
<object data="http://www.htmlhelp.com/icon/wdglogo1.gif" type="image/gif" height="120" width="300">
ここに表示されるのは代替テキストです。</object>
</p>

埋めこむ画像の URI を data 属性で示し、対象の種類が GIF であることを type 属性で示してある。

画像の挿入の例; ここに表示されるのは代替テキストです。

<p>html 文書の挿入の例;
<object data="../back.jpg" type="image/jpeg" height="210" width="150">
ここに表示されるのは代替テキストです。</object>
</p>

埋めこむ画像の URI を data 属性で示し、対象の種類が JPEG であることを type 属性で示してある。

object 要素の定義

OBJECT 要素の文書型定義の抜粋;

<!ELEMENT OBJECT - - (PARAM | %flow;)*
 -- generic embedded object -->
<!ATTLIST OBJECT
  %attrs;                              -- %coreattrs、%i18n、%events --
  declare     (declare)      #IMPLIED  -- declare but don't instantiate flag --
  classid     %URI;          #IMPLIED  -- identifies an implementation --
  codebase    %URI;          #IMPLIED  -- base URI for classid, data, archive--
  data        %URI;          #IMPLIED  -- reference to object's data --
  type        %ContentType;  #IMPLIED  -- content type for data --
  codetype    %ContentType;  #IMPLIED  -- content type for code --
  archive     CDATA          #IMPLIED  -- space-separated list of URIs --
  standby     %Text;         #IMPLIED  -- message to show while loading --
  height      %Length;       #IMPLIED  -- override height --
  width       %Length;       #IMPLIED  -- override width --
  usemap      %URI;          #IMPLIED  -- use client-side image map --
  name        CDATA          #IMPLIED  -- submit as part of form --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  >

OBJECT 要素はインライン要素です。開始タグと終了タグが両方とも必須で、内容はオブジェクトが表示(実行)出来ない場合の代替内容になります。内容モデルは任意のブロック要素と、任意のインライン要素が可能です。

属性の定義

classid = uri [CT]
codebase = uri [CT]
codetype = content-type [CI]
data = uri [CT]
type = content-type [CI]
archive = uri-list [CT]
declare [CI]
standby = text [CS]

以上、 OBJECT 要素には詳細な情報を与えることが可能ですが、一般に次の情報が必要です;

埋め込むオブジェクトの実装 (implementation)
レンダリング対象のデータ
オブジェクトの実行時に必要なパラメタ

OBJECT 要素の内容

object 要素は img 要素を異なり、終了タグが存在します。開始タグと終了タグの間に記述された内容は、 object を処理できない場合だけ表示される代替テキストです。この点では、 iframe 要素と同様です。

一般に画像や音声などのデータは大きくなりがちでロードに時間がかかり、 Plug-in や JAVA Apllet などは未知ものもをロードしてユーザのディスクにアクセスする為、ユーザにセキュリティ上の不安を与えます。そのため、ユーザが画像、Plug-in、Apllet などを実行しないように設定していることは珍しくありません。

したがって、埋め込みオブジェクトが実行されなくても、ユーザが内容を閲覧できるように、代替テキストは適切に指定しておく必要があります。

object 要素の内容には任意のブロック要素と任意のインライン要素が許されています。但し、 object 要素自身はインライン要素ですから、その親子関係には注意する必要があります。

<div>
<object classid="java:navi.class" codetype="application/java"
        codebase="/home/%7Esugai/public/lib/java/">
  <param name="stat" value="1">
  <param name="logo" value="icon.png">
  <p>【注意】オブジェクトが実行できません。
  <a href="./toc.html" target="_blank">直接参照ください</a>。</p>
</object>
</div>

上の例では、 div 要素の内容に object 要素が現れており、その内容に p 要素が現れています。 div 要素の内容に p 要素は許されていますから、親子関係に矛盾はありません。

P 要素の子孫要素にブロック要素が現れているので誤り

<p>
<object data="./intro.mpeg" type="video/mpeg">
  <p>【注意】オブジェクトが実行できません。
  <a href="./intro.html" target="_blank">直接参照ください</a>。</p>
</object>
</p>

OBJECT 要素の入れ子

object 要素の内容は、指定されたオブジェクトが実行できなかった場合にだけ読まれます。したがって、 OBJECT 要素の内容に次善的なオブジェクトを指定することにも意味があります。

例えば、製作者の意図が最も表現できるフォーマットが MPEG 動画だったとします。ユーザがこれを利用できない場合は、 PNG 画像を用意し、これも利用できなければ GIF 画像を用意すると云う場合は、次のように記述します;

<div>
<object data="./spectra.mpeg" type="video/mpeg">
  <object data="./spectra.png" type="image/png">
    <object data="./spectra.gif" type="image/gif">
      <p>【注意】グラフが読みこめませんでした。</p>
    </object>
  </object>
</object>
<p><a href="./spectra.mpeg">動画</a>、 <a href="./spectra.png">PNG 画像</a>、
<a href="./spectra.gif">GIF 画像</a>が用意してあります。</p>
</div>

上の例では、ブラウザはまず、 spect.mpeg をロードして実行しようとし、これに失敗すると次に spectra.png を実行しようとします。これにも失敗すると spectra.gif を実行しようとします。全て失敗すると、最終的には P 要素の内容を表示します。

一般的注意点

  1. 埋め込みオブジェクトは文書構成上有用なレイアウトですが、オブジェクトのデータ・サイズが大きい場合は、閲覧に支障をきたします。サイズが大きなデータは埋めこむのではなく、ユーザが自分の意思でアクセスできるように、リンクで用意しておくべきでしょう。
  2. OBJECT 要素は未だ実装が安定していません。画像は IMG 要素、文書は IFRAME 要素を利用した方が安全かもしれません。できるだけ多くの環境のユーザに情報が伝わるように配慮する必要があります。

OBJECT 要素による Plug-in、 JAVA APLLET の利用、イメージマップの作成などに付いてはここでは紹介しませんでした。何れ稿を改めて紹介したいと思います。

<<PREV | TOP | NEXT>>

SEO [PR] [ Windows7 f ^T[o[ Cu`bg SEO