hanaCMS
HTML,CSSコーディング規則
hanaCMSをご利用になるにあたり、HTMLやCSSスタイリングシート用の簡単な規則があります。それをクリアすれば、非常に便利なHTMLエディタを利用した、ページレイアウト、コンテンツ作成が可能になりますので是非、デザイナー・コーダー様は目を通しておいてください。
1. レイアウト用のデザインは、内容が無くなっても幅を維持させられるようにする。
2. なるべくBEM命名規則を利用し、子孫セレクタを使用しない。
3. floatはしっかりclearfixで対策をする。
非常に簡単ではありますが取りあえずこれだけは守って下さい。
理由
1について
例えば2カラムレイアウトの場合、ヘッダー、サイド、メインコンテンツ、フッターに分かれる場合が多いと思います。
hanaCMSのエディタは、このヘッダー、サイド、メインカラム、フッターにパーツを挿入、入れ替える等のユーザーアクションをさせることになります。
もし、サイドカラムに何もパーツが挿入されていなければ、floatでサイドが潰れて見えなくなってしまうなどの状況は避けて、レイアウトのアウトラインはしっかり維持し、レイヤーを意識した構造にして下さい。
※実際にはサイド枠に何もコンテンツが無かったとしても、ダミーのブロックが自動で挿入されます。
2について
CMSですので、拡張性は重視すべきだと思います。デザイナー以外の方が作成したパーツを挿入した場合に、子孫セレクタがあたったスタイルでは拡張性は損なわれます。元のデザインに規則性を持たせるための子孫セレクタの使用はいいと思います。
3について
1,2に被る部分ではありますが、floatはそのパーツやブロックが終わった時点で必ず無効化しておいてください。他のパーツに悪影響の出る様な仕様は避けるべきです。
羅列になって申し訳ありませんが、取り急ぎ３つの注意点を掲載させていただきました。
ごく当たり前の内容だとは思います。
ごく当たり前の内容だとは思います。