第八回 株式会社もしも開発合宿 二日目

さて、二日目です。

実はこのエントリを 28 日に書いてるのは内緒です。

べ、別にサボってたわけじゃないんだからね!

昨日のうちに環境設定を済ませてあったので、朝からガリガリ開発です。

二日目 午前

一応普段の業務開始時刻である 10:00 を目処に作業開始です。

とりあえず、各々が目標設定を行っているので、その目標に向かってひたすらコーディングなり勉強なりをします。

私は溜まってる開発案件をひたすらこなすことを目標としているので、お気に入りの音楽を MacBook Air で再生しながらノリノリで開発ですよ。

ま、特に取り立てて書くことも無い感じですね。

二日目 午後

合宿メンバーに「テンプレート *1 の構築について」を聞かれたので図解入りで説明。

あんまり詳しくは書けないんだけど、テンプレートをレイヤーに見立てて HTML タグの入れ子構造とのマッピングを説明してみた。

レイヤー重ねの説明の際に、こだわって図解したもんだから、周りから「キモい」だの「病的」だの言われましたが、めげません。強い子です。

あとは、HTML の div タグの考え方とか、フローティングの概念とかも説明しました。

要点を掻い摘むとこんな感じ。

  • まずは、デザイナさんから上がってくるレイアウトを ヘッダ・コンテンツ・フッタ に分解します。
  • 次に、コンテンツ部を直感でパーツ単位に分解します。
  • んで、細分化されたパーツ分だけテンプレートファイルを作ります。
  • そいで、それぞれを div タグとして枠線付けるなり背景色塗るなりで視覚化しつつフローティングさせて実際の文書構造を構築していきます。
  • ほんで、実際に切り出した画像とかテキストとかを埋めつつピクセル単位のレイアウトを制御します。
  • 最後に、各主要ブラウザにて表示チェックを行って完成です。

まぁ、ウチは fixed layout *2 なので、ピクセル単位のレイアウトが必須になるわけですね。

実験的に liquid layout *3 とか elastic layout *4 とかも試してみたいですね。

実際、Am@zon とか R@kuten とかは liquid だし、リクエストセッション単位でレイアウトを切り替えて CVR の変化を測定してみたいかも。

んで、反省会

とは言え、みんなかなり集中して作業に取り掛かって疲れているので、26 時くらいでお開き。

くだらない話で盛り上がったとさ。

*1:弊社のフロントエンドは全てテンプレートエンジンを使ってレンダリングしています。

*2:固定幅レイアウト

*3:可変幅レイアウト

*4:文字数制限レイアウト?