HTMLで画像が表示されない

Question

前提・実現したいこと

ホームページの画像を表示させたい。

PC：Mac
使用ソフト：FileZila
編集：テキストエディット

HTMLに関して初心者です。ネット上でも探しましたが結局分からず、相談出来る相手もいなく此方にすがる思いで初めて投稿させていただきます。
情報など足りないものがありましたら指摘の方宜しくお願い致します。

本題です。
画像がどうしてもホームページに反映されません。
青い四角に？マークがあり、画像を開くと404 File Not Foundの画面が表示されます。

ただ普通に表示させられれば良いのですが、どうしても反映されません。
(トップページでは画像は簡単に表示されるのですが、サブページでは反映がされません)

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

ソースコード

試したこと

画像をアップロードしたファイルの確認
手打ちで打ち込むと画像は出てくるのでサーバー上に画像はアップロードされている。
コードの確認
<img src="_src/(ファイル名)/01.jpg”>

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Comments

[m.ts10806]

>手打ちで打ち込むと
何をどう打ち込んだのでしょうか。

[dit.]

実際のコードも<img src="_src/(ファイル名)/01.jpg”>でしょうか？最後のクォーテーションが全角になってます。
質問に記述する際に全角になった場合には指摘を無視してください。

Answer 1

teratailの検索機能を使うと結構この手の問題はでています。
[画像 表示されない tag:HTML sort:created-desc] の検索結果： 1597件

「解決済み」のみだと下記
[画像 表示されない tag:HTML is:accepted sort:created-desc] の検索結果： 1134件

大抵は下記のどれかです

• HTMLに指定した画像のパスが間違っている
• 指定場所に画像がない（またはアップロードされていない）
• 画像が破損している
• キャッシュ

<img src="_src/(ファイル名)/01.jpg”>

(ファイル名)が何のことか分かりませんが、通常はそこは「フォルダ名」であるべきで、
この指定の仕方だとHTMLと同じ階層にある_srcフォルダ内の(ファイル名)フォルダ内にある01.jpgを見に行っています。

あと 01.jpg のあとの”は一般的にHTMLでも用いられる二重引用符"ではないように思います。

Comments

[dit.]

「サブページでは」と質問にあるところから、「パスが間違っている」が一番怪しいと思っています。

[m.ts10806]

おそらくそうですね。静的ページを作っているときによくある現象です。

[dit.]

階層違いではなかったので私の思っている「パスが間違っている」とは違ったようですね…。

[退会済みユーザー]

ご指摘の方ありがとうございます。此方で大丈夫でしょうか？

ご指摘の通りパスが見事に間違っておりました。<img src="_src/(ファイル名)/01.jpg”の「”」をちゃんと「"」に直した所無事反映されました。
自分の目では本当に気付けなくて、本当にありがとうございました。
これからはちゃんとパスの確認をしたいと思います。

[m.ts10806]

コードの書き方も気を付けると良いかもしれませんね
1.src=
2."
3.パス
4."
よりも
1.src=
2.""
3.""内に画像パス
とすると間違いなく囲えます。
不意に選択されて全角に変換される可能性もありますが、
パスって半角しかないのですし、全角を打つ時って文章くらいしかないので、そこはほぼ常時IMEモード半角にしておくと良いかなと。

[dit.]

なんとなくそのうちスペースの半角全角にも泣きそうなので、今のうちから気をつけておいて下さい。
半角全角スペースが可視化できるエディタやフォントを使うといいです。

Answer 2

解決した場合此方でよろしいのでしょうか…？

本当にありがとうございました！ご指摘の通りパスが見事に間違っておりました。<img src="_src/(ファイル名)/01.jpg”の「”」をちゃんと「"」に直した所無事反映されました。
全然気づかなかったので本当に、本当にありがとうございました！

Comments

[m.ts10806]

「質問するときのヒント」読んでください。
https://teratail.com/help/question-tips#questionTips4-2
>解決したら、どのアドバイスを元にどのように解決したのかを「回答へのコメント」や「質問への追記」で書き残し、回答してくれたユーザーへのフィードバックをしましょう。

回答として投稿するのは使い方としては違いますね。