より良いCSSを書くための様々なCSS設計まとめ

CSSは誰でも簡単に自由に書けるのですが、好きなように書いていると「ここを変更したら、違うところが崩れた」といったようにすぐに破綻してしまいます。 さらに、複数人で書いている場合は、各々が好きなように書いて読むだけでも苦痛なCSSが出来上がってしまいます。 そこで、これらの問題を解決するために考えられたのが「CSS設計」です。 今回は記事が長くなり過ぎるので、CSS設計の概要のみを説明し、参考となる公式ドキュメントへのリンクを記載しました。 CSS設計とは CSS設計は、CSSを記述する時のルールとなるものです。プロジェクト毎に適したCSS設計を採用することで、「良いCSS」にすることができます。 最近では、命名規則はBEMで、構成はSMACCSのように各CSS設計の概念を取り込んだオリジナルの規約をつくるといったことも多いようです。 「良いCSS」とは 「良いCSS」の定義として、おそら

[aoiasaba]

ざっと読んだけど難しかったのでまた今度しっかり勉強します＼(^o^)／

[ttkazuma]

何年も前から色んなやり方が出てくるけど、WEBサイトの多様化・学習コスト・HTML&CSS進化の点からどれもイマイチ。あと命名規則をきっちり決めても例外が出てきて結局グチャグチャにｗ

[karauma]

“１つの要素に対して複数のクラスを指定するのをマルチクラス、１つないし２つ程度のクラスを指定するのをシングルクラスと呼びます。”

[eiga338]

覚えること多過ぎ・・・

[hiroomi]

"１つの要素に対して、複数のクラスを指定するのをマルチクラス、１つないし２つ程度のクラスを指定するのをシングルクラスと呼びます。"どの規模の組織相手にデザインしてるかか。

[gesuo777]

APBCSSに関して、詳細や実装例など知りたかったりする。

[hamamuratakuo]

CSS設計＝WebのGUI設計。レスポンシブデザイン登場でCSSも静的から動的に変貌？プログラマブルなCSS+JSは手続型（オブジェクト指向）よりも宣言型（関数型）で扱う方向へ向かう？JS界のフレームワーク乱立がCSS界でも再現？

[redcat_prog]

CSS で camelcase とか snakecase とか見るとオラ頭がクラクラすっぞ

[kefi3104]

より良いCSSを書くための様々なCSS設計まとめ

[ytsk]

さいきん良いCSS設計みたいな話よく見る気がする

[tpex_ovon]

これ、一番最初にoocssとかBEMとか指定して欲しいけど、よくわからない部分があるので指定されるのも困る

[t_pooh]

φ(.. ) メモ: やっぱ本腰入れてとりくまないと良いCSSは書けない、ということがわかった

[trkbt10]

BEMが良すぎて

[ryu39]

cssの設計指針がこんなにあったとは…、新しいプロダクトを作る時に参考にしたい。Bootstrapベースになる可能性高いけど、

[coyu8]

oocss派です。

[cimaz]

あべし

[takryou79]

命名規則

[digitalglm]

より良いCSSを書くための様々なCSS設計まとめ | UX MILK: CSSは誰でも簡単に自由に書けるのですが、好きなように書いていると「ここを変更したら、違うところが崩れた」といったようにすぐに破綻してしまいます。…

[ginzi009]

より良いCSSを書くための様々なCSS設計まとめ

[braitom]

“より良いCSSを書くための様々なCSS設計まとめ”

[tktktktjp]

他人がみても度の役割のCSSか　わかるようにコメントｱｳﾄいれて　おいてほしい。　多くの人と共有する場合は特にね