CSS設計とデザインとの距離

TAM LT 大会 / 2016 Winter
Manabu Yasuda
CSS設計とデザインとの距離
01TAM LT 大会 2016 Winter

今年、TipsNote に FLOCSS をベースにした
CSS 設計の記事を書きました。

CSSは名前の付け方を整理しておくと、
理解しやすく、扱いやすくなる。
誰が書いても一定の水準が保てる。
記事の要約

実案件で設計はうまくいった？

まだまだ迷うことが多く
改善点がたくさん。
実案件で設計はうまくいった？

迷ってしまう理由。
自分の頭の中だけで想像しているから。

「これと同じスタイルはあるかな？」
「これは他にないスタイルだけど
共通化したほうがいいのかな？」
「なんていうクラス名をつけようかな？」

正解はこうだろうなと考えて実装しても、
答えが出るのはある程度組み上がってから。

やり直すことは簡単ではないし、
やり直せる範囲は案件が進むごとに狭くなる。

やり直しを最小限にするために、
感覚ではなく、
事実にもとづいた実装をする。

エンジニアも
情報設計やデザインに参画する必要性。
デザインの見た目と CSS の一致はとても脆い。

見た目ではなく、
デザインの目的とCSSを一致させる必要性。
見た目は変更されるが、デザインの目的は変わらない。

- CSSの設計はエンジニアだけではできない
- やり直すのは簡単ではない
（感覚的なコーディングを避ける）
- エンジニアはもっとデザインに深く関わる必要がある
まとめ

More Related Content