<object>要素(埋め込みオブジェクト)。

文書中に埋め込まれる画像やマルティメディアなどのオブジェクトである、<object>要素についての解説です。

<object>要素(埋め込みオブジェクト)・目次。

<object>要素とは。

<object>要素とは、文書中に埋め込まれる画像やマルティメディアなどのオブジェクトです。

対象となるオブジェクトは多岐に亘り、

などが挙げられます。

<object>要素を利用出来るHTML文書型。

<object>要素は、以下の文書型で利用出来ます。

<object>要素が含まれるXHTML モジュール。

<object>要素はオブジェクトモジュールに属します。

<object>要素の実装上の注意。

<object>要素は、実装上大きな問題をはらんでいるユーザエージェントが少なくありません。

インターネットエクスプローラ 6.xまで
ネットスケープ 4.x

<object>要素の扱い。

<object>要素は置換インライン要素です。

内容は

  1. 当該オブジェクトにパラメータを与える<param>要素(任意)
  2. 代替コンテンツとなるブロックレヴェル要素またはインライン要素(任意)

が入ります。

代替コンテンツとされる内容は、当該オブジェクトが埋め込み可能な場合には非表示にされる事が求められております。

しかしながら、上述の通り、実装には大きな問題があります。

また、<object>要素は、<head>要素にも入れられます。

この場合、当該オブジェクトは表示されないものでなければなりません。

<object>要素の属性。

<object>要素には、以下の属性が定められております。

いずれも必須でない事に注意して下さい。

共通属性

<object>要素で使える共通属性には

があります。

type
当該オブジェクトのMIMEタイプを指定します。これにより、ユーザエージェントが対応出来ない文書であれば読み込みを省略したり無効なオブジェクトと判断出来るようになります。
data属性
当該オブジェクトのURIを指定します。
classid属性
クラスIDとなるURIを指定します。例えばウィンドウズ版のインターネットエクスプローラでは起動するアクティヴ Xを指定するのに利用されます。
archive
当該オブジェクトに関するアーカイヴのURIを指定します。例えばJAVAアプレットではJAVAアーカイヴ(JARファイル)の指定に用いられます。
codebase属性
data属性, classid属性及びarchiveに相対URIを指定した場合の基準となるURIを指定します。これはJAVAなどでセキュリティを確保するために用いられます。
codetype
classid属性で指定される文書のMIMEタイプを指定します。これにより、ユーザエージェントが対応出来ないMIMEタイプであれば読み込みを省略出来ます。
width属性
height属性

それぞれオブジェクトの横幅・高さをピクセル数またはパーセンテージ「○%」で指定します。

usemap属性

クライアントサイドのクリッカブルマップで利用する画像の場合は、以下の値ををusumap属性値として記述します。

HTML 3.2, HTML 4.01, ISO-HTML及びXHTML 1.0の場合

対応する<area>要素のURI。実際には同一ページ内の対応する<area>要素のname属性値またはid属性値の前に「#」をつけた文字列をusemap属性値に指定します。

  • 同一ページ内のものなので、URLは省略され「#」で始まるフラグメント名のみを記述する事になります。
XHTML 1.1の場合

対応する<area>要素のid属性値そのものをusemap属性値に指定します。

name属性
フォームとして利用する場合にクエリ名として利用します。
tabindex属性
TABキーによるフォーカス移動の優先順位を指定します。詳しくはtabindex属性(TABキー等でのフォーカス移動の優先順位)をご覧下さい。
declare属性値

オブジェクトの存在を宣言するだけの場合(文書中の他の<object>要素で当該オブジェクトを埋め込む場合)、この属性値を用います。XHTMLでは属性値のみの記述は出来ないため、declare="declare"属性として記述します。

declare属性を用いる場合には同時にid属性も用いる事になります。そうしないと他のオブジェクトが当該オブジェクトを埋め込めなくなります。

