HPのソースをそのまま貼り付けたとき、そのHP通りにならないのはなぜでしょうか？

Question

htmlでホームページを作りたいのですが、最初から自分ですべて作り上げるのは無理だと思ったので、あるHPを参考に作ることにしました。
そこで、「そのHPのソースを表示する→それをコピーして貼り付ける→貼り付けたソースをいじって自分のHPにする。」
という手順で作ろうと思ったのですが、ソースからコピーしたものを自分のHP上で表示しても、そのHP通りになりません。
詳しく言うと、文字などはそれ通りになっているものの、枠や線などといったHPを形作っている部分が表示されないのです。
なぜでしょうか。解決方法をご存知の方がいらっしゃいましたら教えて下さい！

それと、上記のようなHPの作り方をして問題ないでしょうか。
内容や写真などは全く別のものにしますし、テンプレートとして使用するつもりもございません（あくまで参考にしたいだけなのですが…）。

mamegoma3 · Accepted Answer

使ったことが無いので出来るかわかりませんが、TeraPadで変換できるそうです。
設定箇所は下記のページを参考にShift-JISで保存するように設定してください。
http://www.mlab.im.dendai.ac.jp/~yamada/web/tool/terapad/

mamegoma3 · Answer

mamegoma3です。
それは文字コードが違うからです。
下記に出ていますので参考にしてみてください。
http://oshiete1.goo.ne.jp/qa22367.html

ORUKA1951 · Answer

＞提示してもらったHPで検査をしようとしたのですが、対象のHPのアドレスに漢字が入っていて、検査できないようでした・・・。
　URLに日本語は含められないです。
　ですので、その場合のURLは、実際にはURLエンコードされているはずですから、URL欄をクリックして選択状態にして、それを貼り付ければ、URLエンコードされたURLがでてくるはず。もしうまく行かなければ、ブラウザを変えてみてください。

mamegoma3 · Answer

mamegoma3です。
そのソースのＵＲＬが、たとえばｈｔｔｐ：//ｗｗｗ/xxx.xx/ｘｘ.htmlならｈｔｔｐ：//ｗｗｗ/xxx.xx/style.cssをＵＲＬに打ち込めばソースが表示されると思います。これをコピーしてstyle.cssでファイルを保存してください。ｘｘ.htmlとstyle.cssを同じフォルダ（階層）に入れれば同じレイアウトで見られるとおもいます。

ORUKA1951 · Answer

原因はページのプレゼンテーションがスタイルシートで行われているためでしょう。
　サイト自体をファイルメニューから(完全)保存して見ないとだめですね。

　確かに優れたサイトを見て、その書き方を学ぶのはとても役立ちますが、あまり現実的でもありません。
・内容が異なるためそのまま流用できない
・文章・画像等が多い場合、それを書き換えるのが大変
・見栄えはよくても、正しいものではない。
　---W3Cの勧告にあっていない、言い換えればWEB標準でないものが大多数

　そのためには、まず、そのサイトを下記検証システムでチェックしてみること
HTMLのチェック
The W3C Markup Validation Service ( http://validator.w3.org/ )
Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint.html )
CSSのチェック
W3C CSS 検証サービス ( http://jigsaw.w3.org/css-validator/ )
　また、ブラウザがFirefox( http://mozilla.jp/firefox/ )なら、拡張機能(アドオン)のJSView ( https://addons.mozilla.jp/firefox/details/2076 )，Mozilla Japan - Firefox 用アドオン - Html Validator ( https://addons.mozilla.jp/firefox/details/249 )、Firebug ( https://addons.mozilla.jp/firefox/details/1843 )などでの評価も出来ます。

　すくなくとも、これらで好評かなものでないと、害にはなっても役には立たないでしょう。

　それよりも、ネット上に色々あるテンプレートを使うほうがよいでしょう。
たとえば
現実的な記述の為の XHTML1.1 入門 ― MAYAH.JP ( http://mayah.jp/article/2002/xhtmlintro )
　→HTML 文書作成例 ( http://mayah.jp/article/2002/strict )
　　→完成品 ( http://mayah.jp/resources/2008/09/dhiblihtml.txt )
とか、

mamegoma3 · Answer

文字が表示されて、レイアウトや文字の大きさなどが違うのでしたらスタイルシートが使われています。

ソースの上のほうに
<link href="common.css" rel="stylesheet" type="text/css">
みたいな表記があれば、ｈｔｔｐ：//ｗｗｗ/xxx.xx/common.css　の内容もコピーしてないと正しく表示されません。
<link href="css/common.css" rel="stylesheet" type="text/css">
のように別の階層にある場合には、cssというフォルダを別につくり、そこにcommon.cssというファイル名でソースを貼り付けてください。

まったく同じものをアップしないで、参考にして自分なりに変更してホームページを作るのは問題ないと思いますよ。

nori_007 · Answer

スタイルシートを利用している可能性が有ります。
スタイルシートが外部ファイルの場合、単にコピーだけでは入手出来ません。

ホームページの制作に関しては、他の人ソースを参考にして制作するのは良いと思いますが、是非ともオリジナルのホームページに進化させてください。

HPのソースをそのまま貼り付けたとき、そのHP通りにならないのはなぜでしょうか？

使ったことが無いので出来るかわかりませんが、TeraPadで変換できるそうです。

mamegoma3です。

＞提示してもらったHPで検査をしようとしたのですが、対象のHPのアドレスに漢字が入っていて、検査できないようでした・・・。

mamegoma3です。

原因はページのプレゼンテーションがスタイルシートで行われているためでしょう。

文字が表示されて、レイアウトや文字の大きさなどが違うのでしたらスタイルシートが使われています。

スタイルシートを利用している可能性が有ります。

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

　原因はページのプレゼンテーションがスタイルシートで行われているためでしょう。