W3G

イメージを貼り付ける

<img src="画像ファイルのURI">

img要素は指定した部分にイメージ（画像）を貼り付けるインライン要素です。src属性は表示させる画像ファイルの所在を URI で指定します。一般的な画像のファイル形式には GIF形式（拡張子：".gif"）, JPEG形式（拡張子：".jpg"、または "jpeg"）, PNG形式（拡張子：".png"）などがあります。たとえば、"image.gif" という画像ファイルがあるとすると、その画像ファイルを表示したい指定部分に "<img src="image.gif">" のように記述します。なお、img要素は内容をもたない空要素なので終了タグはありません。

登場要素の詳解

• img要素

<img src="画像ファイルのURI" alt="代替テキスト">

<img src="画像ファイルのURI" width="90" height="90">

<img src="画像ファイルのURI" border="5">

<img src="画像ファイルのURI" align="left">

<img src="画像ファイルのURI" vspace="25" hspace="25">

<img src="画像ファイルのURI" align="right">
イメージの後に続くテキストに回り込む指定がされている場合に
<br clear="all">
を指定することで回り込みを途中で解除することができます。

音声・動画データを埋め込む

<embed src="音声・動画データのURI">
<noembed>Macromedia Flash Player が必要です。</noembed>

embed要素は音声や動画データを文書内に埋め込みます。UA にプラグイン（追加機能を提供するプログラムのこと）を追加することで、埋め込まれたデータを表示することができます。Netscape Navigator 2.0（Netscape の前身）の時に独自に採用された機能ですが、Netscape Navigator 2.0 のリリース後すぐに Internet Explorer 3.0 でも採用され、現在では主要ブラウザをはじめとした多くの UA が embed要素に対応しています。よく用いられるデータには、Flash（拡張子：".swf"）, MIDI（拡張子：".mid"）, Quick Time（拡張子：".mov"）, Shockwave（拡張子：".wav"）, AVIムービー（拡張子：".avi"）, MPEG（拡張子：".mpg"）等があり、これらのデータを再生するためのプラグインはすべて無料で提供されており、簡単に入手できることから embed要素はよく利用されています。

src属性は表示させるプラグインデータを指定する属性で、値にはデータの所在を URI で指定します。たとえば、"sample.swf" という FLASHファイルの場合、これをページの埋め込みたい部分に "<embed src="sample.swf">" と記述します。なお、embed要素は内容をもたない空要素なので終了タグはありません。

また、embed要素に対応していない環境や必要なプラグインのダウンロード先へのリンクなどを明記しておくのに、音声・動画データのもつ情報の代替内容として noembed要素を合わせて指定することもできます。noembed要素も、Netscape Navigator 2.0 の時に採用された独自機能ですが主要視覚ブラウザはすべて対応しています。ただし、W3C の策定した仕様では、embed要素の代わりに、HTML3.2 の規格から正式に仕様に取り入れられている object要素を使用することが推奨されています。 しかし、object要素はUA側のサポートが不完全なため、embed要素と組み合わせた状態で使うのが現実的です。

embed要素には、ムービーデータの表示サイズ、並び位置、自動再生の有無の指定など様々なオプションが用意されています。

<embed src="音声・動画データのURI" width="300" height="250">

<embed src="音声・動画データのURI" align="right">

<embed src="音声・動画データのURI" autostart="false" loop="true">

<embed src="音声・動画データのURI" hidden="true">

関連

• embed要素
• noembed要素
• object要素

効果音（バックグラウンドミュージック）の設定

<bgcound src="サウンドファイルのURI"
balance="0" volume="-1000" loop="infinite">

bgsound要素はBGM（背景音楽）を設定し、ページが読み込まれると、指定されたサウンドファイルを再生します。Internet Explorer 2.0 の時に独自に採用された機能で、対応しているのはInternet Explorerのみです。

src属性は再生するサウンドファイルの所在を URI で指定します。指定できるサウンドファイルのデータ形式には、AIFF, AU, MIDI, WAVE などがあります。その他のオプションには以下のようなものがあります。

• balance属性はステレオ再生する場合の左右の音量バランスを指定します。値は、"-10000" から "10000" までの整数で指定します。"-10000" で左側のみ、"10000" で右側からのみステレオが再生されることになります。
• volume属性は音量を設定する属性で、値は "-10000" から "0" の整数で指定します。"-10000" で最小、"0" で最大音量になります。
• loop属性は、再生回数を指定する属性で、値には整数で回数を指定するか、"infinite" のキーワードで無限に繰り返すかの指定をおこないます。

bgsound要素はブラウザの独自機能のため W3C の策定した仕様では、bgsound要素の代わりに、HTML3.2 の規格から正式に仕様に取り入れられている object要素を使用することが推奨されています。

関連

• bgsound要素

オブジェクト（イメージ・ムービー等）を配置する

