CSSをBEMで記述するメリット

1. 構造体系が明確化する

あるページにおいてBlockスタイルは他のElementと競合することはないので、構造体系が明確になります。
また、あるプロジェクトでBEMが出来上がれば、それをフレームワークのようにして他のプロジェクトで使い回すこともできるようになります。

2. 再利用とメンテナンス

さまざまな方法で独立したBlockを構築し、かしこく再利用することができれば、メンテナンスを行う必要のあるCSSコードの量が大幅に減ります。

まとめ

初めてBEMを見た人は、「ダッシュやアンダースコアが2個もあって美しくない」と感じるかもしれませんが、「堅固かつ流用可能で短く書けるCSS設計」として突き詰めていけばBEMが非常に効率的であることがわかります。

上記のような不満からBEMの書き方をカスタマイズして書く方法もありますが、グローバルスタンダードの書き方を覚えれば、他のフレームワークでBEMが使われていたときに構造を理解しやすかったり、共通言語となったりするので、正規の書き方は覚えておいて損することはありません。

ぜひBEMを使って効率的なCSSを構築していきましょう。