きれいなソースの勉強法は?入力中の回答があります。ページを離れますか?※ページを離れると、回答が消えてしまいますページを離れるA回答を続ける入力中のお礼があります。10:44回答数:5件こんにちは。いつも、ホームページを、「ホームページビルダー」で作っています。さいきん、ホームページをきれいなソースにしたいと思いました。それで、「HTMLがわかる本」を買ってみましたが、ただ、こういうのは、こういう表示になるよ、ということが書いてあるだけで、それをどう組めば、きれいなソースになるかわかりませんでした。お聞きしたいのですが、きれいなソースを組めるような勉強って、どうすればいいのでしょうか?お勧めの本や、サイトがあったら教えていただければ、助かります。通報するこの質問への回答は締め切られました。ソース」に関するQ&A:VisualBasic.NETでのソースの意味がわかりません...。11:32ビルダーを使用したのはもう何年も前なので最近のはよく分かりませんが、テーブルや画像を配置した時にソースが自動生成されたと思うんですが、それを手動で直すか、初めからソースを打ち込むかしないときれいなソースにならないような気がします。No.1の方の回答に加えて*************************************<HTML><HEAD><title>任意のタイトル</title></HEAD><BODY><!--▽メニュー部分ここから▽--><TABLE><TR><TD>メニュー1</TD><TD>メニュー2</TD></TR></TABLE><!--△メニュー部分ここまで△--><!--▼メインコンテンツここから▼-->メインの内容<!--▲メインコンテンツここまで▲--></BODY></HTML>*************************************みたいな感じではどうでしょうか?テーブルの配置はただの一例です。<!--○○-->←この部分は不可視なので実際のウェブ上には何も表示されないので自分の分かりやすいように入れるといいと思います。きれいにした後にまたビルダーで何かを挿入して移動させたりなどするとソースが崩れる可能性があるかもしれません。個人的な意見ですが、ビルダーの自動生成はいらないタグがよく入るような気がします。それを削れるようなら削ってソースをすっきり綺麗にしてみてください。通報するこの回答へのお礼ご返答ありがとうございます。これがベースになるのかー、と。タグ初心者なので、これから勉強して、ビルダーなし!を目指そうと思います。何が余計なタグなのか、わかるようにならないとなぁ...。...すみませんなんでもないです。・テーブルのネストは絶対悪ですね。hpbなどのソースは独自定義が多く、見ていられないので仕事でhtml(テンプレートですが)を作る人に当方(PHPなどコード作成側)へ納品させる場合は「余計なコメント排除、インデントはキチンと整形」ということを徹底させてます。そこまでが君の仕事だから、と。インデントを全部消します。・空行を削除(\n\nがなくなるまで\n\nを\nに置換)・開始タグと終了タグの間を選択し、tabを押す(一括でインデントされます)・上記をひたすら繰り返します。・不要なコメントを消す。・必要なコメントを足す。いった感じでやってみると良いです。僕の指導ではまずそうさせます。タグの意味が、なんとなくしかわからないワタクシには、難しかったですが、将来、このお答えをすらすら!と理解し、そーよねー、それぐらいはね、なんて言ってみたいです。ありがとうございました。-->を使うと、わかりやすいソースにはなりますね。余計に見難くなってしまったりしますが。--><div>..◯◯の内容色々..</div>勉強法は、色んなサイトのソースを見る事くらいしか思いつかないです。素敵なサイトを見つけて、研究してみます。ありがとうございました。ソースをかけるようになれば奇麗なソースになると思います。ソースを理解出来るようになるのが良いと思います。記述するようにした方が良いと思います。前までホームページを作る者としては、バイブルだったサイトです。http://www.tohoho-web.com/www.htm参考にしてみてください。通報するこの回答へのお礼おー、とほほのWWW入門ですね!ずっと前、1度見たら???だったので、そのまますっかり忘れていました(笑)勉強してみようと思います。ありがとうございました。10:52奇麗なの視点が分りませんが、HPビルダー等エディターで編集すると、見難いのは確かですねー。他のサイトを見て、ソースを表示してみてはどうでしょう?見やすいコーディングをしているサイトもありますよ。私は手打ちなのですが、基本は改行・タブを使っています。━<HTML><HEAD><BODY><TABLE>....<TR>........<TD>........HelloWord........</TD>....</TR></TABLE></BODY></HEAD></HTML>※....はタブスペースです。