夕暮れの休憩所～画像が表示されない

画像が表示されない

[トップページへ戻る]

サーバーにファイルを転送してみて、いざ自分のホームページを見たけれども、画像が表示されていない！　画像の変わりに×印になっている！

焦らなくても大丈夫です。これは良くある失敗です。原因はいくつか考えられますが、下のチェック事項を一つ一つ確かめれば、何が原因かわかると思います。順番にチェックしていきましょう。

画像を貼り付けるには？

詳しい説明は、HTML解説サイトやソフトの説明書に譲ります。説明書の中に必ずどこかに載っているはずですので探してみましょう

なお、画像を表示させるタグは
<img src="画像のファイル名">
です。また、背景画像を表示させる方法は、一番簡単なのは<body>タグの中に指定する方法です。
<body background="背景画像ファイル名">

ホームページ作成ソフトを使っている場合は、画像を挿入する方法がどこかにあるはずです。ヘルプなどを見てみましょう。

画像の保存形式は大丈夫？

JPEG(JPG)、GIF、PNG以外の形式（ファイルの種類）では表示されないことが多いです。JPEG、GIF、PNGへのファイル変換は画像加工ソフト、ペイントソフトなどで行いましょう。

それぞれ、どのように特性が違うのかはとほほのWWW入門さんのサイトの『画像(GIF/JPEG)』の項目がわかりやすいと思います。

画像の準備が出来たかどうかは、ブラウザーで画像ファイルを開いてみて（IEならファイル→ファイルを開く、NNならファイル→開く）表示されるかでチェックできます。もしもブラウザーで上手く画像が表示されないときは、保存形式が間違っているかもしれません。いろんなファイルの種類で保存して見ましょう。

ファイルサイズは小さければ小さいほど良いです。アイコンやボタンなどのファイルならば１０KB以内、大きい画像なら５０KB以内を目安にすればとりあえずいいでしょう。

※参考サイト：とほほのWWW入門　（とほほの画像入門）

画像ファイル名は大丈夫？

