CSS Architecture with OOCSS, SMACSS, BEM

Slide about Modern CSS Architecture.
with OOCSS, SMACSS, BEM and Preprocessors.

If you want to download PDF but don't want to login SlideShare,
go to Speacker Deck on which is the same downloadable PDF :
https://speakerdeck.com/katsunoritanaka/css-architecture-with-oocss-smacss-bem

7.
“CSS is simple... It’s simple to understand.
But CSS is not simple to use or maintain.”
「CSSは単純で理解しやすいが、使ったりメンテ
したりするのはシンプルではない。」
http://chriseppstein.github.io/blog/2009/09/20/why-stylesheet-abstraction-matters/
-Chris Eppstein

8.
“We have been doing it all wrong....
Our (CSS) best practices are killing us”
「CSSのベストプラクティスによって私達はダメ
にされている。」
http://www.stubbornella.org/content/2011/04/28/our-best-practices-are-killing-us/
-Nicole Sullivan

19.
“abstract the structure of the block from
skin which is being applied.
Class can be extended by adding
additional classes to the block element.”
「スキンからブロック構造を抽出する。
ブロック要素へ別のクラスを付け加える事で
クラスは拡張できる。」
Separate Structure and Skin

20.
“break the dependency between the
container module and the content objects
it contains.”
「 コンテナーモジュールとその中身であるコン
テンツとの依存関係を断ち切る」
Separate Container and Content

73.
“ A ﬂexible and reusable component is one
which neither relies on existing within a
certain part of the DOM tree, nor requires
the use of speciﬁc element types. ”
http://nicolasgallagher.com/about-html-semantics-front-end-architecture/
「フレキシブルで最利用可能なコンポーネント
は、DOMツリーのある部分に依存することも、
特定の要素タイプを使用したりもしない。」