アクセスランキングブログパーツ

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ブログレイアウトがずれる現象への対応

つい先日、ブログのレイアウトを調整した~という記事(参照:カラフル)を書きましたが
その直後から、「レイアウトが崩れてる」との連絡を頂きまして(A´・ω・)

本来は、↓のような3カラムレイアウトだったのですが

テンプレ変更後

IE6の人や、ディスプレイサイズが1024*768の人の画面では
左カラムが、メインカラム(記事)の下に表示される不具合が出ていたらしいです><


アクセス解析を見ると、
IE6.0で閲覧している人は23.5%
1024*768で閲覧している人は18%

恐ろしいことに、IE5.5で閲覧している人も1%いました。
IE5.5だとウチのブログ、エラーを吐くんですが・・・w

らすく-IE5,5s

↑IE5.5で見た「らすく。」
デザインも崩れるし、CHUSEN-RINGなど一部のスクリプトが表示されません><
環境の差って恐ろしいですネ。
できればIE7.0以上での閲覧を推奨したいのですが・・・・

それでも、ブログ開設者としては
閲覧者の環境を選ぶのは本意ではないので、色々と調べていました~
IE5.5, IE6, IE7, IE8の確認が同時にできる -IETester | コリス
↑まずはこちらのブログ記事を参考にして、IEの各種バージョンでの見え方を検証。
IE5.5では、まともに閲覧できませんでしたが・・・
IE7では正常に見えているのに、IE6ではズレて見えていたのを確認。


試行錯誤の結果、CSS(スタイルシート)で
レイアウト用ブロック「wrapper」にoverflow属性を追加することで調整できた様子
(参照:overflow 表示と配置

div#wrapper {
float : left;
width : 800px;
overflow: visible;
margin-left : auto;
margin-right : auto;
}


多分これで直ったと思います・・・

IE6ってなんてめんどくさいんだorz

現在、最新版のIE8が出てますので
IE6の方は、是非ともアップデートおすすめします!
他ブラウザを使ってる方でも IE8をDLすると既存ブラウザが更に早くなるとか?
私も先日までIE7だったので、とりあえずアップデートしておきました。
少なくとも、一度タブブラウザの便利さを知るとIE6以前には戻れないですヨ。

とはいえ、個人的にWebブラウザはSleipnirが使いやすいと思ってます
IEと操作性がほとんど変わらないし、軽いし( ´ω`)
一時期、IEがやたらフリーズするようになってたので乗り換えたんですが、非常に快適デス。
FireFoxやOperaの方がセキュリティ的に安心、という話も聞きますが
微妙に慣れないので。。。w


そうそう。
今回、Multiple_IEというものを使ってIE3.0でも閲覧してみたのですが・・・

らすく-IE3

文字化けして閲覧どころじゃありませんでした(lll゚Д゚)ヒイィィィ

ついでに、AIONの公式サイトも見てみましたヨ。
・・・・こっちも酷いですね^^;

AION公式 IE3



<結論>
ウェブデザインは閲覧者の環境に配慮しよう。

なかなか難しい話です_ノ乙(、ン、)_
まぁ、流石に現在IE3.0使ってる人はいないと思いますがww
IE5.5使ってる人もゼロではないんですよねぇ。


それと今回、解像度を変えて閲覧してて分かったんですが
1024*768の画面でSleipnirを使って閲覧していると、横スクロールが出てしまうんですね・・・
私の画面は1280*1024なので、全く気にしていませんでした(;・∀・)
以前、クリスさんのブログで書かれていたので気になってたんですが
(参照:C.C.C.MMO.Diary ブログカスタマイズ
ようやく納得しました。

クリスさんのブログは全体幅950px
私のブログは全体幅1000px(少し前までは1024pxでした)
1024*768で閲覧するには、少し広いかな?
そのうち、またテンプレを微調整することになりそうです><


※一応、私の画面ではどのブラウザでも正常に表示されていますが
未だに表示が崩れて見える場合、宜しければ環境を添えてコメント下さい!!┏○))

comments

No title

IE8ですが、一番上のバナーがなぜか2つ連続で見えてしまってます。

No title

前ずれてたけど
うちは普通に戻ったー

今日は授業さぼってクラスの皆で日食みる!

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

No title

>仙龍さん
ご報告ありがとうございます><!
微調整してみたので、ご確認頂ければ幸いですっ


>アルエナさん
よかった~(;´・ω・)ホッ
日食、皆既で見たかった・・・鹿児島行きたいよぉおおw
でも天気が心配だ><

>非公開サマ
いえいえ、貴重なご意見いただけて助かりましたっ!!
いつも見てくださって本当にありがとうございます^^
今後とも頑張って更新していきますねっ(`・ω・´)

御苦労さまです

これね、苦労するんですよね・・・
ブログにしてもHPにしても、「なるべく多くの人に快適な状態で見てもらう」
というのを考え出すと、ほんとに頭が痛くなります><

