CASC

Capsule and Separation CSS

CASC BLMOP MODEL

カプセル化と分離によるCSS設計コアメソッド

CASC[カスク]は、環境やサイトに応じて独自のCSS設計をおこなうためのコアメソッドです。

部品主体コーディングで不都合の起きやすい3つの要因を取り除き、役割ごとに分類した4つのCSSカテゴライズを「変更可能な標準状態」と定義することで、「SMACSS」「OOCSS」「FLOCSS」「BEM」「Atomic Design」といった既存のCSS設計思想や制作手法を踏襲しやすくしています。

ファイル管理・ディレクトリ

CSSは、管理効率と実用性を最大化するために、SassなどのCSSプリプロセッサの導入を前提とします。

ディレクトリの名称は、設計で定めたCSS分類と同名にします。
内部に格納するファイルや、サブディレクトリの設置にルールや制限などはありません。

BLMOP Sassディレクトリ構造

CASC を利用したコーディング

Layoutの中にObjectを配置していく事で、サイトを構築するライブコーディングの映像です。

※あくまで使い方の参考としての動画であり、映像に出てくる各種コードの書き方は、CASCで定めたものばかりではない事にご注意下さい。

サンプル

サンプルのダウンロード

CASCのカテゴライズをSassファイル化したサンプルです。
構造把握などご自由にお役立て下さい。