【SEO初心者のEvoブログ】

ブラウザの違いによるレイアウト崩れ

テーブルレイアウトではなく、CSSでサイトレイアウトを行うとブラウザにより見え方が異なる場合があります。多少の違いはどうしても起こってしまうのですが、ブログなどのカラムが崩れると訪問ユーザに不快感を与えてしまいます。

当ブログはWordPressで作成しており、標準のテーマ（テンプレート）に手を加えつつ使っているのですが、サイドバーをカスタマイズする際にデフォルトCSSをそのまま利用すると、Firefoxでは下図のようにレイアウトが崩れてしまいます。

今回は、サイトバー部分のCSSの「width、float、clear」などで調節し、Internet explorer（以下IE）、Firefoxの両ブラウザでストレス無く見られるブログとなりました。

Web制作者でもない限り、自分が使っていないブラウザでどう見えているのかなんて確認しない方がほとんどだと思いますが、ユニークユーザーをリピーターにするためにも、ブラウザチェックは必須です。

FireFoxユーザが急増

当サイトの訪問者が利用しているブラウザは下図の通りです。

サイトやブログの主要ターゲットとなるユーザさんによる違いもありますが、管理サイトも含め昨年あたりからFireFox利用ユーザが増える傾向にあります。

個人的には普段IEを使っているのですが、Firefoxはとても優れたブラウザで、文字コードに関係なくソースが文字化けしないので、他サイトのソースを見るときに使用したり、アドオンのFirebugでサイト分析したりするときに活用しています。

当サイトのSEO対策コンテンツ「Firefox」と「Firebug」は、毎日結構な数の訪問者をGETしており、その点でもFirefoxの注目度は高いと思われます。

バージョンを変えてブラウザチェック

ブラウザチェックをする際に注意しなくてはならないことに、「ブラウザのバージョンによる見え方の違い」もあります。IE6とIE7ではCSSレイアウトによる見え方が大きく異なる場合があるのです。

各ブラウザの新バージョンが発表されてから、そのバージョンがユーザに浸透するまでに1～2年はかかります。そのため、主要ブラウザに関しては、旧バージョン・新バージョンともにチェックする必要があるのです。

当サイトのIE利用者のバージョンによる割合は下図の通りです。

IE7がWindowsの重要な更新に含まれたことによりIE７利用者が増えていますが、未だIE6利用者も多いのが現状です。

IEの新旧バージョンとFireFoxは最低限確認しておこう 

全てのブラウザに対応しておくことがベストなのですが、現状ではIE6、IE7、Firefox2.0で同じように見えていれば特に問題はないでしょう。訪問者にNetscape navigatorやsafari利用者が多い場合は、ネスケやサファリにも対応させておいたほうが良いでしょう。

自分のサイト訪問者がどのブラウザを利用しているかは、アクセス解析を設置すれば確認することができます。当サイトは無料アクセス解析のGoogle Analyticsを使用しています。タグ：Firefox Webテクニック