Q&A
CSSが「波状」になるという状況は、意図的にやらないと想像できないのですが…どのようなシチュエーションでしょうか。
HTML,CSSコーディングの初心者です。
非コーダーのデザイナーでしたが、勉強を始めています。
見られればいい、という程度のコーディングはできるのですが、
運用視点をもった「CSS設計」をした経験が全くないため、ステップアップしたいと思っています。
「CSS設計の教科書」という本を読み、BEMやFLOCSSなど様々な設計手法を知りましたが、
ぼんやり概念は理解できても、「で？どうすりゃいいんだ？」という感じ。
具体的な練習パートがないため、個人で試して見ても合ってるのかもわからなくて
実用イメージや練習方法が浮かびません（白目）
「あなたのPJに合わせて最適な方法を選ぼう」となってますが、
どんな状況において、何が最適なのかもさっぱりで、立ち往生しています・・・（絶望）
そこで、CSS設計の思想をつける上で皆さまが実践された
①練習方法
②参考文献や、URL
など、ありましたらぜひ教えていただきたいです。
当社古い会社で、先輩もあまり最新の知識に明るくなく、
事業会社なので頻繁に試せる機会がないので個人で勉強しようと思っています。
ひとまず、FLOCSSに則って何か作ってみようかと思っています。。。
すみません
波状→破綻 の間違いです
いわゆる、スタイルの上書き合戦、コード重複、使い回しできない、など 無駄に運用コストがかかる状態になってしまうことを言っています
過去質問に似たようなものがあったような。CSSの設計の話だったはず。
上書き合戦、コード重複はまた本件とは違う話になりそうに思いますが。
回答1件
0
ベストアンサー
CSS設計は、BEMやFLOCSSなどのメジャーなCSS設計手法＋自分がコードを書いていてこうしたほうが楽だな便利だな
と思ったものを付け足していく といった感じかなと思います。
現在自分はSMACSSをベースにbootstrapを取り入れつつ、随時カスタマイズしています。
基本的に、「使い回しができること」、「使い回しができる複数のスタイルを組み合わせて更になにかを作れること」の2点を考えながら作っています。
なので①の勉強方法については、上記2点を考えながら、自分が今選択しているCSS設計手法から外れていないか時々本や参考サイトで確認しつつ、たくさんコードを書くことでしょうか。
とくにページ数が多いと良いと思います。
ある程度コードを書いていくとCSS設計手法が、どうしてこういうやり方をしているのかわかってくると思います。
また、「こうしたら楽かな？」「これ似てるのにわざわざ書くのめんどくさいな」という思いが出てくると思いますので、それを解決していく感じです。
②参考文献や、URL
SMACSSを勉強する際に先輩に渡された本はEbrickさんと同じです。
参考にしたサイトは↓のサイトなどです(SMACSS)
https://app.codegrid.net/entry/smacss-1
投稿2019/02/07 07:41
総合スコア122
あなたの回答
tips
プレビュー
