3-4

 画像表示徹底解説
   画像が出ないヒト向けの特別講座。


『答え』 どうしても画像が表示出来ない方への特別講座です。

ここまで来ても上手く画像表示が出来ないって方へ、一層詳しく解説致しますです。 上手く進んでいるヒトも復習の積りで読んでおいて下さい。 この先でトラブル発生した際に、お役に立つことでしょうから。
さてさて、上手く行かない方は概ね壊れたマス目が表示されていることでしょうね、こんな感じで。

ちゃんとタグを書いているのに、何故なんだっ!とお怒りになる前に冷静にチェックしましょう。
まず疑われるのが、HTML文と画像データの置き場所です。現在のHTML文(文書名がabc.htmlとします)は、シンプルに下記のような記述としましょう。

<HTML>
<BODY bgcolor="#ffff00">
これがお気に入りの画像で〜す。<br>
<img src="abc.gif">
</BODY>
</HTML>

出来るだけ簡単に理解したいって方は、これでも結構です。

<img src="abc.gif">
このHTML文は当道場の最初の項目で解説の通り、デスクトップのmyHPという名前のフォルダに入っているかどうかの確認です。
デスクトップを見て、こんなフォルダが出来ていますか。
※ゴミ箱は関係ないのですが、デスクトップの意味を理解戴く為に表示させています。

さてさて、このmyHPフォルダを開けてみましょう。そうすると、HTML文と画像データが見つかる筈です。


もし、abc.htmlというHTML文は見つかるけれど、abc.gifが見えない場合は画像データの取り込みミスか、もしくは置き場所の問題です。 このフォルダの中にHTML文(abc.html)と画像データ(abc.gif)が並んで見えるように画像データを移動させて下さい。 これで解決する場合が最も多いようです。

ついでにタグで書いた画像名と実際の画像データ名もチェックしましょう。上記のように、HTML文で表示命令出した画像はabc.gifです。 myHPフォルダに見える画像データが、abc.jpgと拡張子が違っていたり、abb.gifと名前のタイプミスがあったり、またabc.GIFといったように 大文字小文字の違いもチェックしましょう(大文字小文字は問題ない場合がありますが、将来的にサーバー転送した場合にトラブルの原因に なるケースがあります。一致させておくクセを付けましょう)。

ここまでチェックしても上手く行かない場合は、いよいよ画像データが怪しいということになります。
道場で紹介している「IrfanView32」を活用しましょう。
インストールや基本操作は下記のページから進んで下さい。
●IrfanView32のページ●
面倒かもしれませんが、IrfanView32は高機能なフリーウェア(無料)ですので、インストールしておいて決して損はありません。

インストールしたIrfanview32で、表示させたい画像を開いてみましょう。拡張子の間違いはこれで確認出来ます。次のような画面が出たら、 拡張子の間違いです。


問題が発見されたので、喜んで「はい」を押しましょう。正しい拡張子に設定してくれます。
画像が展開されたら、何も加工せずに 「名前を付けて保存する」に進みます。そうすると下記のような画面が出ますので、myHPフォルダの中に拡張子.gifで保存されるように 設定します。これでOKです。


HTMLのようなテキスト文書は拡張子を名前の変更で対応して問題ありませんが、画像データの場合に名前の変更で拡張子を修正することは 不可なのです。画像の拡張子は画像データで変更するということを覚えておいて下さい。

さてさて、これで問題解決した筈です。もう一度、チェック事項を列挙致します。
  1. HTML文と画像データが同じフォルダに入っているかどうか
  2. HTML文で指定した画像名と実際の画像データ名が一致しているかどうか
  3. 画像データの拡張子が正しいのかどうかを画像ソフトでチェックする
  4. 何よりもHTML文のタグのスペルが正確に書かれているかどうか
どうしても上手く行かない場合は、書かれたHTML文と画像データをメールに添付してお送り下さい。こちらでチェック致しますので。

質問メール  OZ道場メニュー