プログラミングで暮らしをハック
ITで暮らしを便利にするブログ
Web制作のノウハウ

【エラー対処】画像が表示されない時

趣味でWeb制作をやっています。

エラーの解決メモです。

<img src=”○○.jpg”>と指定しても、画像が表示されない時の対処方法についてご紹介します。

 

画像が表示されない時

imgタグでsrc=を指定しても画像が表示されない時は、以下の2点を確認してみてください。

  • 画像のファイル名が合っているか?
  • PNGがpngになっていませんか?

pngとPNGは別物

 

拡張子は、大文字と小文字が別物として認識されます。

確認してみてください。

 

別の画像が表示されてしまう

画像のファイル名を変更したのに、画像が変わらない時ってありませんか。

 

そんな時は、キャッシュを消去すると解決するかもしれません。

キャッシュとは、ページを速く表示するために、パソコンが記憶しているデータのことです。

一度訪れたWebページのデータ保存しておくことで、表示を速くしようとするパソコンの機能です。

 

このデータが残っているために、画像のファイルを変更しても、前の画像から変わらない、という現象がおこることがあります。

 

・キャッシュの消去方法(GoogleChrome)

GoogleChromeのキャッシュの消去方法をご紹介します。

Webページの上で「右クリック」します。

「検証」を選びます。

ブラウザの「更新アイコン」を右クリックします。

「キャッシュの消去とハード再読み込み」をクリックします。

これでキャッシュが消去できます。

すると、新しい画像が表示されていないでしょうか?

 

今日のまなび

Web制作時のエラーの解決法についてご紹介しました。

まとめると、

  • pngPNGは、別物!
  • 画像が変わらない時は、キャッシュを消去してみること。

 

それでは、また!