Tuesday, September 26, 2006

[blog / css / Design]_ red_one さようなら / サイトデザインあれこれ

去年からホスティングさせて頂いていたサーバが最近何かよく落ちてるなぁ、と思ったらサービスを停止してしまいやがった

ので、blogspot に待避。 将来またレンタルサーバに手を出すかは分かりませんが、しばらくはここでやります。
新しい URL はコチラ.

  http://redone-on.blogspot.com/


で、新装開店ついでにテンプレートも温めていたものに変えました。 テーマは白黒・赤です。
初めて来られた方には違和感ないかも知れませんが,昔はコレ → です。


テンプレ変えた、だけじゃ味気ないので、ブログデザインに関して参考にしたところ、記事などを振り返ってみたいと思います。


2カラム → 可変レイアウト → 1カラムへ


考えてみれば今回変える前にもデザイン変えているんですけど、余り post にする余裕がなかったので、そこから振り返ります。
まず、3カラムはどうしてもしたくなくて、サイドバーを右側一本にしたかった。

「全体の横幅はウィンドウサイズに合わせて可変で,サイドバーを固定長で右に置く」

ということをテーマにして、始めは一人で四苦八苦していたのだけれど,どうにも出来なくて。
ここのサイトスタイルシートによる崩れない 2カラム 3カラム・レイアウトを参考にしました。
目から鱗もので、これから CSS を勉強したいヒト、悩んでいるヒトたちにオススメです!


Previous Postsを何とかする


Blogger ブログは記事を過去へさかのぼるのが分かりにくい(Bloggerに限らずほとんどがそう)。 ですので、デザインでだけでも過去記事が参照しやすいようにしようと試みました。
参考にしたのはこれ。
Lucky bag::blog: リモートロールオーバーを CSS だけでやってみる

リモートロールオーバを利用して、過去記事のリストとそれに対応したボタン画像なりなんなりを横に並べ、現在記事からの過去記事への参照を見やすくした・・・つもり。
元ネタからはかなり改造しました。
まず、リストの1つ1つに連番でIDを割り当てることができないので(多分;Blogger のテンプレート編集では)、タグの入れ子の数をどんどん増やし、CSS で入れ子の数分ずらす大きさを大きくしていするようにした。




目次?設置


clmemo@aka: 記事目次をトップページの頭につけてみた |Blogger| 様からアイデアを頂き、ページ冒頭に目次っぽく更新リストをつけた。
最初は Blog Search の検索結果を使っていたのだけれど、最近文字化けや機能不全がおおく、rss を使うことにした。
Blogger が提供しだした RSS は最近作成されたものではなく、最近更新されたもの順にならんでいるらしいので、コレ一本でいいやと思いました。 Feed2JS で貼り付ける。

また、クリボウの Blogger Tips: アーカイブページに投稿一覧リストを 様からもアイデアをパクリ、月毎のアーカイブページではその月の Post の一覧を更新リストの変わりに載せています。


かなり尻切れトンボですけど、書いてて疲れてきたのでここで一時筆を置きます。
補足など後日いたしたいと思いますので、よろしく~
それでは、新ブログ投稿1回目を終わります。

0 comments:

Link Code for this post:

Template Design. 2008 Jyun.