-
ID:ehnIIF さんの質問

BEMとoocssについて質問です。

下記のページを見ていたら、BEMよりOOCSSだ、といった議論がコメント欄でありました。
http://w3q.jp/t/6191

最近、CSS設計の緑の本を買ってOOCSSやBEMのことを学んだばかりなのですが、BEMよりOOCSSというのはおかしいのではないかと、先のリンク先のコメント欄を見ていて感じてしまいました。

BEMは命名方法でOOCSSはCSSの設計概念ではないのですか?

aではなくbという風に比較対象に出来るものではない気がしたのですが、私の認識違いでしょうか?

BEMで名前をつけて、OOCSSの概念でCSSの抽象化や共通化を同時に行うことは出来るのではないですか?

最近、BEMやOOCSSのことを学んだばかりなので、理解がまだ乏しのだと思うのですが、ご意見、ご指摘頂けると嬉しいです!

よろしくお願いいたします。

みんなの回答 1 件

ID:cZKQbl さんの回答

自分もBEMを完璧には把握してないけど、コレに関しては分かる。
BEMはただの命名法則だと思いがちだけど、OOCSSの概念が一部含まれたような命名法則及びCSS設計方法だと考えた方がいい。
具体的に説明するとBEMを構成する要素はそれぞれ、
B = Block
E = Element
M = Modifier
に分類されるんだが
BlockがOOCSSでのパーツ設計(モジュール)に該当し、Modifierが複数パターン制作に当たる。(OOCSSだと特別なルールがない限り、CSSの中身で判断するしかないけど、BEMはクラス名を見ただけでこれらを判断することが可能)
もちろん無理やり同時に使用することは可能だけど、単純にややこしいし、両方の良い面を潰しかねないので別で使用するべきだと思う。
だから比較対象にもなり得るよ。

ID:tXpdpb

今となっては結局、両方使わないかな

ID:VbNRza

じゃ、どうしてるの?Bootstrap?

ID:ehnIIF

トピ主です。BEMの命名規則で名前をつけて、オブジエクティブ指向をCSSに取り入れたOOCSSでスタイルシートを作って行くのではないのですか?

併用不可なのはBEMでの命名規則とその他の命名規則であって、BEMとOOCSSではないのだと思うのですが。

たぶん、ことをややこしくしてるのは、OOCSSには設計概念と命名規則の両方が備わってるという認識が生まれてるからなのかなと思います。(ってゆーか、OOCSSには命名規則も定義されてるのでしょうか?定義されてない前提で以下書いています。。。)

だから、class="block__element--modifier block element" みたいなことが、BEMとOOCSSが併用されると起きちゃうっていうおかしな話になってしまうのかなと。

BEMはそもそもOOCSSの設計概念でスタイルシートを作るときの命名規則だと解釈してるので、やはり、「BEMよりOOCSS」みたいな比較はおかしいと思います。

ID:ehnIIF

「class="block__element block__element--modifier"」つまり、こういったスタイルが適用されてる時点で、OOCSSの設計概念で共通化、抽象化されたスタイルが適用されてるということを期待されてるのではないでしょうか?

ID:cZKQbl

>ことをややこしくしてるのは、OOCSSには設計概念と命名規則の両方が備わってるという認識が生まれてるからなのかなと思います。(ってゆーか、OOCSSには命名規則も定義されてるのでしょうか?定義されてない前提で以下書いています。。。)
最初のOOCSSはBEMかな?だったらそうだねー。しかも命名規則ってイメージが先行してるからややこしい。ちなみにOOCSSはあくまで設計概念で命名規則は定義されてないよ。
自分達で何かしらのルールと命名規則を決めれば別だけど。

ID:cZKQbl

>BEMはそもそもOOCSSの設計概念でスタイルシートを作るときの命名規則
これは違うと思う。
class="block__element block__element--modifier"
上記の場合も何のModifierなのか具体的に表すためにこういう記述がされるだけで、OOCSSのように使用することを期待されているわけじゃない。

ID:ehnIIF

何のModifierなのか具体的に表すためにこういう記述がされるだけで、OOCSSのように使用することを期待されているわけじゃない。

なるほどー。でも、結果的には共通化されてない差分を取り付ける、または、オーバーライドすることになってませんか?

ID:ehnIIF

OOCSSはあくまで設計概念で命名規則は定義されてないよ。

やはり、そうなのですね。であれば、両者は比較対象にはなり得ないということですね。

命名規則(BEM)vs設計概念(OOCSS)、または、オブジエクティブ指向をCSSに取り入れた設計概念を前提とした命名規則(BEM) vs 命名規則(OOCSS)のどちらかということなのだと思うので。

ID:ehnIIF

あー、遅ればせながらBEMの公式サイトのドキュメント読んでみましたが、OOCSS前提の命名規則というよりは、OOCSSであって命名規則も設けられてるっていう方がより適切のようですね。

最終更新日:2014-09-22 (3,053 views)

関連するトピックス

ページ上部に戻る