FLOCSS で自社サービスの CSS 設計をやり直した話 | TECHSCORE BLOG | TECHSCORE BLOGこの記事は TECHSCORE Advent Calendar 2016 の 9 日目の記事です。 弊社サービス Synergy! では、新機能「リターゲティングメール」搭載のタイミングで UI の刷新が行われました。 無事リリースできたのは良かったものの、特に CSS 設計は手探りな部分が多かったので、その後いろいろと課題が見えてきました。 今後の UI のベースとするには、あまりにも心もとない……ということで、FLOCSS を導入して CSS 設計のリファクタリングに取り組んだお話です。 元々の設計 Bootstrap FlatLab (Bootstrap ベースのテンプレート) 自社の style.css HTML/CSS 周りは、ざっくりこんな感じの構成です。 独自のスタイルは style.css に集約していました。 あと、クラスの命名規則は特に設けていませんでした。 Boots
