re:マルチシートアプローチとかクラス名とか

このエントリーをはてなブックマークに追加

ネタ元:マルチシートアプローチとかクラス名とか

いろいろな人の意見が出てきて面白いところですので、私の意見も書いておきたいと思います。

個人的にはスタイルシートを、分けないほうが効率が良いと思ってます。

Firebugを利用すれば編集したいCSSが、どのスタイルシートの何行目に記述されているかが3秒でわかるので1枚だと非常に楽です。

作業的には

ブラウザで確認→Firebugでスタイルの確認→エディタに移動(Alt+Tab)→編集する行に移動(Ctrl+g)→編集保存→ブラウザに移動→最初に戻る。

で済むのですが複数枚で管理していると

ブラウザで確認→Firebugでスタイルの確認→エディタに移動(Alt+Tab)→編集するスタイルシートに移動(Ctrl+Tab)→編集する行に移動(Ctrl+g)→編集保存→ブラウザに移動→最初に戻る。

という具合に1工程増えてしましいます。(ショートカットは秀丸のもの)

たかが1工程ですが、わりとコーディングのリズムを崩す1工程なので、出来たら1枚で済ませたいと考えています。

すごい個人的でミニマムなレイヤーでの意見ですが。。。

マルチシートアプローチの利点

とはいうものの、マルチシートアプローチは上手に使えば非常に効率を上げるものだとも考えています。

例えばreset.cssやimport.cssのように絶対編集しないファイル分けていても問題ありません。むしろ、いろんな案件で同じファイルを使いまわせるので分けたほうが効率が良いです。
(1枚が良いと言いつつ、私もここは分けています)

複数人管理している場合にcommon.cssのような勝手に編集してはいけないファイルは分けたほうが安全です。

複数人で管理していて、それぞれに権限が定められている場合などは、分けないとサーバー側でFTP権限の振り分けが出来ません。

コンテンツ毎に増減があるサイトに関しては、コンテンツ毎にスタイルシートを分けておけば、コンテンツを削除する際に、対応するスタイルシートを削除することにより痕跡を完全に削除できます。

明確なコンポーネント化のルール決めがなされている場合は、分けたほうが直感的にわかりやすいです。

逆に明確なコンポーネント化のルール決めがなされていない場合は、非常にわかりにくくなります。
common.cssにコンテンツ毎の記述がされているサイトなどを修正しなくてはいけない時などはけっこう気持ち悪いです。

結論

いろんなメリットデメリットを理解したうえで、個人の、そして組織の一番効率の良い方法に落とし込むのがよいのではと思います。

はやりに流されるのはやめたほうがよいですよ。

スポンサードリンク

«Slice Imageでサイトを高速化 | メイン | Re:Creator's Party Kansaiブログ始まります»

このエントリーのトラックバックURL
http://blog.webcreativepark.net/cgi/mt/mt-bt.cgi/1053
コメント

おー、なんか引用していただいて恐縮です。
ありがとうございました。

> いろんなメリットデメリットを理解したうえで、個人の、そして組織の一番効率の良い方法に落とし込むのがよいのではと思います。

やっぱり、これが全てですね。
実際に変にファイルを分けすぎたりすると、

■一箇所への指定が、別々のCSSファイルに記述されてしまう
■同じ指定があらゆるCSSに重複してしまう
■そもそも納期間際のドタバタの際にコーディングルールが守られなくてグチャグチャに

といった問題も出てくることもありますので、分けるのであれば、頑張って頑張ってルールを明確かつ簡単なものにしておかなければいけないと思います。

まぁ、エントリー内にもありますが、今回のエントリーは「CSS設計を考えるということは、実はビジュアルデザインも含めたワークフローまで変えることが出来るんじゃないですか?」ってことが言いたかった感じでしたー。

投稿者:コバ | 2008年5月29日 19:45

>コバさん

スタイルシートの分割も、デザインのモジュール化もうまく作れればすごく気持ちいいんですけどね。

コーディングルールを含めた保守の問題だったり、連携するスタッフのスキルであったりを考えるとなかなか。

「CSS設計を考えるということは、実はビジュアルデザインも含めたワークフローまで変えることが出来るんじゃないですか?」
これは名言ですね。次の講義のときに使わしてもらいます。

投稿者:西畑一馬 | 2008年6月 4日 01:09
コメントを投稿