Section 8 : 画像を挿入する

 今まで何かが足りなかった。そう,ページを開いたときにばばーんと出てくる画像である。これを入れれば人目を引く WWW ページにぐっと近づく,はず。


 画像を表示させるためにはもちろん画像のファイルがなくてはならない。お絵かきツールで描いたものもよし,スキャナとかで取り込んでもよし,デジタルカメラで撮ってもよし。ただし,画家の絵やイラスト,芸能人の写真などは著作権や肖像権に注意しよう。現在では,WWW ページに挿入する目的の著作権フリーの絵や写真が販売されていたり,「素材集」なるサイトが厚意で画像を使わせたりしてくれるから,それを使うのも手。

 絵に,画用紙に描く絵やキャンバスに描く絵,版画などがあるように,絵を電子化されたデータにする際にもいろいろな形式がある。Windows ではビットマップ形式(".bmp" というファイル),Macintosh では PICT 形式などが身近だが,HTML に貼りつける絵は GIF形式(".gif" というファイル)が主で,ほかに JPEG形式(".jpg",".jpeg" というファイル)が扱える。これら以外の場合は変換を施さなくてはならない(ファイルの名前だけを変えても無駄だよ)。

 画像のファイルの準備が整ったとして,これを表示させる HTML を見てみよう。

<IMG SRC="(URL)">

 「ここから〜ここまで」ではなく「ここに画像を挿入」だからお気を付けを。
 また,何らかの原因で画像ファイルが読めなかったりしたときのために,SRC="..." に続けて ALT="(絵が出なかったときに代わりに表示させる文字列)" としておこう。もし,画像が読めなかったときは,ALT 以下の文字列が表示され,見ている人が何の画像だかある程度推測ができる。

 では,用意した GIFファイル "lbh.gif" を表示させる HTML を書いてみよう。

<P>文書中に<IMG SRC="lbh.gif" ALT="Let's begin HTML">のように画像が入ります。</P>

 これは,次のように出力される。

文書中にLet's begin HTMLのように画像が入ります。

 また,「絵をクリックすると指定された URL へジャンプ」させることもできる。<A HREF="...">〜</A>で <IMG ...> をはさめばOK。


解決! センター化学 I
解決! センター化学 I ◆ Z 会出版

Next : まとめ
Prev : タイトルをを入れる
Up : 目次