画像が表示されない場合

ホームページに画像を入れたのに表示されない場合は、画像ファイル自体の問題ではなく、パスやファイル名、アップロード先の違いが原因になっていることがよくあります。

このページでは、画像が表示されない場合の基本的な確認ポイントをご案内します。

ご注意
パソコン上では見えていても、サーバーへアップロードしたファイル名やパスが少しでも違うと、画像は表示されません。

よくある原因

まずは、画像ファイルそのものがサーバーへアップロードされているか確認してください。

例
HTMLファイルの中で画像を表示するには、画像ファイル自体もサーバー上に存在している必要があります。

public_html/index.html
public_html/images/sample.jpg

HTMLだけアップロードして、画像ファイルをアップロードしていない場合は表示されません。

HTMLの記述と、実際の画像の保存場所が一致しているか確認してください。

例
画像が images フォルダの中にある場合

サーバーでは、sample.jpg と Sample.jpg は別のファイルとして扱われます。

ご注意
Windowsでは違いに気づきにくいですが、サーバー上では大文字・小文字の違いで画像が表示されないことがあります。

画像の拡張子が違うと表示されません。

よくある例

sample.jpg
sample.jpeg
sample.png
sample.webp

HTMLでは .jpg と書いているのに、実際のファイルが .png なら表示されません。

画像ファイル名に日本語や空白が入っていると、環境によって正しく表示されない場合があります。

おすすめのファイル名例
sample-image.jpg

画像を差し替えた直後は、ブラウザに古い画像が残っている場合があります。

上記を確認しても表示されない場合は、以下の点もご確認ください。