No-Class CSS Framework チャレンジ

最近、No-ClassのCSS Frameworkがいろいろと出てきているようです。
同じこと考える人が居ることがわかり嬉しい反面
No-Class CSS Frameworkというワードが思いつかなかった切なさが若干あります。

そんなわけで、このサイトのStyleに不足している_table_と_form_周りのCSSを作成して、何か名前をつけてNo-Class CSS Frameworkと言い切りたいと思います。

まずは「No Class CSS Framework」の検索で１位に表示された下記のサイトより様子を伺います。

• No-Class CSS Frameworks | CSS-Tricks

どれもいい感じです。意外と main や section などのブロック要素を使わず、１カラムでレスポンシブ実現している感じです。

どうやってまとめるか？

1. No-Class CSSはルールあるの？
2. 汎用性を持たせる必要ある？
3. これまでの経験で課題となりそうなこと

1. ルールあるの？

ざっと見た感じではタグの正確さより柔軟な印象があります。出来るだけ基本に忠実なHTMLタグで構成します。 強引にやるとclassを指定しなくでも何番目かで指定できますが、煩雑になるので使いません。

• 基本の構成はこのサイトをベース
  • idでのスタイル指定はあるかもね

2. 汎用性を持たせる必要ある？

どんな汎用性が必要か整理。

• レイアウトサイズ：レスポンシブは当然として
  • 画像サイズ
  • カラム数
  • テーブルの動作
• 色指定は自由にしたい。
  • 変数指定
  • SASSで別ける

これまでの経験で課題となりそうなこと

1.に影響がありますが、今までの経験上リストタグがデザイン要素が多くて困ります。

• ol, ulのリストタグ
  • グローバルメニュー
  • パンくず
  • コンテンツ内の見出しアンカーリンク
  • ページナビゲーション 　- フッタのメニューなど

• 関連: No-Class CSS Framework チャレンジ 2|CCCD