SPONSORED LINK
このエントリーをはてなブックマークに追加

あなたのブログは大丈夫?クロスブラウザチェックのススメ。


SPONSORED LINK

IMG 4154

分かっていたはずなのに…
一応、かつてWebデザインをかじっていたのに…
最近やってなかったのでいい気になっていました><。

Sponsored Links


自分のブログを見ている人の環境は、必ずしも自分と同じではありません。
自分にはちゃんと見えていても、誰かのところではひどいことになっているなんてことも。

そういうことを無くすために色々なOS、ブラウザでの見え方チェック、いわゆるクロスブラウザチェックをしておきましょう。


WebでチェックできるAdobe BrowserLabがいい感じ

でも自分はWindows(Mac)しか持ってないし…、なんだか難しそう…。

というあなたに朗報。

各ブラウザでの見え方をチェックするために、いくつかのアプリやサービスがあるのですが、色々試した中で私が良さそうだと思ったのがAdobe® BrowserLabというサービス。

アカウントの作成は必要なのですが、使っているWebブラウザからWIN/Mac、各種ブラウザの見た目を確認することができます。


利用は簡単

Adobe® BrowserLabのページから始めます。



ブラウザーテスト | Adobe BrowserLab

右のボタンから始めましょう。

ブラウザーテスト | Adobe BrowserLab 1

サインインかIDの作成を求められます。
普通の人はAdobeIDとか持っていないと思うのでさくっと作ってしまいましょう。。

ブラウザーテスト | Adobe BrowserLab 2

名前、メールアドレス、パスワードなどで簡単に作れます。


操作画面はこんな感じ

とりあえずURLを入力して更新ボタンを押せばOK

Adobe® BrowserLab

FireFoxで見たところ

Adobe® BrowserLab ie6

IE6で見たところ。
ほんとIE6とか爆発して欲しい><

という感じ。


ちなみにウチのブログはこんなことに…

ちなみにこのブログがどんなことになってしまっていたかというと…

切り抜きジャック chrome

こちらがChromeでの見た目。
しかしこれをIEやFFで見ると…

切り抜きジャックテスト ff

こんな有様に><

自分で無理矢理入れたサムネイル付き最新エントリリストの部分がひどいことに。
とりあえず原因を探ってみたけど分からないので応急処置として非表示にしましたが、これはちょっとなぁ…。
強引にサイズを合わせたCSSと自分で改変したPHPが原因だったので、修正しました。



一般的に手に入るテーマでこんなことは無いと思いますが、自分で手を入れた人なんかはちゃんとチェックしておいた方がいいかもしれませんよ!
(ていうかなんでやってなかった自分><)




今回のワシヅカミ

今回のワシヅカミポイントは

  • みんな同じ環境とは限らないという注意をしよう
  • ブラウザから各種ブラウザの見た目をチェックできるサービスが便利
  • 教えてくれた方本当にありがとうございます><

の3つ

ただこのサービスだとローカル環境のチェックはできないのでご注意を。
そして、ちょっとこのままというのもアレだし、ちゃんとするためにやっぱりテーマを作らないとダメかなー、とあらためて。

とりあえず見られる状態にはしましたが、それにしても焦りました…。

このエントリーをはてなブックマークに追加
この続きはタムカイズムで