サイト（ブログ）作成時に役立つ、オススメ情報やサイトを紹介

---

当サイトも利用しているFC2のブログやLivedoorブログ、Movable Typeなど現在、
ブログでのサイト構築が流行しています。

ブログの特徴である「プラグイン」や「テンプレート」を利用した
「カスタマイズの手軽さ」はとても便利です。

話はさておき、皆さんはどんなブラウザでインターネットを見ていますか?

IE（InternetExplorer）でインターネットを見るという方がほとんどだと思いますが、
サイトをお持ちの方で普段、IEでしかブラウジング、
サイトのチェックをしないという方には是非、
色々なブラウザで自分のサイトの見た目をチェックする事をオススメします。

「IE」のみを使って、見栄えに関して今まで気にしていなかった方は
「Firefox」や「Netscape」などでサイトを見たら、
あまりの見栄えの違いにビックリする方も居るかも知れません。

IEの他に有名なブラウザでは「Firefox」、「Opera」、「Netscape」、
Macの「Safari」などがあります。

冒頭で「IEの互換モード」の件に触れましたが、
IEにはCSSを誤解釈する有名なバグ（?）があります。
ブログ制作者も結構、苦労している点だと思いますが．．．

またIEには独自の拡張タグもあり各ブラウザ間での互換性や
CSSでの見栄えの同一性を保つのは手間が掛かり悩むところです。
こういった問題を解決するためのヒントとしては．．．

1.サイト制作者向けのトピックのある（サポート）掲示板で
ログ（既存の記事）を探す。

ログを探してなければ、スレッドを立ち上げ、質問を投げてみましょう。
（立ち上げたら、数時間から1日ほど待って、返事を確認してみる。
もし返事（レス）があったら低姿勢な言葉遣い（書き方）で質問し、更なるヒントを聞き出す）

2.Googleで調べる

（「Google」で検索する事は「ググる」なんて言う風にも呼ばれますね）
キーワードは関連性が高いと思われる．．．
（「レイアウト」、「CSS」、「ブラウザ」、「互換性」、「崩れ」、「IE」）
などで検索すればすぐに対処方法が見つかるはずですが．．．

3.HP制作会社のサイトを見てみる。

（たいていのHP制作会社のサイトは「無駄や誤りのないhtml」でサイトを作っています。
そのサイトのhtmlのソースを見ればヒントが色々見つかると思います。
ブログ制作者の方だったら、見つけた会社のサイトがブログなら、
なお参考になると思います。
また、フリーランスでサイト制作を仕事にしているような方も大抵、
個人サイトを公開しているのでそれを参考にするのもオススメです。

3.W3Cのバリデートサービスを利用する。

参考にしようとしているサイトが「どの程度、お手本になるか?」は試しに
W3Cのバリデートサービスでそのサイトをチェックしてみるといいと思います。
htmlの誤りを確認できますし、自分のサイトでのチェックも出来ます。

4.「Another HTML-lint gateway」を利用する。

W3Cのバリデートサービスに対し、日本のサイトだと、
細かくチェック項目などを設定できる「Another HTML-lint gateway」という
htmlの採点、構文チェックプログラムを公開されている「k16」さんのサイトもオススメです。
オンラインでチェックも出来ますし、ソフトとしても配布をされています。

5.色々なブラウザで見栄えを確認する

上述の数種のブラウザで確認すれば、ほぼ間違いないと思いますが、
「アクセシビリティ」に関心がある方は
テキストブラウザの「Lynx」でも確認する事をオススメします。

また最近のブラウザで人気があるところで言えば、
「Sleipnir」や「Lunascape」などもあります。
なるべく色々なブラウザでチェックして見て下さい。

6.「Browsershots」でレイアウトを確認する

オンラインで様々なブラウザ環境でのサイトの見た目をチェックできる
「Browsershots」というサイトもオススメです。
このサイトは「ユーザーが指定したアドレスのページに様々なブラウザでアクセスし、
キャプチャーしてそのスクリーンショット（画像）を保存する」
と言ったサービスを提供しています。

指定したアドレスのページは数種のブラウザによって
フルサイズでキャプチャー画像が保存されます。

キャプチャー画像の保存には数時間から数日掛かるようなので、しばらく時間を置いてから
再度、「Browsershots」のサイト、トップページ上の入力フォームから指定のアドレスを入力すると、
見事にキャプチャー画像を保存してくれているはずです。

特にMacの「Safari」でのサイトの見栄えを確認できるのが嬉しいところです。
他には「UNIX」での「Firefox」でのサイトの見栄えを確認できたり．．．
と、何かと重宝するサイトです。

以上、上記の方法で大抵の問題は解決すると思います。
「HPの作り方がさっぱりわからない」という方でもすぐに実行可能な対処方法です。
わざわざ、HP制作の参考書を買う必要もありませんし、
時間も手間も掛かりません。

是非、今回の記事を参考にしてみて下さい。

参考リンク 関連ページ

「Internet Explorer」
「Microsoft」社日本サイト内「Internet Explorer」ページ
http://www.microsoft.com/windows/ie_intl/ja/default.mspx

「Firefox」
「Mozilla Japan」公式サイト内「Firefox」ダウンロードページ
http://www.mozilla-japan.org/products/firefox/

「Netscape」（日本）
「Netscape Japan」公式サイト
http://wp.netscape.com/ja/

「Netscape」（アメリカ）
「Netscape 8.1」公式サイト内ダウンロードページ
http://browser.netscape.com/ns8/

「Opera」
「Opera」公式サイト
http://www.opera.com/index.dml

「Lynx」
「Lynx」配布サイト
http://lynx.isc.org/

「Sleipnir」
「Sleipnir」公式ページ
http://sleipnir.pos.to/

「Lunascape」
「Lunascape」公式サイト
http://www.lunascape.jp/

「W3C Markup Validation Service」
「W3C」サイト内「Markup Validation Service」ページ
http://validator.w3.org/

「Another HTML-lint gateway」
「K16」氏サイト内「Another HTML-lint gateway」ページ
http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

「Browsershots」
「Browsershots」公式サイト
http://browsershots.org/

自分のサイトがほかのブラウザでどう見えるか試す「browsershots.org」
http://gigazine.net/index.php?/news/comments/20060908_browsershots/

HTML文法チェック(構文チェック)
http://mook.jpn.org/archives/2004/12/html.html

少しきびしいHTML構文チェック
http://bd.dotted.jp/archives/38/

Firefox - HTMLコードをチェックするプラグイン HTML VALIDATOR
http://www.naviwave.com/blog_w/2006/11/15/69/