人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

サイト製作において、効率的にCSSを作成するためにどのような点に注意して設計していますか?またはCSSの「効率的な設計方法・手法」について書かれたサイトやブログがあれば教えてください。例えば、効率的なIDやクラス、セレクタの割り振り方、IDやクラスによるマッチングを最低限に止めながら共通のスタイルを効率良く設定していく実例等ありましたらお聞かせください。
CSSそのものについての回答は必要ありません。あくまでも「効率的なCSSの設計手法」についての質問です。

下記のサイトのような内容をイメージしていただければよいかと思います。
http://baban.fc2web.com/web_seminor/style_construct/index.html

●質問者: wizemperor
●カテゴリ:ウェブ制作
✍キーワード:CSS イメージ クラス サイト スタイル
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

[1]bodyにid属性を割り振る aratako0

これがベストな方法かは分かりませんが。


各ページで共通するCSSと各ページごとに違ったCSSを読み込ませる場合がありますよね?その時に、違ったCSSファイルを読み込ませるのではなく、各ページごとにbodyに違ったid属性を読み込ませ、#(bodyの要素) #(各ページのidやセレクタ)という形でやっていきます。


もちろん、各ページが果てしなくページデザインが違う場合や完全に同じテンプレートで構成されているのなら、あまり意味はありませんが。


この手法も含めて、

CSSプロフェッショナル・スタイル―世界の「最先端」事例に学ぶ

CSSプロフェッショナル・スタイル―世界の「最先端」事例に学ぶ

は結構役立つかと思います。(ただ、あくまでCSSの使い方を掲載しているもので、その一部に属性の振り方などが参考になる程度ですが)


[2]>1 ありがとうございます wizemperor

ご呈示いただいた本は私も購入しましたが、ページごとにスタイルを変える場合には有効だと感じました。

私の場合、個人で製作を行っているため大規模なサイトの製作はないのですが、主にブラウザのデフォルトスタイルを初期化した後、同様にサイトのパーツごとにIDを指定する方法で製作しています。

ところが、デフォルトスタイルを初期化しているため、作成途中でどうしてもパーツをまたいで似たような指定が出てきてしまうのです。共通するCCSの設計段階の問題と言えばそれまでなのですが。

この辺のことに絞って書かれている書籍・サイト等、またはみなさんの手法についてお聞かせいただければと思います。

いわし向きの質問ではなかった気がするので、人力検索の方で再質問させていただきたいと思います。

その他具体的なものがありましたらご教授いただければと思います。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