HTMLでCSSを使用する際なのですが、
HTMLファイルにCSS直書きと、
CSSの内容を「.css」ファイルから読み込んで使用する場合とでは、
メリット・デメリットにはどのような区分がありますでしょうか？
【HTML直書き】
●メリット
・CSSの読み込みタグを使用して、CSSファイルを読み込まずとも、
CSSをベタ書きしてCSSのデザインを反映することが可能。
●デメリット
・ソース量が多くなってしまう
・閲覧時にユーザーにスタイルの内容が見られてしまう
【CSS読み込み】
●メリット
・HTMLファイルに対するソース量が少なくて済む。
・一度作成したCSSを使いまわす事ができる。
・Webページ閲覧時にCSSの内容を見られないようにできる（？）
●デメリット
疑問：考えてみたところ「CSSファイルを作成する手間」ができることと、
HTMLファイル内で <link rel="stylesheet" type="text/css" href="○○○.css"> を入力して、
「CSSファイルを読み込む手間」が出てくるだけな感じなのですが、何か他にデメリットってあるのでしょうか？
No.1
108
11
20pt
その考えで合っていると思います。
あと、最新のXHTML(HTMLをXML風に拡張したもの)では、
<span style="～">
は非推奨ですし、styleタグを使う方法は
<style type="css"> <![CDATA[ span : ～ ]]> </style>
と面倒な書き方になるので、外部ファイルで指定することをお勧めします。
↓ダミー
No.2
130723
20pt
＞・Webページ閲覧時にCSSの内容を見られないようにできる（？）
みれます。
【CSS読み込み】
メリット
・管理がしやすい
・一度読み込んだCSSはキャッシュされるので、CSSを使いまわす場合は読み込みスピードアップ
ご回答ありがとうございます。
見ることができるのですか（驚）
確認してみます。
「一度読み込んだCSSはキャッシュされる」ということは、
「一度Web上で読み込んだデータはパソコン（HDD?）に記録される。」そして、この記録されたものを使用して、
次に表示する時に、一度読み込んだファイルを使用するため、早く表示できるもの、と考えたのですけれども、間違っていないでしょうか？
No.3
393
20pt
【HTML直書き】
・ページが１ページしか無い場合はCSSをキャッシュする必要性が少ないのでファイル数を減らすという意味で直書きの方がメンテナンスしやすいかと思います。
【CSS読み込み】
・クライアントのブラウザ設定等にもよるのですが、通常同一ファイルはキャッシュしますので同じ外部CSSファイルを数ページで使用する場合はレンダリングが早いです！
・サイトリニューアル時のデザイン修正などが容易です。数ページのある箇所のFont替えという修正を考えただけでもHTML直書きより優れています。
ご回答ありがとうございます。
すみません。
レンダリングというのがちょっと判っていないのですけれども、これはHTMLのソースを実際に画像化していく。（視覚化していく）ということですよね？
＞・サイトリニューアル時のデザイン修正などが容易です。数ページのある箇所のFont替えという修正を考えただけでもHTML直書きより優れています。
こちらについては運用レベルでの考えということですよね。
実際に運用していく場合については、例えば「色全体を赤から緑へ変えたい」という要望がユーザさんからあったとき、
CSSファイルで一括管理していれば“ある一部分だけを変更するだけで、その一部分が適用されているHTMLに修正を掛けれることになる（赤から緑へと変えることだできる” ということですよね。
ここで一つ疑問がありまして、よければ教えていただきたいのですけれども、
仮に企業ＨＰなどを作成する場合では「HTMLにCSSをベタ書きする」する場合というのは滅多にないものでしょうか？
No.4
2915301
20pt
＞＞一度読み込んだCSSはキャッシュされる
＞次に表示する時に、一度読み込んだファイルを使用するため、早く表示できる
その通りです。
＞＞レンダリング
＞HTMLのソースを実際に画像化していく。（視覚化していく）
その通りです。
＞＞Webページ閲覧時にCSSの内容を見られないようにできる（？）
＞みれます。
単なるテキストファイルなのでアドレスが判れば見れます。
（HTMLのソースを見ればアドレスは簡単に判りますよね）
例えば、こんな感じで・・・
http://q.hatena.ne.jp/css/question.css
余談ですが
http://q.hatena.ne.jp/js/prototype.js
http://q.hatena.ne.jp/js/prototype_extend.0.2.js
http://q.hatena.ne.jp/js/tooltip.0.2.js
http://q.hatena.ne.jp/js/toggle.0.1.js
＞HTMLにCSSをベタ書きする
標準的な部分は外部cssファイルに
ページ特有の部分はべた書きというように使い分け。
極力、べた書きは行わない方向で行いますが
イベントページのような一時的で特殊な扱いのページや、
クライアントからの（勝手で強引な）突発的仕様変更の場合は
べた書きしてしまったりします。
No.5
592
20pt
CSSを使うメリットですが、ThinkThinkさんが挙げておられる
>・一度作成したCSSを使いまわす事ができる。
を発展させると、
・１つのCSSファイルで複数のHTMLファイルのデザインを一括して制御できる。
私はこれこそがCSSを使う最大のメリットだと考えています。
CSSを独立ファイルにするか否かは、このメリットとデメリットとしてデメリットとして挙げられている
>HTMLファイル内で <link rel="stylesheet" type="text/css" href="○○○.css"> を入力して、
> 「CSSファイルを読み込む手間」が出てくるだけな感じ
とのバランスだと思います。
1人の管理者が３～4ファイル程度のホームページを運用するのであれば、デザイン変更もコピペで
すぐできます。なので、独立させることで得られるメリットは皆無です。
対して、複数人の管理者・コンテンツ作成者で100ファイル超のホームページを運用するにおいて、
デザインを各ファイル任せとすると、統一を保つのは現実的には不可能なので、CSSを別ファイルに
するメリットが大きくなります。
複数のHTMLファイルから構成される１つのコンテンツ内で、デザインがバラバラなのは
ユーザに対して非常に不親切です（あ、意図的に仕組んでいる場合は別ですよ(笑)）。
また、デザイン、構成がバラバラなのは、ホームページに掲載されている情報の信用度も
下げてしまいます。
私ルールですが、7つ以上のhtmlファイルから構成されるホームページを作るときは、
CSSを分けています。なぜ７つかと言えば、人間が短期に覚えていられる数の限界だからです。
おおよそ７つを越えると、編集中にミスをします。ミスをして腹を立てて、さらに効率を下げて
またミスをする、というデススパイラルの種を自ら蒔かないのも重要なポイントだと思います。
ThinkThink
2008/12/03 00:45:52
1
70
69
ご回答ありがとうございます。
XTHMLは使ったことはないのですが、
「」いうのは非推奨（正常に動作するかわかりません？ということですよね。）
知りませんでした。
> <style type="css"></p> <p>> <![CDATA[</p> <p>> span : ～</p> <p>> ]]></p> <p>> </style>
確かに面倒な書き方ですね…汗
外部読み込みであれば変わらないということなのですね。