最先端で使えるデザインのチュートリアルや参考資料

CSShack（CSSハック）について書いてあるサイト集(国内)

最近Webデザインをしていてよく思うのが、CSSの奥深さです。

CSSの解釈がブラウザごとに若干解釈が違ったりバクの関係で頭を悩ませることがあります。

InternetExplorer７（IE7）ではきちんと表示されるけど、一つ前のバージョン６ではきちんと表示されないなど・・・・。

最新のIE7やFirefoxやOperaでは、頭悩ませることが減ったのですが、文字の表示の仕方に違いがあります。しかし、やはり一番の曲者はIE6です・・・(T□T)

最近ではやっと自動アップデートでIE7を使う方が増えたようですが、それでもIE6やそれ以前を使われている方も多数いるようです。

私のサイトのDigitalTradesではIE6ではきちんと表示されません。

本来CSSハックを行いIE6でも表示させれるようにする必要があるのでしょうが・・・。

本来は使わないにこしたことないので、皆さ～～～ん！IE7にアップデートしましょうΣ(＝д＝ノ)ノ

・・・これ書いたらやろ～かな～(;つД｀)

ま～そんなわけで今回はCSSハックについて書いてあるサイトをピックアップしました。

CSSハックの要点だけ書いてあり、バージョンによるハック方法の違いをシンプルに書いてあります。

http://blog.worldending.jp/archives/2006/07/css.php
こちらのサイトもシンプルに書いてあるのですが、一緒にプレビューがあるのでIETesterなどで確認ができます。

http://d-lover.com/css/hack.shtml
このサイトでは良いハックと悪いハックを区別して紹介してあります。

http://www.hamashun.com/blog/2007/02/css_5.html
CSSハックを使わずにIEのバグに対処する方法が記載されています。
IEでのみ表示がおかしくなる場合の対処方法です。

http://allabout.co.jp/internet/hpcreate/closeup/CU20070412A/
フォントサイズに関するCSSハックを紹介しているサイトです。

http://realog.org/2007/01/20/2217.html

CSSにはハックの他にも画像を使わずに角丸を表現したり、スクロールバーを表示させなかったり、テキストにグラデーションをかける方法など様々な使い方がまだあるのですが、今回は省略します。

CSSハックが無くなる日が来ることを願って・・・Σ(＝д＝ノ)ノ

ってか誰か、CSSファイルをハック用に自動変換してくれるアプリとか作ってくれないの？？

divタグ多すぎてする気になれない...

やっぱムリか・・・(T□T)

今日はFlexについて詳しく書いてあるサイトを紹介します。

Flexとは？と思われる方もいると思いますが、簡単に説明するとFlexとはFlashPlayerを使って一般的なデスクトップアプリケーション並みの機能やユーザーインターフェイスとインタラクションを実現できます。

これにより様々なシステムやアプリケーションをActionScritp3を使って構築していきます。

ただ、Flexは素晴らしいのですが、FlashPlayerを使うためWebブラウザ上でしか実行できないため、Webブラウザの制限を超えることができません。

そこで、AIRの登場です。

AIRはFlexの機能をそのままに様々なプラットフォームに依存しないシステムやアプリケーションが構築することができます。

なので、インターネット上で使う場合はFlexで作成して、OS上などで使う場合はAIRで作成するという使い分けができます。

注意する点は最新のFlexやAIRではActionScriptがバージョンが3になったので、今までActionScript2以前のプログラムをしていた方には少々ハードルが上がったようです。

そこで、Flexなんて聞いたことない方から、初めてFlexを使う方やFlashは使った事あるけど・・・という人に参考になるチュートリアル（参考）サイトを紹介します。

先ずはAdobe社が提供しているFlexリソースサイトです。
コチラにインストール手順からユーザーガイド・リファレンスガイドからFlexを使ったAIRアプリケーションの開発やActionScript 3.0のプログラミング概念の基本など参考になるとこが多数記載されています。

http://www.adobe.com/support/documentation/jp/flex/
こちらもAdobe社の提供しているサイトです。
ここでは、Flexでどういったサイトやシステムが構築できるかなどのサンプルが掲載されてます。それ以外にもFlex3の入門チュートリアルやコミュニティなども公開されていて内容は十分です。

http://www.adobe.com/jp/devnet/flex/
Flexについて詳しく解説しています。
いまさら聞けないFlex、そして、今こそ入門のとき!?と題をうってあるだけあって、詳しくわかりやすく書いてあると思います。

http://www.atmarkit.co.jp/fwcr/special/flexent/flexent_1.html

ここからはFlex2とバージョンが一つ前になりますが、参考になるので紹介します。

Flexで用意しているコンポーネントを紹介しているサイトです。

http://shigeru-nakagaki.com/index.cfm?Content=Flex2Samples
Flex２でWebアプリ開発を紹介しているサイトです。
Webアプリケーション開発の基本を紹介しています。
http://www.atmarkit.co.jp/fwcr/rensai/flex201/02.html
ゼロからはじめるFlex 2 - Flex 2で作る簡単なWebカタログと商品注文フォーム
ページ数が10ページにわたって詳しく書いてあります。
http://journal.mycom.co.jp/articles/2007/11/12/flex2/index.html
Flex２でアウトラインエディタを製作してみる
サンプルプログラムを作成して、Flexの基本を学べますが、細かいことは書いてありません。
http://codezine.jp/a/article/aid/1764.aspx
Flexの使い方や仕様変更を29回にわたって詳しく書いてあります。
Flex3の最新の事まで記載してあります。
http://itpro.nikkeibp.co.jp/article/COLUMN/20061110/253336/
Flex２の基礎講座です。
インストールから様々な使い方・機能紹介など23章にわたって紹介してあります。
http://www.necst.co.jp/product/ibiz/column/flex/chap1.html