メインコンテナをモジュールに分割する

それぞれのグループ化モジュールに含まれるコンテンツを、さらに細かくモジュールに分割する

ポストヘッダー内のモジュール

ポストヘッダーの中身をモジュールに分割する

ポストコンテンツ内のモジュール

分割されて出来たモジュールは使用頻度が多く、基本的なものがあつまっている

記事など長文を掲載するページで良く使われる

ポストフッター内のモジュール

画像とテキストが横に並ぶ、メディアオブジェクトと呼ばれるモジュール

モジュール分割のコツ

コンテナに分割するときと違って、定型的な方法はない

ポイントは2つ

会話が続くようなレイアウトは、前後のレイアウトとは大きく変わっている

使用する CSS の機能を考える

デザインをよく観察する

テンプレートファイル

base.html
style.css