FC2ブログ
お気に入り商品の紹介、ホームページ制作に関する徒然
TK-ウェブログ
スポンサーサイト
-----------  CATEGORY: スポンサー広告
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
ページトップへ
Webデザインのアウトラインを考える-その2
2008-07-17-Thu  CATEGORY: ホームページ製作

技術特性で使い分けるレイアウト

XHTML+CSSのネイティブレイアウト
  CSSレイアウトについては2000年あたりから試行錯誤が繰り返され、様々なテクニックが使われてきました。大別すると、「ボックス浮動化による表現」と「絶対配置による表現」です。もちろん、二つの表現を組み合わせる方法もあります。ボックス浮動化は、幅の値を指定したボックスfloatプロパティで浮動化して、左右に寄せます。3段組みの場合は、上下のボックスを左右に寄せ、一番下のボックスに左右marginを指定して中央に配置する方法がもっとも簡単です。

  ABCという順に記述されているHTML文書を例にするなら、AとBの要素を左右にしてCの要素を中央に配置して3段組みを表現するのです。もし、Cの要素を左右どちらかに配置したい場合は、BとCを<div>要素グループ化して、Aを左、「B+C」を右に寄せて、さらにBを左、Cを右に寄せます。その他、ネガティブマージン(マイナス側のmargin)を組み合わせたテクニックもあります。ボックス浮動化で注意しなければならないのは、(ボックスモデルの解釈が異なる)IE5.x以下の対応です。

Flashで構築されたページレイアウト
  日本ではブロードバンドの環境が急速に普及しており、すでに料金の安さでは世界トップクラスです。2005年4月、無料で視聴できるPCテレビサイト「Gyao」がスタートして話題になりましたが、その後ブロードバンド環境が前提のサービスが次々登場。Webサイトのリッチ化も急速に進みました。特にFlashを使ったダイナミックなページデザインは企業サイトでも積極的に採用されて、Webサイトのトップページで展開しています。中には、XHTML+CSSのページと見分けがつかない体裁で作られているフルFlashページもあります。Flashページは、CSSデザインにおけるブラウザ対策のような作業はほとんど必要ありません。

  しかも、タイポグラフィの見た目をどの環境でも等しく表現できるため、ビジュアル重視のWebサイトでは欠くことのできない重要な表現技術になっています。視覚表現の制約はほとんどないため、雑誌フォーマットを使った縦組みレイアウトも可能です。自治体などの公的なWebサイトでは広告・プロモーションやキャンペーンなど積極的に使用されています。

Ajaxによる動的なレイアウトを表現
  昨年からAjax(Asynchronous JjavaScript+XML)を採用したWebページが増えています。それまではFlashが圧倒的でしたが、GoogleMapsがJavaScriptを採用したことで、再び注目が集まりました。2007年にはリリースされたAdobe Dreamweaver CS3には、Ajaxフレームワーク「Spry」が搭載されて、コーディングなしで簡単に実装できるようになりました。ページの基本レイアウトはCSSで構築されますが、ナビゲーションや入力フォーム、タブの切り替えで表示を変える仕組みなど、Webページ内の操作系パーツの多くにAjaxが使われています。

  ページ遷移がなく、動的な効果を出せるところはFalshと同じですが、JavaScriptが機能しなくても、最低限の情報が閲覧できるように設計することが可能です。(Flashの場合はプラグインがインストールされていないと真っ白になってしまうため、代替画像などを用意しておく必要があります)ブログサービスや「YouTube」、「Flicker」、livedoorReaderなど、ブラウザ上で利用できるWebサービスの多くはAjaxを駆使しており、アプリケーションソフトと変わらない操作性と柔軟なレイアウトを提供しています。

スポンサーサイト
ページトップへ  トラックバック0 コメント0
コメント

管理者にだけ表示を許可する
 
トラックバック
TB*URL
<< 2018/11 >>
S M T W T F S
- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -


余白 Copyright © 2005 TK-ウェブログ. all rights reserved.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。