SEOwalker

ブラウザには色々とあります。

前の記事でIEのバージョンによるスタイルの確認について紹介しましたが、他にも色々とあります。

firefox,safari,opera等色々とあります。

2008年２月現在のブラウザのシェアは
Internet Explorer - 74.88%
Firefox - 17.27%
Safari - 5.70%
Opera - 0.69%
Netscape - 0.68%
Mozilla - 0.59%
Other - 0.18%
となっているようです。

本格的なサイトだと、IE,firefox,safariの確認は必須といっても過言ではないでしょう。

スタイルシートを活用していると、スタイルが崩れていることが多々あります。崩れているだけならいいのですが、テキストの文字の色が背景色と同じになって閲覧できないこともあるのです。そうなれば死活問題です。

私のパソコンには色々なブラウザが入っています。

IEでもバージョンが違うとスタイルが違って見えます。

IE4、5、5.5、6、7、現在はベータ8が出ています。

スタイルシートの認識方法がちがうので、スタイルが崩れていたり色の認識方法が違ったりすることがあります。

IEは世界で標準のブラウザなので避けて通ることはできません。

同じIE6、IE7でさえ認識方法が違うので、違ったデザインに見えることがあります。

内容が見えることが必須ですが、背景と文字の色が同じになっていたことが一度ありました。

Install multiple versions of IE on your PC | TredoSoft

のフリーソフトを活用して私は確認しています。基本的に同じOSには複数のIEをインストールすることはできないのです。以前IE6とIE７が混合してOS上で不具合が起きたことがあり、マイクロソフトに電話をしたことがありました。

タイトルの場所を見てもらったらわかると思いますが、複数のIEを同時に開くことができます。

私のパソコンだと、標準のIEは7です。

私のパソコンだとIE5以前は不安定なので、テンプレートをいじる時ぐらいしか活用しません。

現在だとIE6とIE7の閲覧確認は必須かと思います。

このふたつのブラウザでアクセスの半分以上の閲覧者が活用しているからです。

W3Cに準拠しているかどうかをチェックしてます。
重要度としては、それほど高くはないと思ってます。
準拠していないサイトでも上位には、たくさんあります。
とはいえ、W3Cに沿っている方が検索エンジンと相性が良いとされています。

見やすいサイトかどうかを調べる一種の基準だと思ってます。

日本語で例えてみましょう。
日本人であれば、多少間違って書いたとしても前後の文章より理解できるでしょう。
でも海外の人であれば・・日本語にたけている外国人であれば問題ないですが、まだあまり日本語がわかっていないのであれば、間違って理解する可能性が高くなります。
W3Cは、その程度のものだと思ってます。

文法をチェックしようとするとさらに基準が厳しくなるような感じがします。
名詞・助詞・尊敬語・丁寧語・謙譲語等と色々とありますよね。
そこまでチェックされていると例えれるかと思います。

私は、そこまでこだわってませんが、修正できるところは修正する程度って感じです。

このブログのテンプレートは、W3Cに沿って修正しています。

The W3C Markup Validation Service
　HTMLタグがW3Cに沿っているかどうかをチェック

W3C CSS 検証サービス
　CSSがW3Cに沿っているかどうかをチェック

CSSを解除してサイトを確認する方法をご紹介します。
CSSとは、スタイルシートのことです。

私は、Web　Developerというサイトをチェックするツール:SEOwalkerで確認してます。

CSSを解除した時に表示されるテキストの順番で、検索エンジンは読み取るのです。
一番上の方が重要視されやすいので、一番上の方に、強調したいキーワードがあるかどうかを調べています。

ちなみに無料ブログだと、細かいカスタマイズがしにくいので、大抵の場合、２スクロールまで全ページ同じっぽい感じのが多いです。
経験談より、YSTでは相性が悪く、インデックスされにくいのです。

私が思うに一番上の方が、全ページ同じテキストだと、ミラーサイトかも？って判断されてインデックスされにくいのだと思います。
3スクロールぐらい全ページ同じテキストが表示されて、その後本文が書かれていたら、トップページしかYahooでインデックスされませんでした。
テンプレート構成も影響してくるのは事実だと思います。
ちなみに、こちらのブログは、SEOを考えたテンプレート構成をしています

CSSを有効にしていると、こういった感じで表示されます。

CSSを解除した時の見え方です。
検索エンジンは、上記の画像のような順序で見ているといわれています。