standby属性
当該オブジェクトの読み込み中に表示するメッセージ(「しばらくお待ち下さい」など)を指定します。

以下に挙げる<object>要素の属性はトランジッショナル文書型及びフレームセット文書型でのみ利用出来る属性で、いずれも排除勧告が出されております。

align属性

align属性はオブジェクトの配置を指定します。

値には以下の五つがあります。

left
左に寄せます。後続するテキスト類は、右に廻り込みます。
right
右に寄せます。後続するテキスト類は、左に廻り込みます。
middle
画像の上下方向の中央をテキストのベースラインに合わせます。
top
上端をテキストのベースラインに合わせます。
bottom
下端をテキストのベースラインに合わせます。

尚、align="lift"属性及びalign="right"属性が与えられた<object>要素以降のテキストの廻り込みを解除するには<br>要素のclear属性を用います。

hspace属性
vspace属性
hspace属性はオブジェクトの左右、vspace属性はオブジェクトの上下の余白をピクセル数(0以上の自然数)で指定します。
border属性
オブジェクトにつける枠線の太さをピクセル単位(0以上の自然数)で指定します。

<object>要素に関する注意事項。

<object>要素にはまだ問題があります。

<object>要素はまだまだ実装に問題がある要素です。

このため、非公認要素である<embed>要素や<noembed>要素が今も並行して利用されております。

<object>要素内にブロックレヴェル要素を記述出来る事について。

<object>要素はインライン要素でありながら、内容としてブロックレヴェル要素を記述する事も出来ます。

このような要素は他にもありますが、特に<object>要素には必須属性が無いうえに、記述上の制限もそれ程多くありません。

このため、ブロックレヴェル要素を内容に持てない<p>要素や<address>要素などに属性の無い<object>要素を記述して、その中にブロックレヴェル要素を記述すると言う事が考えられます。

この記述方法を支持する者もいるようですが、制作者はこのような記述は二つの理由から賛成出来ません。

一つは、<object>要素を認識しない旧式のユーザエージェントで問題が起こり得るからです。

恐らく、旧式のユーザエージェントでは<object>要素の開始タグや終了タグを弾く事になるでしょう。

そうすると、本来あってはならないブロックレヴェル要素の入れ子が書かれている事になってしまい、更におかしな事になってしまう恐れがあります。

もう一つは、<object>要素はその要素名通りオブジェクトを埋め込むための要素であり、"文法違反を合法化するための要素"或いは"ブロックレヴェル要素をインライン化する要素"などと定義されているのではないからです。

個人的には、このような行為はかつてブロックレヴェル単位での引用と言う意味の<blockquote>要素を余白取りのために使っていたのと大差ないと考えます。

つまり、所謂不思議マークアップと何ら変わらないと言えるのです。

<object>要素でHTML文書を埋め込む場合。

<object>要素ではdata属性でHTML文書のURIを指定する事で、HTML文書を埋め込む事も出来ます。

しかし、<object>要素は同様にHTML文書をインラインで埋め込める<iframe>要素と違って、target属性でインラインフレーム外から、或いはインラインフレーム内からページの切替が出来ません。

尚、どちらの要素で埋め込む場合であっても、埋め込まれた文書に於ける相対パスは、その文書自身のURI基準となります。決して、埋め込み先文書のURI基準にはなりません。

<object>要素の記述例。

<object>要素では様々なオブジェクトが埋め込めるため、様々な記述例が存在し得ます。

可能ならフラッシュ動画を、そうでなければ静止画を埋め込む場合。

まず、動画が対応していればフラッシュ動画を、そうでなければGIF画像を表示させたい場合には、以下のように書けば良いでしょう。

<h1>
    <object type="application/x-shockwave-flash" data="Title.swf" width="320" height="180">
        <param name="src" value="Title.swf" />
        <img alt="しらぎくさいと" src="Marguerite.GIF" width="320" height="180" />
        </object>
    </h1>

