Nucleusスキン『clear』
Nucleusスキン『clear』を作ってみました。
時代のキーワードはWEB2.0とVISTAと透明感。(既に死語。。)
アルファPNG画像を贅沢に使った逸品です。
PNG画像を自由に使えば、デザインのバリエーションは飛躍的に広がるでしょう。
CSSは最低限の設定だけを行っていますので、タグに関しての詳細なスタイリングの必要性があります。
ご意見等ございましたらお知らせ下さい。可能な場合は次期バージョン? で反映させたいと思います。
AlphaImageLoaderを上手く使うために便利なライブラリを見つけたので、利用させていただきました。
今回作成していて感じたことは、
- アルファPNG画像を使えばかなりデザインの幅が広がる
※かなり画期的なデザインができそうな気がする・・ - 透明画像と不透明画像のレイアウトをしっかりと考えなければならない
- 自由度が高まる反面、画像加工、HTML、CSSのスキルが必要とされる
- 可能であれば、全てPNG画像に統一した方が良い
- jpgで苦労してやっている背景への“馴染ませ”などは必要なくなる。
- IEではformの背景に上手く使えない
※現在調べていますが、何方か知っていたら教えてください。 - もちろん結果として透明感を出すだけではなく、画像の合成方法としてとらえた方が良いだろう。
グラデーションの配置や簡単なフレームアニメーション、ナビゲーションなど・・
試しにこのスキンを見てみたいときはこちらをクリックして下さい。
スキンのコンテンツ部の許容幅が違っているため、レイアウトが崩れる場合があります。