サイトデザイン変更

2008年 2月 9日(土曜日)9:05 am 書いた人: w2 カテゴリ: ウェブ製作

このウェブサイトをWordPressにしてから初のデザイン変更をしました。前回のは、時間もかけずに単純なデザインで作っていたわりには気に入っていました。しかし、投稿日時が英語と日本語が混じっていたり、かなり中途半端なままでした。まぁ、今回のリニュもまだまだ中途半端ですが。。ぼちぼち改良していきます。ところで、エラスティックデザイン(エラスティックレイアウト)って聞いた事があるでしょうか?

僕が初めてこの Elastic Design という言葉を目にしたのはこの記事だったと思います。かなり前になります。実はるーと218も数ヶ月前にサーバを移動した時に少々CSSをいじってエラスティックデザインっぽくなっています。

エラスティックデザインというのはCSSのテクニックのひとつで、文字の大きさに合わせて全体の大きさが変化するようになっています。多くのウェブサイトは固定幅もしくは、ウィンドウの幅に合わせて変化するリキッド(fluid)デザインになっていると思います。固定幅ですと、背景画像など凝った装飾ができ、見た目をコントロールしやすいです。リキッドだと情報量の多いページでもウィンドウ幅が広ければ広い程コンテンツを上に詰めていく事ができ、スクロール量を減らす事ができます。ところが、固定幅ですと、文字を大きくすればする程、一行に入る文字数が少なくなり読みづらくなります。リキッドですと、広いディスプレイでウィンドウを広げて使ったりしていると、さっきとは逆で、一行に入る文字数が多くなり過ぎて読みづらくなったり、使いにくくなってしまうなどの問題点もあります。

Operaやインターネットエクスプローラ7では、ページ全体をズームイン(拡大)したりズームアウト(縮小)の操作が簡単にできるようになっていて、文字の大きさの調整よりこちらの方がスタンダードになる傾向にあります。リキッドデザインもまさしくこれらと同じで、Firefoxなどの他のブラウザでも同様にズームする事ができます。そして、ユーザが使っているウィンドウの幅や読みやすいの文字の大きさに合わせる事ができます。実際に企業のウェブサイトとしての活用の例は少ないかと思いますが、ブログなどの情報発信型のウェブサイトでは選択の中のひとつとしても良いかと思います。

あと、もうひとつ、今回のデザイン変更にともなって写真共有サイトZooomrの写真画像をページに載せる機能を作りました。epdsの活動が以前より伝わりやすくなっていればうれしいです。それでは、今後ともよろしくお願いします。

ソーシャルブックマーク?These icons link to social bookmarking sites where readers can share and discover new web pages.
  • del.icio.us
  • digg
  • Ma.gnolia

この記事へのコメントはこちらからお願いします。