画像を表示する

画像ファイル

デジカメで撮影した写真やスキャナで取り込んだ印刷物、コンピュータで作成したイラストなどの画像情報をデジタル形式で処理したファイルを画像ファイルといい、「JPEG」「GIF」「BMP」「TIFF」「PNG」などさまざまな形式があります。

Webページ上で公開する場合、ファイルサイズを小さくして保存できる「GIF」「JPEG」の形式が一般的です。ファイルサイズが大きいと、画像の表示に時間がかかったり、表示されなかったりします。

また、 一般的なデジカメで撮影した画像はファイルサイズがかなり大きいため、そのままWebページに掲載することはできません。「レタッチソフト」などを用いて小さいサイズの画像に加工する必要があります。

画像の表示

Webページに画像を表示する場合以下のソースを記述します。

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

「img要素」で画像を表し、「src属性」で画像ファイルを指定します。
画像ファイルが同じ階層の“フォルダ”内にある場合は、「フォルダ名/画像ファイル」で指定し、ひとつ上の階層にある場合、「../フォルダ名/画像ファイル」で指定します。

「alt属性」で画像の代わりに表示される文字列(画像が表示されない場合に表示さたり、音声ブラウザが読み上げたりするテキスト)を指定します。
「HTML4.01」ではalt属性は必ず指定する決まりになっています。装飾のための画像であっても「 alt=""」と空値で記述しなければなりません!

例:<img src="images/umi.jpg" alt="海">
海

画像サイズの指定

画像の幅を指定する「width属性」width="幅"、高さを指定する「height属性」height="高さ"を使います。
幅・高さは、ピクセル数または%で指定します。

例:<img src="images/umi.jpg" alt="海" width="320" height="240">
(幅:320ピクセル  高さ:240ピクセル)
海

戻る