この場合、<h1>要素(第一等級見出し)として、

表示されるでしょう。

尚、内容となる<param>要素はウィンドウズ版インターネットエクスプローラでフラッシュを埋め込むのに必要なものです。

JAVAアプレットを埋め込む場合。

続いて、JAVAアプレットを埋め込む場合を考えて見ましょう。

かつては、JAVAアプレットには<applet>要素で埋め込む事が多かったのですが、今日では現行ユーザエージェントの大半が<object>要素で埋め込めるようになりました。

<div class="applet">
    <object type="application/x-java-vm" width="320" height="180">
        <param name="code" value="Applet.class" />
            (以下、適宜アプレットへのパラメータを<param>要素で)

            <img alt="ここでは、○○を実行するアプレットをご紹介しております。" src="Alternative2Applet.GIF" width="320" height="180" />
        </object>
    </div>

HTML文書に埋込まれるJAVAアプレットの場合、基本的に<applet>要素での属性記述をパラメータ記述と言う形で踏襲します。すなわち、

を持つ<param>要素を必要なだけ記述します。また、<applet>要素で記述する場合にも<param>要素を併記する場合がありますが、これらは<object>要素で埋め込む場合も全く同じ形で記述します。

また、HTML文書に埋込まれるJAVAアプレットである事を明確にするため、<object>要素には必ずtype="application/x-java-vm"属性を与えておきます。

複雑な代替テキストを持つ画像を埋め込む場合。

続いて、複雑な代替テキストを持つ画像を埋め込む場合には以下のように書けます。

<div class="graph sales">
    <object type="image/gif" data="Sales2007.GIF" width="500" height="400">
        <p>平成19年度の売り上げは以下のようになりました。</p>
        <dl>
            <dt>平成19年 4月</dt>
            <dd>平成19年 4月の売り上げは、 … </dd>
            <dt>平成19年 5月</dt>
            <dd>平成19年 5月は、 … </dd>
                …
            <dt>平成20年 3月</dt>
            <dd>平成20年 3月は、 … </dd>
            </dl>
        </object>
    </div>

画像そのものにブロックレヴェル要素的な意味がある場合、その代替テキストはインラインで表現するのは困難でしょう。

しかし、<object>要素ならブロックレヴェル要素となるような代替テキストも記述出来ます。

従って、上記のような年間売上げグラフなどもより多くの環境で見られる事が期待出来るようになります。

文書中に別のHTML文書をを埋め込む場合。

最後に、文書中に別のHTML文書を埋め込む場合を挙げておきます。

但し、<iframe>要素と違って、埋め込んだHTML文書のリンクを埋め込み元全体にまで及ぼすことは出来ませんし、また、埋め込み元から埋め込んだ文書をリンクで操作出来るようにはなりません。

<dl class="glossary">
    <dt>専門用語について</dl>
    <dd>
        <object type="text/html" data="Appendix/Glossary.html" width="30%" height="80%">
            文書中にある用語については、<a rel="appendix glossary" href="Appendix/Glossary.html">用語集</a>をご覧下さい。
            </object>
        </dd>
    </dl>

ここでは<object>要素非対応環境のために、埋め込むつもりであったHTML文書へのリンクを入れております。

関連項目。

<img>要素
HTML文書に埋込まれる画像
<embed>要素
HTML文書に埋込まれるオブジェクト(非公認要素)
<noembed>要素
オブジェクト非対応環境向代替コンテンツ(非公認要素)
<applet>要素
HTML文書に埋込まれるJAVAアプレット(排除勧告要素)
<param>要素
オブジェクトに与えるパラメータ
<map>要素
クライアントサイドクリッカブルマップ
<area>要素
クライアントサイドクリッカブルマップの領域指定
<iframe>要素
HTML文書に埋込まれるインラインフレーム

しらぎくのウェブサイト作成入門サイトマップ

ページ外へのご案内。

marguerite.site@gmail.com