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

この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日目の超初心者なのでプロレベルの方から見ると 多々用語などが間違っている箇所があるかもしれませんが(非推奨?うんぬん等) いえ、あると思いますが 折角のサイト設立を目前に心が折れそうなので どなたか 解決方法を教えてください 長文失礼しました

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

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

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答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"> font要素は使えません。  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という機能を使います。いわゆるSSI(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"> <!-- body{ background-color:gray;/* bodyの背景gray */ } div.header,div.section,div.footer{/* header,section,footerの指定 */ width:80%;/* 幅はwindowの80% */ margin:0 auto;/* 上下0、左右自動 */ padding:5px; background-color:silver;/* 背景はシルバー */ } p{ margin:0;/* 日本語用に段落間のマージンを消し */ line-height:1.8em;/* 日本語は字が大きいので行間を広げて */ text-indent:1em;/* 段落で字下げ */ } --> _</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>

kagariya
質問者

お礼

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

関連するQ&A

  • html言語で背景画像を中央寄せしたい <body background="画像url"

    HTMLにてHPを作成しようとしています、 以下について教えて頂けますか? やりたい事 背景画像を上中央に固定させ、その画像の上から文章を 記載していきたい。 無い知恵を絞って色々やって見ましたが 背景画像が繰り返し表示されてしまします、 背景画像1枚の表示でそれを上中央に表示させたいのですが どのような言語を使えば良いでしょうか? <html> <head> <title> ※タイトル※ </title> </head> <body> <body background="画像のURL" bgproperties="fixed"> <basefont color="#0000ff" size="3"> <br><br><br> <h3 align="center"> <font size="7"> <b> <font color="#ff0000"><font face="フォント名"> ※ここに文章を入れます※ </font> </b> </h3> </body> </html>

    • ベストアンサー
    • HTML
  • html言語中央寄せしたい <body background="画像url"について

    HTMLにてHPを作成しようとしています、 以下について教えて頂けますか? やりたい事 背景画像を上中央に固定させ、その画像の上から文章を 記載していきたい。 無い知恵を絞って色々やって見ましたが 背景画像が繰り返し表示されてしまします、 1枚の表示で上中央に表示させたいのですが どのような言語を使えば良いでしょうか? <html> <head> <title> ※タイトル※ </title> </head> <body> <body background="画像のURL" bgproperties="fixed"> <basefont color="#0000ff" size="3"> <br><br><br> <h3 align="center"> <font size="7"> <b> <font color="#ff0000"><font face="フォント名"> ※ここに文章を入れます※ </font> </b> </h3> </body> </html>

  • HPの壁紙が入れられない

    現在、基礎からHPを作成中です。メモ帳からタグを打ってつくってます。 Win95、IE5です。 <HTML> <HEAD><TITLE>C'est La Vie</TITLE> </HEAD> <BODY BACKGROUND="画像ファイル.gif"> <font face="Comic Sans MS,century gothic"><H1>C'est La Vie</font></H1><br> <br><br><br> <font face="Comic Sans MS,century gothic">welcome!!</font><br> </BODY> </HTML> トップはこんな感じなのですが、背景に画像を指定して壁紙にすることができないのです。 その他は正常になってます。フォントも指定されたものになります。 背景を、ただ色付けするだけなら大丈夫でした。 なのにどうして、素材屋さんからダウンロードして保存した画像を 背景にするとなるとだめなのでしょう? 作成支援サイトを見ながら勉強していますが、読み返して自分のファイルと睨めっこ してみても全くわかりませんでした。 どなたかこんな初歩的な質問に答えてくださる方、何がいけないのか教えてください!よろしくお願いします。

    • ベストアンサー
    • HTML
  • 忍者ホームページの広告が表示されません。

    お世話になっています。 NINJA TOOLでホームページを作っています。 無料プランを使っているので、広告が表示されるはずですが・・・。 フレーム内で何故か表示されません。 詳しくかくと、2分割のフレームを使っているのですが、最初から何故か右フレームに画像が表示されています。そのときは、広告が表示されているのですが、左フレームのリンクをクリックすると、左フレームで表示されていた広告が消えてしまいます。コレでは、規約違反で削除されしまうので、アドバイス宜しくお願いします。 ソースは 右フレーム <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title></title> </head> <body> <p>絵<p/> <a href="画像"target="bb">イラスト<a/> <p><a href="トップ">戻る</a><p/> </body> </html> 左フレーム <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title></title> </head> <body> <img src="画像"><font size="2" color="black"><br>説<br/></font> </body> </html> です。 ※ターゲットの名前(?)は、bbでそのままです。

  • フレームページに文字が表示されなくて困ってます><

    フレームページに文字が表示されなくて困ってます>< フレームページは表示されるのですがmenu.html.htmlやcontents.html.htmlに書いた文字が表示されません どこが間違っているのでしょうか? ーーフレームページーー <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>タトル</TITLE> </HEAD> <FRAMESET cols="100,*"> <FRAME name="menu.html.html" src="file:///D:/happystyle/menu.html.html"> <FRAME name="contents.html.html" src="file:///D:/happystyle/contents.html.html"> <NOFRAMES> <BODY> <P>このページを表示するには、フレームをサポートしているブラウザが必要です。</P> </BODY> </NOFRAMES> </FRAMESET> </HTML> ーーmenu.html.htmlーー <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>タイトル</TITLE> </HEAD> <BODY> 画像置き場 </BODY> </HTML> ーーcontents.html.htmlーー <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>タイトル</TITLE> </HEAD> <BODY> 画像表示 </BODY> </HTML> というHTMLを書きました! フレームに表示させたいページのHTMLはフレームと同じフォルダに入っているのですがこれと関係ありますか? どこがおかしいのかまったくわからないです 教えてください!

  • コンピューターの画像ブロック

    参考本を見ながらHPを作っているのですが画像のアンプルを入れても 画像がアップされません。四角い枠の中に×のマークが出ます。 下記のコメントが出ます。 「このコンピューターが差出人に識別されることを予防するため、画像がブロックされています。 画像を表示するには、このアイテムを開いてください。』 ど素人が作っています。詳しく教えていただけると助かります。 ちなみにHTMLはこんな感じです。 <html> <head> <title>cokuriのアットホーム</title> </head> <body> <body bgcolor="#c0c0c0"> <h1><font color="#2A7e55">cokuriのアットホーム</font></h1><br><br> <font color="red"><font size="5">cokuriの部屋へようこそ!!</font></hont><br><br> <img src="img/main.jpg><br><br> <font color="blue">我が家の愛しいMダックスの3ワンコの日常です。<br> 心癒される写真がいっぱい!!<br> 可愛いワンコのグッズ&ショップもご紹介していきます。<br> 楽しんでいって下さい。</font><br><br><br> <hr waith="540"> <i>メッセージはこちらまで!!!</i> </body> </html> よろしくお願いいたします。

  • ページ内の画像だけを一定時間毎に自動更新させたい

    ネットワークカメラを使って、留守中の犬をモニターしています。 FTPサーバーに10秒ごとに静止画のJPGファイル(同名)が転送 されるように設定しています。 これをサイト内で公開したいと思っており、出来れば画像のみを 10秒ごとに自動更新で表示されると良いなと思っております。 ページ全体をリロードさせてしまうと、鬱陶しいことになりますので、 画像だけリフレッシュさせたいのですが、うまくいきません。 過去の質問(http://okwave.jp/qa1104885.html)を拝見し、 Iframe内に埋め込んだのですが、更新されません。 また、良回答の書き方でもうまくできませんでした・・・。 キャッシュを残させないようにもしたのですが。 この書き方では間違っていますでしょうか。 ------------- ■iframe.html ------------- <HTML> <HEAD> <META http-equiv="refresh" content="10"> </HEAD> <BODY> <img src="http://×××.××.jpg"> </body> </HTML> ------------- ■index.html ------------- <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=x-sjis"> </HEAD> <BODY> <iframe src="http://×××.××.jpg"> </iframe><br> </body> </HTML> また、別の方法でスムーズに画像だけを更新させる方法がございましたら 教えていただけないでしょうか。よろしくお願いします。

    • ベストアンサー
    • HTML
  • FC2 アップロードすると文字化けする

    FC2でサーバーを借りることができ、メモ帳で作ったHTMLファイルをアップロードしようとしているのですが、中国語みたいな文字化けをしてしまい、まったくもってサイト内で文字をみることができません。 過去の質問もみて、<head></head>の間に<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />という一文も入れたのですが、変わりませんでした。画像などを含んでいるのが悪いのかと思い、別にメモ帳でtestとだけ書き込んだHTMLファイルを作り、FFFTPからアップロードを試みたのですが、今度はファイルの読み込みに失敗しましたということで、アップロードもできない状態です。 せっかく、今までホームページを作りあげてきて、アップロードせずに、ローカルサイト内ならホームページの形を成しているというのに、悔しくてしょうがありません(泣) 現在のネット環境は、 1.インターネットは、ケーブルテレビ会社を通じての接続。 2.インターネットエクスプローラー使用。 3.メモ帳でHTMLファイルを作ったとき、unicodeで保存。 アップロードした手順は 1.FC2レンタルサーバの登録後、自分のURLを取得。 2.FFFTPをインストールし、PC内のホープページのフォルダを読み込み 3.ミラーリングアップロードを開始。(右側にあるサーバー枠にもアップロードされたファイルが無事、表示されている) 4.FC2のファイルマネージャーで確認しても、ちゃんと読み込まれている。 5.しかしHTMLファイルをプレビューしてみると、実際、アップロードされているサイトに見られるのと同じ、中国語のような激しい文字化けが見える といった感じです。 どなたか、解決法をご存知のかた、お願いします!!!!

  • ホームページ作成中。画像の表示

    初めてホームページを作成している者です。 Webサイトから商用のホームページのテンプレートをダウンロードして、HTMLとCSSで作成している途中です。(IEで確認。) 画像をテンプレートのものから自作の画像に切り替えようとしたのですが、表示されません。 画像はテンプレートの画像と同じディレクトリに入っているし、相対パスや拡張子は間違ってはないと思います。 元の画像はGIFの2.54KBで大きさは290×65です。 切り替える画像はGIFの4.67KBで大きさは290×65です。 HTML文は↓になっています。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS" /> <meta http-equiv="Content-style-Type" content="text/css" /> <link rel="stylesheet" href="base.css" type="text/css" /> <title>あなたのサイト名などお書きください</title> </head> <body> ・ ・(省略) ・ <div id="header"><h1><a href="index.html"><img src="images/logo.gif" alt="" /></a></h1></div > CSS文で関係ありそうなのは↓です。 <冒頭の関係ありそうな部分> @charset "Shift_JIS"; body { margin:0; padding:0; line-height:1.6; letter-spacing:1px; } a { color:#98534B; text-decoration:none; } a:hover { text-decoration:underline; } img { border:0; vertical-align:bottom; } <この画像の部分> div#header h1 { margin:0; padding:10px 0; font-size:2em; color:#333; } div#header h1 a { color:#9B0000; } div#header h1 a:hover { color:#D30000; text-decoration:none; } 何が表示されない原因となっているのでしょうか?

    • ベストアンサー
    • HTML
  • 1つのhtmlページにたくさんのCGIを表示したい

    1つのhtmlページにたくさんのCGIを表示したいのですができますか? "Content-type: text1/html\n\n" /* ** CGI版のhello.c(HTML仕様) */ #include <stdio.h> main(){ printf("Content-type:1/html\n\n"); /* ここから HTML でお馴染みのタグ */ <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> /* あいうえお */ "Hello C World!<BR>\n" "</BODY>" "</HTML>" } みたいなCGIを入れたいのですが。

    • 締切済み
    • CGI

専門家に質問してみよう