<object data="オブジェクトのURI" type="オブジェクトのMIME"
align="left" width="150" height="100" vspace="5" hspace="5">
object要素非対応環境のための代替内容</object>

object要素は、イメージ（image）、サウンド（sound）、ムービー（movie）といったオブジェクト全般を配置する要素で、これまでに紹介してきた img要素, embed要素, bgsound要素などHTML文書内に埋め込むオブジェクトに関する機能を包括する要素です。開始タグの "<object>" と終了タグの "</object>" の間には、何らかのトラブルでオブジェクトが表示できない場合や音声出力・点字出力などの非視覚環境、UA がそのオブジェクトの再生に対応していない、あるいは表示しない設定にしている環境において、そのオブジェクトの表現する情報の代替となる内容を指定します。

現状では object要素に対する UA のサポートが不完全なため、embed要素などと組み合わせた状態で使用されています。HTML4.01においてはembed要素は公認されていない機能ですが、HTML4.01の後継規格であるHTML5では、embed要素は非推奨属性ではなく仕様として公認されているため、今後廃止になることもなければ、UAのサポートがなくなることもありません。このようにembed要素に関しては例外となりますが、本来は、これから登場するかもしれない未来の環境でも利用できるウェブページ作りを目的とするのであれば、今後の対応がどのようになるかわからない非推奨要素や非推奨属性、さらにはブラウザの独自機能を使うことはおすすめできることではないということを理解しておいてください。

object要素のdata属性は配置（実行）するオブジェクトファイルの所在を URI で指定します。type属性はdata属性で指定されたオブジェクトの MIMEを指定します。これはオブジェクトの MIMEを UA がサポートしていない場合に、指定されたオブジェクトを実行する前に事前にデータをロードすることのないように UA に働きかけます。width属性, height属性はオブジェクトの横幅と高さを指定します。vspace属性, hspace属性はオブジェクトと周りの内容との間に余白（マージン）を設けます。vspace属性が左右, hspace属性が上下の余白を指定します。なお、vspace属性, hspace属性は非推奨属性のため、CSS の marginプロパティで指定することが推奨されています。

その他にもobject要素には次のような属性があり、オブジェクトに関する詳細な設定が可能です。詳しい解説は object要素（HTML辞典）を参照してください。

archive

オブジェクトに関連づけられているアーカイブの URI を示します。 アーカイブとは、複数の オブジェクトのファイルを 1つにまとめた圧縮ファイル（書庫ファイル）のことです。 このアーカイブを事前に読み込んでおくことで、プログラムの起動時間を短縮させ、オブジェクトの動作効率の向上につながります。 複数指定する場合は、半角スペースで区切って指定します。

border

オブジェクトの周りに境界線を表示させます（border属性は非推奨属性のため、CSS の borderプロパティで代替することが推奨されています）。

classid

Javaアプレットの classファイル（.class）を classid="java:xxx.class" の形式で指定したり、ActiveX コントロール（Windows版Internet Explorer のプラグイン）のクラスID（識別番号）を classid="clsid:クラスID" の形式で指定します。data属性と併用・代用が可能です。

codebase

archive属性, classid属性, data属性で指定された相対URI の基準となる URI を指定します。codebase属性の指定がない場合は、object要素が含まれるウェブページの URI が基準URI となります。

codetype

classid属性で指定されたオブジェクトの MIMEを指定します。指定されたオブジェクトを実行する前に事前に、その UA で実行可能かどうかの判断をつけるように UA に働きかけます。

declare

オブジェクトを宣言するだけで、プログラムは実行前の待機状態になります。 つまり、ページを読み込んだときに自動的にオブジェクトを実行しなくなります。 そして、declare属性と id属性を組み合わせることで、ユーザの操作によってオブジェクトを実行する仕組みを作ることができます（現状では declare属性に対応している UA はありません）。

name

object要素がフォームのコントロール部品である場合に、連携させるために名前を指定します（現状では name属性に対応している UA はありません）。

standby

オブジェクトのプログラムをダウンロードしている待ち時間に表示するメッセージを指定します（現状では standby属性に対応している UA はありません）。

usemap

イメージマップとの関連づけをおこなう際に指定します。値にはハッシュ（#）を前置し「usemap="#イメージマップ名"」という形で map要素の name属性や id属性の値に指定されているイメージマップ名を指定します。

なお、よく利用するデータの MIMEには次のようなものがあります。

application/x-shockwave-flash

Flash Shockwaveファイル
Flash Videoファイル

image/gif

GIF画像ファイル

image/jpeg

JPEG画像ファイル

image/png

PNG画像ファイル

audio/midi

MIDIサウンドファイル

video/mpeg

MPEG映像ファイル

video/x-msvideo

Microsoft AVIファイル

application/java

JAVAアプレットファイル

登場要素の詳解

• applet要素
• bgsound要素
• embed要素
• img要素
• object要素
• map要素