なので私の場合は、なるべくこじんまりと作る傾向にw
いろんな解像度のディスクトップや、ノートなどで確認はしますが
IEのバージョンまでなかなかできなかったんですよw
なにやらよさそうなブログを紹介していただいてるので
早速見てみようと思います!

これからも楽しみにしてますので(カスタマ含めてw)
がんばってくださいね!

Re:

>蟻さん
どもども><
ブログのテンプレって、結構悩むんですよねぇ・・・・w
コンテンツが多いせいか、幅広の方が安定する気がするんですが
やっぱりコンパクトにまとめた方が見やすいですよね><
色々頑張ります!ありがとうございます♪

No title

修正お疲れ様でした!
1024*768の画面で見てますがブログの崩れが直ってます。
私がHP作り始めた頃はまだ800*600とかで作ったほうが閲覧してくれる方にいい環境でしたが
最近はモニターが大きくなってきたので800*600どころか1024*768の人も減ってきたかもですね。

Sleipnir使いやすくていいけど
左横にちょこっとでてるタブがちょっと邪魔で
これのせいなのか横幅調節しないとびみょーな横スクロールが出て苦労しました(;´Д`)
この記事を見てFireFoxやOperaやSafariあたりの
使用人口が多そうなブラウザーはやっぱりつかってチェックしてみないとって思いました。

No title

vistaなのでIE8がデフォだz

そんなこんなでLV37にナリマシタ

採集60くらいの生産0だけどね!

いつイズラフェルにくるんですk

No title

トップのバナー直ってますぅ。ありがとー

No title

>クリスさん
ありがとーーう!
ネトゲしてる人が多いせいか、1600*1200とかの人も結構いるみたいです。
でも、なるべく小さめのサイズで作った方が閲覧しやすいですよね;;
参考にします><!


>しばちゃん
うほwwパネェwwww
イズラフェルは常に作成制限ががg!
そのうちね、そのうち!!

>仙龍さん
よかったです!こちらこそ教えてくださってありがとうございましたっ

comment form

管理者にだけ表示を許可する

trackback


この記事にトラックバックする(FC2ブログユーザー)

カウンター
プロフィール

らくす

Author:らくす
AION ジケル鯖天族で活動中。

キュア Lv60
チャント Lv60
スペル Lv60

過去のMMO歴

raku_lei @raku_lei
Twilog

メールフォームメールフォーム

※匿名コメントは弾く場合があります
※スパムコメントはIP制限
※巻き添え食らった方はメールにて

カレンダー
09 | 2017/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
Twitter...
らくす(@raku_lei) - Twilog

らくす < > Reload

リンク元ランキング
QRコード
QR
RSSリンクの表示
AION・関連記事

雑学
序盤にやっておくべきこと
SSリネームツール
AION語源探求①
AION語源探求②
多ボタンマウス(MX518)のススメ
続・多ボタンマウス(G500)のススメ
覚えておくと便利なショートカット集
変更できる便利な設定
料理達人クエスト(天族)
ドラウプニル洞窟SC動画紹介
【検証】フレンドリストとブロックリスト
ポエタA攻略メモ(シールド用)
ポエタA攻略メモ(キュア用)
チャット入力モード切り替えの小技
幸運の涙集め(天族)
タハバタ攻略(キュア専用)
タハバタ攻略(チャント専用)
地下ウダス簡単攻略
寺院・職別ドロップ一覧
10分で確実にルート権売りする方法
TAF設定方法
第一テンペル訓練所 攻略まとめ
空間の支配者バンク 攻略
AIONの絵文字
遺物 スタック数とAPメモ
ティアマト城塞、攻略メモ
ティアマトの安息所 攻略法
安息所徹底攻略! 役割別まとめ

キュアの話
キュアマクロ紹介(Lv26)
キュアマクロ紹介(Lv44)
キュアマクロ紹介(Lv55)
キュアの装備について(Lv41時点)
キュアの最終防具(Lv50時点)
キュアの最終防具(Lv55時点/ver2.1)
キュアの詠唱装備
キュアの増幅ワンド
キュア☆ウイング上級スティグマ
Lv50現在ショートカット&スティグマ構成
Lv55暫定版ショートカット
キュアスティグマまとめ
上級回復型スティグマ使用感
キュアのPSの上達を振り返る
スティグマ組み合わせ考察(Lv50)
スティグマ組み合わせ考察(Lv55)
初心者キュアの為のAION基礎知識
初心者キュアの為のPT講座
初心者キュアの為のドレドギ講座

覚えておきたいバフとデバフ
シールド&ソード編
シャドウ&ボウ編
スペル&スピリット編

ハウジング
音楽スクリプト(メモ)
MML検証

アビス要塞戦基礎知識 Index
要塞戦に参加するメリットとは?
フォースの編成
アビスでの戦闘(基本編)
アビスでの戦闘(発展編)
アーティファクト
低スペック・低レベルができること
最近の記事
最近のコメント
最近の人気記事
誅仙・攻略記事
完美世界・攻略記事
月別アーカイブ(タブ)
カテゴリー
グリムス
植林中・・・
検索フォーム
ユニークアクセス
テスト設置中
重複カウントしてます