Archive for 2月, 2010
ブラウザシェアと画面解像度のランキング 2010年1月期
現在管理している4サイトでのブラウザシェア及び画面解像度
期間：2010/01/01-2010/01/31
前回計測からすでに８ヶ月程度経って、ブラウザシェアと解像度にも変化が出てきました。
以下のデータの中からはグルメ検索サイトがUU,PVともにトップで統計としてはそこが一番役に立つのではないでしょうか。
傾向としては、IE7からIE8への移行が多く、IE7よりもIE6を使用している人の方が多くなっているという現象や、横長のディスプレイを使用している人が増えてきたこと、そしてやはりスーマートフォンユーザーが少しずつ増加しているということでしょうか。
■ブログ(プライベート・アメブロ)
1. Internet Explorer—–70.78% 前回78.18%
—7.0 60.55% 前回79.73%
—6.0 22.02% 前回19.93%
—8.0 17.43% 前回0.33%
2. Safari—–12.34% 前回6.75%
3. Firefox—–7.14% 前回11.95%
4. Lunascape—–7.14%
5. Chrome—–2.60% 前回0.52%
1. 1280×800 —–27.92% 前回29.87%
2. 1024×768 —–24.68% 前回34.81%
3. 1680×1050 —–12.99% 前回5.19%
4. 1093×614 —–9.09% 前回5.19%
5. 1280×768 —–7.14% 前回3.64%
6. 320×396 —–5.84% 前回5.19%
7. 1400×1050 —–3.25% 前回3.38%
8. 1280×1024 —–1.95% 前回4.16%
9. 1366×768 —–1.30% 前回6.49%
10. 1440×900 —–1.30% 前回2.60%
■地方のシネコン
1. Internet Explorer—–86.47% 前回89.80%
—8.0 47.48% 前回2.88%
—7.0 26.60% 前回58.45%
—6.0 25.47% 前回37.61%
—5.5 0.29% 前回0.69%
—5.0 0.12% 前回0.10%
2. Firefox—–4.17% 前回3.82%
3. Safari—–3.97% 前回2.25%
4. NetFront —–2.28% 前回2.37%
5. Chrome—–1.22% 前回0.59%
6. Opera—–0.89% 前回0.86%
7. Lunascape—–0.45% 前回0.86%
8. Mozilla Compatible Agent —–0.34% 前回0.86%
9. Playstation 3—–0.09% 前回0.86%
10. Playstation Portable —–0.03% 前回0.86%
1. 1024×768 —–30.45% 前回37.44%
2. 1280×800 —–20.46% 前回20.03%
3. 1280×1024 —–16.70% 前回19.98%
4. 1440×900 —–4.91% 前回4.64%
5. 1366×768 —–4.72% 前回1.31%
6. 1680×1050 —–4.66% 前回4.05%
7. 1920×1080 —–2.08%
8. 1280×768 —–1.82% 前回2.32%
9. 320×396 —– 1.57%
10. 1920×1200 —–1.10% 前回0.95%
■地域グルメ検索サイト
1. Internet Explorer—–88.75% 前回91.14%
—8.0 42.31% 前回2.36%
—6.0 32.19% 前回42.84%
—7.0 25.08% 前回53.76%
—5.5 0.40% 前回0.62%
—5.01 0.01%
2. Firefox—–5.19% 前回4.38%
3. Safari—–3.62% 前回2.81%
4. Chrome—–1.26% 前回0.57%
5. Opera—–0.58% 前回0.83%
6. Lunascape—–0.21%
1. 1024×768 —–32.71% 前回40.66%
2. 1280×800 —–21.93% 前回20.45%
3. 1280×1024 —– 18.59% 前回20.69%
4. 1366×768 —–4.32% 前回0.82%
5. 1440×900 —–4.24% 前回4.01%
6. 1680×1050 —–4.17% 前回3.91%
7. 1280×768 —–1.72% 前回2.30%
8. 1920×1080 —–1.69%
9. 1920×1200 —–1.19% 前回0.79%
10. 320×396 —–1.03%
■Yahoo!ショッピング 寝具ショップ
1. Internet Explorer—–84.85% 前回86.37%
—8.0 52.69% 前回3.93%
—6.0 24.85% 前回37.70%
—7.0 22.21% 前回57.87%
—5.01 0.10%
—5.0 0.05% 前回0.18%
2. Firefox—–7.27% 前回7.89%
3. Safari—–4.65% 前回4.10%
4. Chrome—–1.27% 前回0.90%
5. Lunascape—–1.15%
6. Opera—–0.35% 前回0.47%
1. 1024×768 —–26.45% 前回36.90%
2. 1280×800 —– 21.75% 前回19.68%
3. 1280×1024 —–15.97% 前回17.69%
4. 1440×900 —–5.20% 前回5.47%
5. 1680×1050 —–5.16% 前回5.54%
6. 1366×768 —–4.37% 前回1.17%
7. 1280×720 —–3.67% 前回2.07%
8. 1920×1200 —–2.31% 前回2.34%
9. 1920×1080 —–2.23%
10. 1280×768 —–2.06% 前回2.23%
overflow:auto;を指定した要素の背景画像が固定できない件
ある特定のボックスであるdivの高さと横幅を固定とし、テキストがその領域からはみ出る場合にスクロールバーが出る設定を以下のようにした。
div#messageArea{
width:600px;
height:150px;
overflow:auto;
padding:12px 10px;
border:1px solid #CCC;
background:#FCFCFC url(http://xxxx.jp/img/sampleaimage.gif) no-repeat 0 0;
}
まずこれでIE以外のブラウザでは背景画像をdivの領域内で固定できた。
このままだと、IEで背景画像はスクロールで消えてしまうため、
ここにさらにbackground-attachment:fixed;を追加。
div#messageArea{
width:600px;
height:150px;
overflow:auto;
padding:12px 10px;
border:1px solid #CCC;
background:#FCFCFC url(http://xxxx.jp/img/sampleaimage.gif) no-repeat 0 0;
background-attachment:fixed;
}
こうした場合、IE6以外のブラウザで背景画像の開始位置の解釈が変わり、ウインドウの左上が開始点となってしまった。
そのため、IE6専用にハックをつける。
div#messageArea{
width:600px;
height:150px;
overflow:auto;
padding:12px 10px;
border:1px solid #CCC;
background:#FCFCFC url(http://xxxx.jp/img/sampleaimage.gif) no-repeat 0 0;
_background-attachment:fixed;
}
ここまでで、FireFox3.6,Safari4,IE6には対応できた。
が、IE7では背景画像は出るが、固定はできていない状態。
ここまでが限界だったため、いろいろ調べてみたところ、
ここの一番下に探し求めていた情報がありました。
背景画像を固定しない場合
・背景画像を設定したボックス内の左上が0%位置となる。
・IEも同様。背景画像を固定した場合
・背景画像の0%位置は閲覧領域（自分の場合はウインドウの左上）となる。
・IEの場合、body要素とhtml要素に背景画像を指定した場合は上と同様。
・IE6でそれ以外の場合は背景画像を設定したボックス内の左上が0%位置となる。
・IE7でそれ以外の場合は閲覧領域（ウインドウ）の左上が0%位置となる。
ただ、自分の場合についてはdiv要素の位置が常にウインドウの左右中心で、上から200pxの位置にあったため、以下のように無理やり背景位置を固定とした。
div#messageArea{
width:600px;
height:150px;
overflow:auto;
padding:12px 10px;
border:1px solid #CCC;
background:#FCFCFC url(http://xxxx.jp/img/sampleaimage.gif) no-repeat 0 0;
*background-attachment:fixed;
*background-position:50% 200px;
_background-position:0 0;
}
IE以外のブラウザでは背景固定を設定しない（fixedにしなくても背景が固定されるから）で背景位置を００ポジションに設定。
IE6,IE7は背景画像を固定し、ウインドウの左上を始点として背景画像の位置を設定。
IE6は背景画像を固定にしても、背景画像の開始位置がdiv要素の左上になるためウインドウではなく、divボックスの左上を背景画像開始点とする。
カテゴリー
- browser (22)
- Chrome (2)
- Fire Fox (12)
- Internet Explorer (13)
- webkit (1)
- css (8)
- design (1)
- History (5)
- html / xhtml (5)
- JavaScript (2)
- Links (1)
- memo (3)