質問: 複数ページからなるWebサイトを作成しています。 各ページに共通の部分(フォントサイズ、色など)もありますが、同じクラス名でも微妙に違うスタイル(widthやmarginなど)を持つものもあります。 現状は、以下の3つが各ページに混在しています。 * common.css * ページ別のスタイルシート * HTMLのstyle属性の中の記述 質問1 一般的なWebサイトでは、どのようにCSSファイルを定義しているのでしょうか? (例えば、common.cssとページ固有のスタイルシートの組み合わせなど) 質問2 HTML内にcssを記述するのは、アンチパターンなのでしょうか? 質問3 今のスタイルシートが混在している状況を、どのように改善したらいいでしょうか? よろしくお願いします。
回答: 「odmdom」さんや「mts10806」さんも、書いておられますが、CSSの記述にはルールがありますが、ファイル構成にはルール等はありません。 「改善方法」としては、おおまかですが、以下の別角度から見た場合を考慮すると良いかと思います。 1通信速度を向上させる。 webサイトの閲覧で、ユーザー離脱の原因のひとつに、「サイト表示が遅い」があります。 CSSファイルが1つであれば、1回で済みますが、2つあれば2回の通信が必要となり、3つあれば3回の通信が必要となるため、1つのファイルにマトメる事で時間を短くする。(※JSファイル等にも同じ事が言えます。) ※HTML内の一部インライン化も、速度向上のために行う事もあります。 2コーディングを効率化させる。 各ページの共通部分と固有部分とを明確に分ける事で、作成・管理の効率を上げて行く。