３６５日坊主

サイト、作りますか？

---

ウェブサイト作ります。

初めてのドメイン取得で、ゴニョゴニョしてたのはそのため。

簡単なデザインはモレスキンに書いてたけど、それをエクセルに起こしてHTML化。


サイトデザイン 仮出力 by Excelさん



エクセルはHTMLで出力できるから便利ですね。
ただセルをひとつひとつテーブルタグで出すために368KBというデカさ。
ほんとうにテキストファイルなのかこいつ。


この出力でかなりイメージを忠実に再現できました。

これを後から作った仕様書通りにHTMLとCSSで固めていきます。

細かいピクセルの数値や、幅を決定していきます。



サイトの横幅。悩みどころですね。

mixiという大手サイトが「横幅950px」を採用しているので、それ以下に収めようと思います。


870pxを基準に学校のMacに入ってた「Dreamweaver CS3」というソフトを授業中に勝手に使って作成。


サイトデザイン　第2版

かなり最終稿に近い感じ。


ソースもかなり短くなって可読性がヤバいです。
デザインを完全にCSSに移行しています。
HTML部はすべてDiv要素で囲っているだけのシンプルソース。


ただ、ドリームウィーバーの仕様なのか、すべて絶対座標で出しちゃってくれてます。

position:absolute; ですべての要素（ブロック）をpx単位で指定してます。
一か所動かすと、ほかのとこも動かさないといけないため手間が膨大。莫大。


仕方がないので、これを元に手書きでHTMLとCSSをおこします。







これが一番最初に手帳に書いたデザイン案。ほぼ、そのままですね。
各ブロックにつけるidもここで考えてます。








よし、技術的なオタク話はここまでだ！！







以下、実物。





（この図は2008/07/01の様子）

heap note




現状はこんな感じ。



チマチマ作って、コンテンツを流し込みます。


とりあえずは過去作品を探す旅へ。


ブログの過去記事をあさってみます。

1. 2008/07/05(土) 19:00:00|
2. 日刊日記
3. | トラックバック：0
4. | コメント：2

Excel！その手があったか。使わせていただきます。
でもソースコード長っ！スクロールバー短っ！！

精神的な貝塚。なんて素敵なコンセプト。
頭の中をすぐに具現化できるやなせさんに憧れます。
ラフデザインのラフっぷりに燃え盛る芸術を感じましたのでそれも貝塚に放り込むべきです。

1. 2008/07/06(日) 20:53:37 |
2. URL |
3. 信伍 #-
4. [ 編集]

>>しんごさん

サイトの設計書っぽいのエクセルで作ろうとしたら、たまたまHTMLで出力してくれる機能を発見ｗｗｗ
ほんとにサクっと作るならエクセルが便利だね。

OK！　このサイトのメイキングもコンテンツにしてみるつもり(´∀｀*)ZE
貝塚に放り込めば、化石になって100年後に発見されてアーッ！ってなる。

1. 2008/07/08(火) 07:41:47 |
2. URL |
3. やなせ #-
4. [ 編集]