クライアントに「とりあえず作ってください」って言われるとデザイナーはイラッとするよね、みたいな話を時々聞く。まぁ気持ちはわかるけど、制作工程を考えると、モノがあるほうが話がスムーズに進みやすいのは事実だろう。だから、工夫できるものなら工夫して「とりあえずのサイト」を積極的に作る方向で考えてみる。

この「とりあえずのサイト」で重要なのは、大きく以下の3点ではないかと思った。

• さっと手間なく作れる
• 話し合いながら変更しやすい
• 書いたコードが無駄にならない

とりあえずと言うくらいなのだから、作るのに膨大な時間がかかるようでは意味がない。HTMLとCSSは少ない手間で効率的に書ける方がいい。クライアントと仕様を考えるために作るのだから、それがちゃんと検討できる精度のモノじゃないとダメだし、形を変えては検討を繰り返せる柔軟なものであるべきだろう。簡単に変えられないようだと仕様の変更をしたくなくなるので、本末転倒になっちゃう。あと、そのサイトを作るのに書いたコードを、後で本番用に書き直さなきゃいけないのは辛い。できるだけ再利用というか、きちんと積み上げていけるコードの書き方をしたいところ。

まだこうした理想を実現する良いソリューションは見つかってないけど、いま自分が試行錯誤しているなかでキーだと考えているのは以下の3つだ。

• Twitter Bootstrap
• Jade
• 開発環境の整備

1つ目。さっと手間なく作るのを難しくしている最大の要因はCSSだと思う。なので極力Bootstrapを使う方向でコードを考える。どうしてもアレだなと思う部分はLESSのファイルを編集して、Bootstrapが対応していない部分だけCSSを自分で書く。

2つ目。HTMLについては、共通要素を別ファイルにしてインクルードしたり、Dreamweaverのテンプレート機能みたいなものを使ったりして、効率良く変更にも強いものを書きたいもの。これは静的ページをたくさん作る場合はもちろん、CMSのテーマを作る場合だってそう。なのでJadeを使う。Jadeは変数や条件分岐も使えるので、最初からコンポーネントやCMSの仕様を意識して書くことができる。

3つ目。とりあえずCMSのテーマを作るくらいなら、JadeのコンパイルをLiveReloadに任せれば何とかなるし、ファイルやディレクトリ構成が適当でもいい。だけど、似たような案件が来たときにファイルを使い回したりとか、もっと自動化してアレコレやるぞとかなると、ツールも含めて環境を考えた方がいい感じ。

先日、CMSにa-blog cmsを使い、このやり方でプロジェクトを進めてみた。CSSフレームワークはBootstrapだとやや大仰という感じもしたし、Jadeの理解もまだ十分じゃないし、自動化をもう少し進めるために今後はGruntにも手を出したいなと思った。案件の種類によっては他のやり方がいい場合もありそうだ。などという感じで、道はまだ半ば。初めてのことなので手間もかかってる。でもまぁ、もうちょっと試行錯誤する価値はありそうだな、という実感はある。なのでがんばってみる。