プロが教えるわが家の防犯対策術!

htmlでホームページを作りたいのですが、最初から自分ですべて作り上げるのは無理だと思ったので、あるHPを参考に作ることにしました。
そこで、「そのHPのソースを表示する→それをコピーして貼り付ける→貼り付けたソースをいじって自分のHPにする。」
という手順で作ろうと思ったのですが、ソースからコピーしたものを自分のHP上で表示しても、そのHP通りになりません。
詳しく言うと、文字などはそれ通りになっているものの、枠や線などといったHPを形作っている部分が表示されないのです。
なぜでしょうか。解決方法をご存知の方がいらっしゃいましたら教えて下さい!

それと、上記のようなHPの作り方をして問題ないでしょうか。
内容や写真などは全く別のものにしますし、テンプレートとして使用するつもりもございません(あくまで参考にしたいだけなのですが…)。

A 回答 (7件)

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


設定箇所は下記のページを参考にShift-JISで保存するように設定してください。
http://www.mlab.im.dendai.ac.jp/~yamada/web/tool …
    • good
    • 1

mamegoma3です。


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

確かにスタイルシートの方の文字コードが違うようです!
ですが「Shift-JISで再度読み取り」という動作をしても、文字コードはUTF-8(N)のままです。
なぜ変わってくれないのでしょう…。

お礼日時:2009/03/21 13:38

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


 URLに日本語は含められないです。
 ですので、その場合のURLは、実際にはURLエンコードされているはずですから、URL欄をクリックして選択状態にして、それを貼り付ければ、URLエンコードされたURLがでてくるはず。もしうまく行かなければ、ブラウザを変えてみてください。
    • good
    • 0
この回答へのお礼

ありがとうございます!
それでできました^^

お礼日時:2009/03/21 10:18

mamegoma3です。


そのソースのURLが、たとえばhttp://www/xxx.xx/xx.htmlならhttp://www/xxx.xx/style.cssをURLに打ち込めばソースが表示されると思います。これをコピーしてstyle.cssでファイルを保存してください。xx.htmlとstyle.cssを同じフォルダ(階層)に入れれば同じレイアウトで見られるとおもいます。
    • good
    • 0
この回答へのお礼

ありがとうございます!
その方法でソースがわかりました。

それから何度もすいません。
スタイルシートを一緒に保存したところ文字化けしてしまいます。
保存する場所が悪いのでしょうか。

お礼日時:2009/03/21 10:12

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


 サイト自体をファイルメニューから(完全)保存して見ないとだめですね。

 確かに優れたサイトを見て、その書き方を学ぶのはとても役立ちますが、あまり現実的でもありません。
・内容が異なるためそのまま流用できない
・文章・画像等が多い場合、それを書き換えるのが大変
・見栄えはよくても、正しいものではない。
 ---W3Cの勧告にあっていない、言い換えればWEB標準でないものが大多数

 そのためには、まず、そのサイトを下記検証システムでチェックしてみること
HTMLのチェック
The W3C Markup Validation Service ( http://validator.w3.org/ )
Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint. … )
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 )
とか、
    • good
    • 0
この回答へのお礼

ご返答ありがとうございます!

提示してもらったHPで検査をしようとしたのですが、対象のHPのアドレスに漢字が入っていて、検査できないようでした・・・。
アドレスに日本語を入れることって問題ないのでしょうか…?

お礼日時:2009/03/20 12:30

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


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

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

ご返答ありがとうございます!

ソースを見たら<head></head>間に
<meta http-equiv="content-style-type" content="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
と使われていました。

この場合、私のパソコンにはスタイルシートのファイルが無いわけですから、参考にしたいHPのようには出来上がらないということですよね。
ということは、どうやら私が参考にしたかった部分というのはスタイルシートの部分だったようです。
例のソースからスタイルシートの部分の作り(?)は見ることができないのでしょうか?できないのであれば、それに似たスタイルシートのテンプレートを探せばいいわけですよね。

お礼日時:2009/03/20 12:18

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


スタイルシートが外部ファイルの場合、単にコピーだけでは入手出来ません。

ホームページの制作に関しては、他の人ソースを参考にして制作するのは良いと思いますが、是非ともオリジナルのホームページに進化させてください。
    • good
    • 0
この回答へのお礼

ご返答ありがとうございます!
スタイルシートというものがあるんですね。
知識不足でした…。スタイルシートの方ももうちょっと勉強する必要がありそうです。
>他の人のソースを参考にして制作するのは良い
安心しました^^

お礼日時:2009/03/20 11:52

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!