画像をかっこよく浮かす方法
画像をきれいに見せるためのテクニックとして、影をつける手法が有用だ。プロが作るようなサイトを見ていても、影をつけてかっこよく見せている例をよく見受けられる。もはやデザインの王道テクニックといっていいだろう。とはいえ、いちいち影をつける加工をするのは面倒だし、画像編集環境が十分にない人もいるだろう。そこで画像に動的に影をつける手法を紹介する。 (追記 2013/09/18 ) CSS3 の box-shadow や text-shadow を使えば、ここに書いてあるテクニックは不要となります* 画像に影をつける サンプルは こちら にあるので確認してみてください。 まずは画像を div タグで囲います。
FlashやCSSのデザインギャラリーサイトをあつめた「Zeniltuo.com」:phpspot開発日誌
Zeniltuo.com - inspiration journey - All website galleries in one page FlashやCSSのデザインギャラリーサイトをあつめた「Zeniltuo.com」。 以下、CSSギャラリーサイトの抜粋。沢山あるもんですね。 Artnetz Best Web Gallery brdcast CeeSeS Cool Site Collection Creative - Pakistan CSS - Website css Beauty CSS Blast - RU CSS Bloom CSS Brain - HU CSS clip CSS Collection CSS Container CSS Demo CSS Design .ru CSS Drive CSS Elite CSS Fill CSS Galaxy CSS Galer
ウェブページを見る目の動きは「F」パターン - GIGAZINE
つまり人間はページを見る場合、「F」の字を描きながらページ全体を見ているというわけ。 これは232人の被験者を対象に行われたもので、大体1ページから重要なコンテンツを見つけるために2秒から3秒というものすごい短時間に驚異的な速度でページを見ていくそうで。 で、その視線の経路をビジュアル化したのがこの画像。全部で3段階のステップを踏んでおり、各段階を踏んでいった結果、「F」の字を描くというわけ。大体どのユーザーも一貫してこのパターンを踏んでいるらしい。以下がその全3段階の説明。どういうレイアウトが効果的なのかが分かります。 F-Shaped Pattern For Reading Web Content (Jakob Nielsen's Alertbox) http://www.useit.com/alertbox/reading_pattern.html 第1段階： 訪問者は最初にページの
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://e0166nt.com/blog-entry-97.html
//// COLOURlovers :: loving colours since 1981
