最終更新日: 2010年5月26日

画像ファイルの扱い方

ここでは、デジタルカメラで撮影した画像ファイルなどをWebページで利用する際の基本的な手順を紹介します。最終的には、このような画像を挿入することを目的とします。

画像ファイルの用意

画像ファイルをPCで使用するには様々な方法、手順がありますが、ここでは詳細は説明しません。以下のいずれかの方法で各自、作業環境（Webページデータを保存するフォルダ）に画像ファイルを用意して下さい。

デジタルカメラで撮影した画像ファイル
- カメラとPCをUSBケーブル等で接続して取り込む。
- PCのカードスロット経由で、SDカード、メモリースティック等から取り込む。
- PCのUSB接続カードリーダ経由で、SDカード、メモリースティック等から取り込む。
携帯電話で撮影した画像ファイル
- 自分のPCメールアドレスに添付して送信する。
- デジカメ撮影時と同様の方法で取り込む。
自分で画像ファイルを作成
- ペイント等の画像描画ソフトを利用して画像ファイルを作成する。
  保存ファイル形式は、PNG、GIF、JPGとし、BMPにはしない。
外部サイトで提供されている画像ファイル
- フリー素材提供サイトのものなどは、利用条件を確認した上で利用して構わない。
  一般サイトの画像は間違っても利用しないこと。

計算機演習室には、上記手順の後にファイルをUSBメモリーにコピーするなどして持ち込んで下さい。

なお授業で作成するページについては、オリジナルの画像を利用することとしているので、上記1.～3.の方法による画像を必ず利用して下さい。

デジタルカメラで撮影した画像のサイズは、PCの画面サイズと比較してものすごく大きくなります。
試しに、撮影した画像をそのまま<img>タグを使って貼り付けた例をお見せします。

これではまともなページにならないので、サイズ変更等の画像編集が必要となります。

なお、少し前の携帯電話で撮影した画像であれば、ここまで大きくないのでそのまま貼り付けても問題ない場合があります。

ここでは、サイズ変更（縮小）、トリミングといった、Webページに画像を掲載するための最低限の画像編集について説明します。画像編集のためのソフトウェアは多数ありますが、ここでは比較的多くの人が利用でき、かつ操作が簡単なものを取り上げて紹介します。