レシピと味見でおいしいコーディング

2008年4月30日(水)
池田 若葉

コーディングのデバッグはWebブラウザ

 コーディングのデバッグは、Webブラウザでチェックすることです。コーディングした成果物をチェックする場合、動作環境が重要になってきます。一般的にWindowsではInternetExplorerやFirefox、MacintoshではSafariやFirefoxなどのWebブラウザで制作した全ページをチェックします。

 また印刷にも対応したコーディングを行う場合では、上記のWebブラウザの印刷プレビューもすべてチェックします。

 HTML文法をチェックしたい場合は、W3Cの「Markup Validation Service」や「Another HTML-lint gateway」などの文法チェックツールが有効です。これらは制作したソースコードの文法を採点することができます。しかしサーチエンジン最適化対策を重視するサイトは、満点を重視することもありますが、「文法チェックツールで満点を取ること」=「Web標準に準拠している」と言うのは、間違った見解です。

 HTML文法チェックツールは、間違った入れ子やスペルミスなどの文法ミスはチェックしてくれますが、要素の意味など正しいマークアップをしているかまでは、判断できません。ここでの点数がすべてと思わないように制作しましょう。

進化する制作仕様書

 制作仕様書のドキュメントの種類は、ワード、エクセル、パワーポイントとさまざまですが、最近では、HTML化やPHPを使って動的に作業の進行状態をWebブラウザから閲覧できるものまで多くあります。

 文章ドキュメントにして紙媒体でも確認はできますが、HTML化するとペーパーレスかつ参照しやすいドキュメントが残せます。またPHPを絡めチェックをWeb上で行うなど動的にすることで常に最新の制作仕様書を共用が簡単にできるようになり非常に便利です。

 制作仕様書は「絶対に守らないといけない」という形にはまった掟ではなく、スタッフ同士のコミュニケーションを円滑にするもので、結果としてWebコンテンツの機能性および操作の互換性を高めることになることにつながります。

 もし現場に制作仕様書が存在しない場合は、まずは簡易的ものから作ってみてはいかがでしょうか。また今制作仕様書がある職場でも、アレンジを加えて制作に合ったオリジナルの制作仕様書を作りましょう。

 ここまで1ヶ月に亘ってご紹介してきました「正しいコーディング作法」ですが、正しいコーディングは、デザインのようにWebブラウザに表示される「見えるもの」で分かるものではないので、エンドユーザーは気にならないかもしれません。しかし正しいマークアップを行うことで目には見えないさまざまなメリットを得ることができます。正しいコーディングを行い、高いクオリティのWebコンテンツを追求していきましょう。

Webデザイナー。2000年~WEBやプログラミングに興味を持ちWeb制作会社や開発会社へ勤務。2008年からフリーランスとして活動しています。

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています