XassでCSSをさらにもっと楽しくする ~ Ruby on Rails 改善計画 ~


こんにちは pandora2000 です。

今回は、 Ruby on Rails で、 Sass を使って CSS を書く人が対象です。今回は CSS の命名規則に切り込みます。だけど僕は特に新しいことは主張しません。

ネット上でCSSの命名規則(BEM, OOCSS, SMACSS)を声高に主張する人たち

僕が最初に耳にした命名規則は BEM でした。僕の第一印象は、

そもそも、CSSってそんな仰々しく命名規則を導入しなければいけないほど難しいものじゃなくね?

でした。階層が深くなった時にやばいという意見もあるけど、

普通に名前空間分ければよくね?

と思いました。でも僕は「Javaっていうすごい有名な言語があって、そこでは名前空間という仕組みがあって、それを使うと名前の被りを防げますよ」なんて言いません。

大人は質問に答えたりしない。それが基本だ。(利根川)

普通に名前空間区切ってやってみた

普通に出来た。Javaすごい

下みたいな感じ

途中で思ったのは、

只管、書くのが面倒

改善!改善!

Xass はこのために用意された Gem です。

上記のコード、以下のように書けます

命名規則は慎重に考えないと破綻する

例えば、「 Javascript のみでしか使わないクラスは js- を接頭辞につける。」など具体的な命名規則なら、いつそれを使うか明確だし、迷う事もない。だけど BEM のようなあいまいな命名規則はだいたい崩壊する。細かい部分については個人の見解によるものが大きく、正しいものなど存在しないと僕は思います(具体的に li は element であるとかいうのは別)。一人でやるのですら、「あれ?この場合ってどうするんだっけ?」となるのに、複数人でやると考え方が乱立しすぎて、統一するのもコストですし、不可能だと個人的には思います。

Xass はツールなので、思想を縛るものではありません

ですから逆に問題は解決していないかもしれない。だから僕は Xass があるから BEM は要らないとは言わない。解決しようとしている問題が違う( BEM の方は名前空間の問題も解決するから BEM の方が「広い」のが正確かも)。だけど BEM が解決しようとしている問題は、解決難易度が高すぎるので、手を出すと返り討ちにあう。

結論:思想はいらない。改善ツールを!

 

あるべき論はいらない。唯一あるとすれば

仕様は満たすべき

仕様を満たすコードが最も美しく麗しい。その過程は問わない。唯一問うとすれば

ただ早いこと

今回はそこを少し改善したというエピソードでした。

この記事に対してコメントを書く