[B! css][Web] yogasaのブックマーク

yogasa id:yogasa

cssとWebに関するyogasaのブックマーク (3)

30分でできる！Webサイトを高速化する6大原則 (1/4)
Webサイトを制作するとき、「パフォーマンス」を気にしたことがあるだろうか？　もしまったく気にしたことがないなら、気をつけた方がいい。閲覧に時間のかかる“遅いWebサイト”はユーザーにフラストレーションを与え、閲覧をやめさせてしまう恐れがある。下記のグラフは、「Simple-Talk」という海外のオンラインメディアで発表されたユーザー調査の結果だ。アンケートページの表示にかかる時間を意図的にコントロールし、表示時間によってユーザーが感じるフラストレーションの違いを調べたものだ。縦軸がフラストレーション（10段階）、横軸が表示までの時間を表している。1～5秒以内にページが表示された人に比べ、ページ表示までに5秒以上かかった人は2倍以上もフラストレーションを感じている。フラストレーションがあまりに高ければ、せっかく何らかの目的を持って訪れてきたユーザーも待ち切れずにブラウザーを閉じてしまう
yogasa 2009/09/17
html

web制作

performance

Web

css

高速化
リンク
[CSS]クロスブラウザ対応、高さの異なるカラムを揃えるスタイルシート | コリス
Matthew James Taylorのエントリーから、高さの異なるdivで組んだカラムの高さを揃えるスタイルシートを紹介します。 Equal Height Columns with Cross-Browser CSS & No Hacks demo: 2カラム demo: 3カラム以前、紹介した「高さの異なるカラムを揃えるスタイルシート」では、ページ内アンカーで要素が消失したり、IEで印刷できないなどの不具合がありましたが、今回紹介するものは、その２つの不具合が無いものとなっています（IE7調べ）。対応ブラウザは、IE5.5, 6, 7, Fx1.5, 2, 3, Op8, 9, Safari, Google Chromeなどほとんどのものに対応しています。仕組みはカラムごとにdivを用意し、それぞれをずらして配置します。下記は、そのイメージです。
yogasa 2008/10/31
css

design

Web

web制作
リンク
[CSS]フォーム要素に半透明のナビゲーションを重ねるスタイルシート
CSSplayのエントリーから、スクリプトを使用しないで、フォーム要素に重ねて表示できる半透明のドロップダウン型のナビゲーションのスタイルシートの紹介です。 Multiple sub levels over select boxes iframe fix #3 - transparent 対応ブラウザは、 IE6, IE7, Firefox, Safari, Opera and Google Chrome Betaとなっています。 IE6対策としては、条件付きコメントでtable, iframeが使用されています。
yogasa 2008/09/09
css

Web
リンク
1