画像が表示されない？原因と解決方法を教えてください

2014/04/13 14:28

このQ&Aのポイント

現在、htmlを勉強してメモ帳を使いHPサイトを作っているのですが、1つの画像だけが表示されません。四角に×のものになってしまいます。
HPのメニューバーのファイル→開く→～→のくだりでは表示されるのですが、ドキュメントの項目で表示される右側のレビュー(!?)だと「このコンピューターが差出人に識別されることを予防するため、画像がブロックされています。画像を表示するには、このアイテムを開いてください」と表示されます。
画像を別のものに変えたり、テキストを打ち直したりいろいろ足掻いてみましたが、結果は変わりませんでした。ソースコードを載せます。参考書は無く、ネットで調べて参考にしていますので間違いがあるかもしれません。

画像が表示されません

現在、htmlを勉強してメモ帳を使いHPサイトを作っているのですが、 FC2の媒体でアップロードしても1つの画像だけが表示されません四角に×のものになってしまいます HPのメニューバーのファイル→開く→～→のくだりでは表示されるのですがドキュメントの項目で表示される右側のレビュー(!?)だとこのコンピューターが差出人に識別されることを予防するため、画像がブロックされています。画像を表示するには、このアイテムを開いてくださいと表示されます恐らくこれが原因だとは思うのですがクリックしても何も起こりません画像を別のものに変えたり、テキストを打ち直したりいろいろ足掻いてみましたが結果は変わりませんでした一応ソースを載せてみます <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=Shift_JIS"> <TITLE>*****</TITLE> </HEAD> <BODY BGCOLOR="crimson"> <H1><font face="Beurk"size="7">*****</font></H1> <font face="HGP明朝L"size="4"></font><BR> <IMG SRC="sitd.gif"><BR> </BODY> </HTML> 参考書は無く、ネットで調べて参考にしていますなので変なところがあるかと思いますそして別の質問になりますがメモ帳で既に公開してあるテキストを打ち直してFC2で更新するときはすでにアップロードしてあっても再度アップロードしないと反映されませんよね？だとしたら更新するたびいくつかのファイル(メニュー等)もアップロードしないといけないのは大変ではないですか？もしかして知らないだけでこんな簡単な方法があったなんて… というような方法があったりしたら虚しくなるので知っている方がいましたら教えてくださいサイト作りを初めて4日目の超初心者なのでプロレベルの方から見ると多々用語などが間違っている箇所があるかもしれませんが(非推奨？うんぬん等) いえ、あると思いますが折角のサイト設立を目前に心が折れそうなのでどなたか解決方法を教えてください長文失礼しました

kagariya
お礼率37% (36/95)

HTML
回答数1
ありがとう数10

みんなの回答 （1）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

ORUKA1951
ベストアンサー率45% (5062/11036)

2014/04/13 19:36 回答No.1