全角（日本語）のファイル名では上手く表示されません。また空白や()[]などの記号は使用できません。使うことが出来るのは、半角英数字(a-zA-Z0-9)と一部の記号(ハイフン"-"とアンダーバー"_")だけだと思っておきましょう。　また画像名は拡張子(".jpg ",".gif"など）まで記述しましょう。

○ image.gif　 flower_002.jpg
×ｉｍａｇｅ．ｇｉｆ　ｆｌｏｗｅｒ＿００２.jpg　（全角英数字は使えません）
×画像.gif　（日本語は使えません）
×image(2).gif　（括弧などの記号は使えません）
×flower 002.jpg　（空白は使えません）

ファイルを入れているフォルダの名前も半角英数字にしておいた方が無難です

画像の転送は大丈夫？

FTP転送には『テキスト（アスキー）モード』という方法と『バイナリーモード』という方法があります。画像などはバイナリーモードで転送する必要があります。FTPソフトによって設定がありますが違いますが、画像はバイナリーモード（生データ）で転送しましょう。なお、多くのFTPソフトでは自動的に認識してくれますので、『自動認識（変更）』という項目があればそれを選択しておきましょう。

FFFTPの場合は『B』とか『A』とか書いてあるのがそれぞれ『バイナリーモード』『アスキーモード』という意味になります。『A』と『B』が重なっているボタンを選択すると自動的にソフトが認識してくれます。

画像のみを表示した時（画像のURLを直接表示、ジオシティーズのファイルマネージャーなら画像ファイルの横の『表示』をクリック）に、画像が正常に表示されなければここまでの手順をもう一度チェックしましょう。

画像のURL直接表示というのは、たとえば↓の画像の場合は

../../www.geocities.co.jp/SiliconValley-Sunnyvale/7395/flower.png

が画像のURLとなります。

サーバによっては一度に転送できるファイルサイズの制限をかけてある場合もあります。サーバの説明・ヘルプをよく読みましょう。 FTP転送が上手く行かないときのチェック事項はこちら。

HTMLファイルだけ転送したんじゃダメなの？

ホームページ作成ソフトの発達・普及とともに、ホームページというのは

「１つのファイルに文字も画像も何もかもが入っている」

と誤解している方が増えているような印象を受けます。特にソフトのファイル転送機能が向上しボタン一つで何もかもを自動的にやってくれるようになったためか、トラブルさえなければ自分が何のファイルをサーバーに転送しているのかわかっていない場合もあるようです。

あなたはホームページ作成の作業を「１枚の紙に文字を書き込んだり画像をペタペタ貼り付けたりするようなもの」と思っていませんか？そしてファイルを転送するというのは「その１枚の紙をサーバーに送ること」と思っていませんか？

実際に私たちが見ている「ホームページ」というものは、「文字や画像が貼り付けられた1枚の紙」というよりも「何枚も重なった透明シートの集まり」というイメージになります。

『HTMLファイル』という透明シートには、文字の部分とかどこに何の画像を表示させるのかという指示だけが書いてあります。『画像ファイル』や『音楽ファイル』は、一つ一つ別の透明シートに書いてあるのです。そしてブラウザーで表示さえるときに、『HTMLファイル』シートを元に各『画像ファイル』シートやその他のシートを何枚も重ねて、やっと文字と画像が一体化して見えるのです。

ホームページを見ると１つのファイルしかないように見えるかもしれませんが、実は複数のファイルが積み重なってまるで１つのファイルのように見えているんですね。ですから、HTMLファイル以外に画像ファイルなど一緒に表示させる予定のファイルを転送する必要があるのです。

<img>タグの書き方が間違っていませんか？

HTMLファイル内のimgタグの記述は正確ですか？

【悪い例】
<img src="file:///C|/xxx.jpg">
<img src="C:\image\xxx.jpg">
↑ローカルアドレスになっているので駄目。
【良い例】
<img src="xxx.jpg">
<img src="./xxx.jpg">
<img src="image/xxx.jpg">
<img src="http://www.xxx.xx/image/xxx.jpg">

また大文字と小文字は区別されます。 IMAGE.JPGをimage.jpgと記述すると認識しない時があります。大文字と小文字があっているかも確認しましょう。

ホームページ作成ソフト（オーサリングツール）を使っている場合は、一度HTMLファイルと画像ファイルをパソコン内の同じフォルダに保存しましょう。同じフォルダにおいた後に画像指定をやってみてください。そうするとうまくいくことが多いようです。

サーバーの容量はまだ充分に空きがありますか？

時々、サーバーの容量一杯まで使ってしまってアップロードできないことがあります。特に上記のいずれを確認しても問題がない場合や、今までうまく画像が転送できていたのに急にできなくなった場合。また、画像を転送してもファイルサイズが『０』になってしまう場合は、容量が満杯のことが多いです。

容量がどれくらい残っているかは、サーバーの説明・ヘルプやFAQ（よくある質問）などを見てみましょう。FTPソフトなどでファイルの総サイズをチェックすることもできます。

他にもIEなどでは、一時ファイル（ツール→インターネットオプション）を削除すると上手く行ったりすることがあるようです。またフォントキャッシュが壊れていたために不具合が起きたという例もありました。

ジオシティーズなどでは、ディレクトリの階層に制限があったり、またYahoo!会員用のジオシティーズでは他のサーバーから画像などは呼び出せないようになったりしています。

ここまで来ても問題が解決しないときは、サーバーなどに直接問い合わせてみることをお勧めします。

画像について質問したい

いろいろ言われてもわかんない。質問したい！！という方へ。

ここまで見てもらったら分かりますように、画像が表示されないときの原因はいろいろあります。質問するにしても「画像が表示されません。どうして？教えて！」といわれても、答えようがありません。

無理に専門的な言葉を使おうとしたりする必要はありません。あなたがどんな操作をしたのかを、そのまま自身の言葉で丁寧に詳しく書けばOKです。

[前へ|トップページへ戻る|次へ]

夕暮れの休憩所～サイト作成FAQ