一番上にあるテキストは、極力ページごとに違うようにしています。第一行目は一番重要視しやすいとされています。

alt属性で画像にテキストを入れましょう。

検索にかかってほしいキーワードを入れれる場所は、入れておいた方がいいです。

画像と無関係のキーワードをたくさん入れることがスパム扱いになります。

alt属性ってどうやって表示されるのって思う方に説明します。

画像にマウスを合わせると表示されるテキストのことです。

もし、画像がダウンロードできないと、IEだと、ご覧のようにalt属性で設定したテキストが表示されます。

目の見えない人は、alｔ属性のタグを音声で聞いたり、画像が表示できない場合は、テキストを表示したりします。
alt属性を入れ忘れている画像もあるかと思います。

htmlのタグを見ながらサイトを作成していると結構忘れます。

かといって、ひとつづつ画像をチェックしていると時間がかかります。

ブラウザでalt属性を見る方法を紹介します。

最近では、パソコン用URLを携帯で閲覧すると、携帯用ページに自動転送するか、携帯用のページを表示するサイトが増えてきました。

私は、携帯用ページに自動転送するように構成する場合が多いです。

携帯閲覧にも対応しているサイトを作成した場合は、
携帯ページに転送されているかどうかを確認する必要があります。

携帯電話でURLを一から入力していては時間がかかります。

QRコードを作成するソフトやサイトもありますが、URLをコピーして別窓で制作する方法もあります。
QRのススメ：【無料で作成！QRコード徹底活用サイト】というサイトはよく活用してます。

もっとQRコードを作成する時間を短縮する方法があります。

firefoxにQRコードを自動表示してくれるアドオンがあるのです。
Mobile Barcoder :: Firefox Add-ons

携帯サイトをよく制作している人には便利な機能です。

Barcodeというfirefoxの下にある場所にマウスを移動させます。2秒ぐらいすると・・

QRコードが自動表示されました。
頻繁に携帯サイトへの自動転送を確認する場合は、時間の短縮ができます。
docomoで携帯サイトの表示ができてもauやsoftbankでは携帯ページの表示をしてくれない場合がありますので、そういったときの確認用にどうぞ。

業者の方がQRコードを印刷してDMに貼り付ける場合は、こういった確認は必須といえるでしょう。docomoでもある機種はOKで別機種は見にくいといったことが多々ありますが
全ての携帯で閲覧を見やすくしようとすると、各携帯機種ごとにサイトを作成したり、スタイルシートの表示を変更したりする必要があるでしょう。

携帯サイトは、発展途上です。

画像のファイルサイズを表示してみましょう。
回線速度が不安定な場所だと、画像が一つだけファイルサイズが大きいとなかなか表示されないことがあります。

5年前は、ひとつの画像を複数に分割してホームページに貼り付けていた時代がありました。
私はその頃、ホームページ作成はしてませんでしたが・・。

私は、Web　Developerというツールで、ページ内の画像のファイルサイズを確認しています。

画像を購入しているサイトが背景になっています。
画像を購入してサイトに活用したのはよくても、画像のファイルサイズを小さくし忘れていることもあるかもしれません。
こちらの機能を活用すれば、一目でわかります。
別サイトですが、画像のファイルサイズを表示させるとごらんのようになります。

画面に画像のファイルサイズが表示されるので便利です。
サイトで表示速度が遅いなって思ったり、ファイルサイズを縮小し忘れて活用している画像はどれかな？って調べるときに便利です。

画像のファイルサイズが大きくても良いっていうなら活用する意味はあまりないかも

色盲の見え方をシミュレーションしてみましょう。

色盲の人に気を配った色彩でサイト構成をしたい人もいるかと思います。
身近な人にいればなおさらでしょう。
小学校のころ視力検査で、色を言わされるようなのがあったけど、それだと思います。
その頃は、なぜそういったことをするのかわからなかったです。

正常な人からすれば、どう見えるのかさっぱりわかりません。
男性は、20人に1人ぐらいの割合らしいです。
色盲にも色々とあります。
第一色覚異常
第二色覚異常
第三色覚異常
全色盲

そこで・・

色盲のシミュレーションをするソフトを紹介します。
ColorDoctorのダウンロード : 富士通

というフリーソフトがあります。
こちらを活用すれば、正常な人でも色盲の見え方をシミュレーションすることができるのです。