＞現在、htmlを勉強してメモ帳を使いHPサイトを作っているのですが、　HTML(頭文字ですから必ず大文字です) 　HPサイトじゃ意味が通じません。ヒューレッドパッカード社(hp)のことじゃないと思いますが(^^)、利用する立場なら兎も角、製作立場になると「ウェブサイト」「ウェブページ」と正しく使わないと意味が通じなくなります。「ホームページに戻る」「HPに戻る( http://www8.hp.com/jp/ja/home.html )」じゃ困る。＞このコンピューターが差出人に識別されることを予防するため、画像がブロックされています。　ブラウザのトラッキング防止機能が効いているのでしょう。　画像へのパス指定を見直すこと。　　複雑な説明になるので、説明はしません。 <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=Shift_JIS"> <TITLE>*****</TITLE> </HEAD> <BODY BGCOLOR="crimson"> <H1><font face="Beurk"size="7">*****</font></H1> <font face="HGP明朝L"size="4"></font><BR> <IMG SRC="sitd.gif"><BR> </BODY> </HTML> ・・・今から始めるには、これじゃあまりに酷すぎます。 1) 必ずDOCTYPEを書かなければなりません。　HTML4.01strictだけに絞って身につけましょう。　『HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/conform.html#h-4.1 )』　まもなく勧告を迎えるHTML5は、HTML4.01strictの改訂で、HTML4.01の他のDTD、transitinal,framesetはありません。 2) <font face="Beurk"size="7"> ｆｏｎｔ要素は使えません。　HTML4.01strictにはない。transitinalでも非推奨。XHTML1.1以来廃止、HTML5にはない。 3) <font face="Beurk"size="7"> 　　<IMG SRC="sitd.gif"> 　bodyに直接は書けません。　<body>樹構造が下記ですが・・　　|-- <h1></h1> 　　|-- <font>ダメ　　|-- <img>ダメ　　|-- <br>ダメ　bodyにはブロック要素しか置けません。 4) <br>通常は使わないです。BRは【ひとつの段落でありながら強制改行が必要なとき】　HTML4.01では、住所の区切りなど　HTML5では、詩の中の折り返しなど、それ自体がコンテンツの一部であるとき　とされています。　　日本語の場合は、段落の変わり目は行間ではなく字下げで示しますからサンプルのようにスタイルシートで指定します。・・・たった数行でこれだけ深刻なミスがあるという事は参考にされているページがとってもまずいという事です。＞更新するたびいくつかのファイル(メニュー等)もアップロードしないといけないのは、大変ではないですか？　小規模なサイトでしたら、コピーペーストで書き換えて一括してFTPでアップロードします。　・ファイルを開かなくても置換できる高機能なテキストエディタなら一括置換できます。　大規模になれば、includeという機能を使います。いわゆるＳＳＩ(Server Side Includes)今は考えないでよい。 ★最初に参考にすべきサイト・・HTML4.01の仕様書の翻訳メンバーの内田さんの書かれたもの・・　⇒はじめてのWebドキュメントづくり( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ ) ★参考にすべきページ　⇒HTML 4.01仕様書( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/cover.html ) 　⇒1と2の間辺りからはじめるCSS講座( http://www6.plala.or.jp/go_west/beginner/css/ ) ★書いたらまずチェックする　⇒Another HTML-lint gateway( http://cetus.sakura.ne.jp/htmllint/htmllint.html ) 　　口うるさいくらいですが、逆にどこを直すべきかも教えてくれる。　[最低限のサンプル]HTML4.01strictです。 ★タブは＿に置換してあるので戻す。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> ＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> ＿<title>サンプル</title> ＿<meta name="author" content="ORUKA1951"> ＿<meta http-equiv="Content-Style-Type" content="text/css"> ＿<style type="text/css">  ＿</style> </head> <body> ＿<div class="header"> ＿＿<h1>タイトル</h1> ＿＿<p>このページでは・・・・</p> ＿</div> ＿<div class="section"> ＿＿<h2>質問</h2> ＿＿<p> ＿＿＿折角のサイト設立を目前に心が折れそうなので、どなたか解決方法を教えてください＿＿</p> ＿</div> ＿<div class="section"> ＿＿<h2>回答</h2> ＿＿<p> ＿＿＿誰もが通ってきた道です。＿＿</p> ＿＿<p> ＿＿＿<strong>HTML4.01strictは、</strong>プレゼンテーションに関わる物が一切ないので、このように文書構造だけ記述すればよいので<strong>とっても楽です。</strong> ＿＿</p> ＿＿<p> ＿＿＿そのかわり、スタイルシートでプレゼンテーションを指定します。スタイルシートは、HTMLで行なうよりはるかに機能が豊富ですが、その分、覚えるのは大変です。しかし、いずれHTML5の時代が来ますが、そのときにはHTMLは文書構造だけ、スタイルシートはプレゼンテーションと完全に分かれますから、今のうちにHTML4.01strictで学んでおくと効率的です。＿＿</p> ＿</div> ＿<div class="footer"> ＿＿<h2>文書情報</h2> ＿＿<dl class="documentHistry"> ＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt> ＿＿＿<dd>2013-03-03</dd> ＿＿</dl> ＿</div> </body> </html>

質問者

お礼 2014/04/13 20:44

回答ありがとうございますもう最初からダメダメでしたか…(笑)! 参考にしていたサイトはもう見るのをやめました上記のサイトを参考にさせていただきますそして一から勉強し直そうかと思います因みにチェックしてみたらマイナス310点でした迅速かつ丁寧な回答、感謝しますありがとうございましたさすがプロフェッショナルですね…!! 格好いいです。

ログインすると、全ての回答が全文表示されます。