コーディングガイドライン

構造と見た目の分離の必要性

HTML は Markup (意味付け)する Language (言語)です。例えば文脈のなかで、「ここは見出しですよ」「ここは段落ですよ」などという感じに「意味付け」を行い、文書構造を記述するための言語です。

ところが HTML は Web ページのレイアウト目的に使う仕様が多数盛り込まれ、その簡便さ、習得のしやすさと柔軟性から、本来の「意味付け」以外のレイアウトや見栄えに関する要素が多く使われていました。

それでは本来の HTML の目的に反するということで、「見た目」の部分を担当する CSS が策定されました。

建築物に置き換えるならば、きれいな骨組みの建物(HTML)に壁の色を塗ったり窓の形を変えたり(CSS)という感じでしょうか。いくらきれいな色を使っていても設計ミスの建物では使い物になりません。文書でも同じことが言えるもので、プレーンに理解しやすい文書が書かれていれば、その文書を携帯電話用、印刷物用、音声読み上げ用、というように見た目の出力を様々に変更することができるのです。

構造と見た目を分離することは、資源が柔軟に再利用できるようになりますので、大掛かりなデザイン変更にも比較的短時間で対応できるようになり、多くのメリットがあります。

複数の人と共同で設計・運営する際の問題

構造と見た目を分離することのメリットはかなり大きいので、早速実際に導入していきましょう。最近は Web 標準に関する解説書や動きも多数出ていますので、小規模なサイトをつくる場合などは基礎知識があれば比較的スムーズに導入できることと思います。

ところが、大規模なサイト運営や、複数の人とWeb アプリケーションの開発を行う場面ではどうでしょうか。記述ルールがばらばらになっているためにせっかく生産性があがるためのスタイルシートのはずが、余分な手間が増えてしまっていることは往々にしてあるのではないかと考えられます。

下記に、よくありがちと思われる場面を挙げてみます。

同じプロパティがまたでてきたりしてスタイルシートがかなり冗長だ。さっき定義したはずじゃないか。
前に自分がつくったスタイルシートを導入しても class 名がまったく違うので使い回しがきかない。同じ組織内なのに命名規則がちがうので書き直しが必要だ。
メンテナンスが大変だ（もしくは、メンテナンスしきれないくらい読みにくい）。

だからこそ一定のルールが必要

そのような問題が極力起きないようにするために、最低限そろえておきたいガイドラインに沿ってコーディングすることで、ますます資源が再利用できます。

他にガイドラインに沿って記述するメリットを挙げますと、

自分流コードと違うものをむりやり理解してイライラするなどの無駄がなくせる（ほんと無駄なので決めておいたほうが良い！）。
２カラムを３カラムにしたい、サイドバーを右から左にしたい、などのレイアウト変更が一瞬でできてしまう。
プログラマとデザイナーの連携がとりやすくなる。
デフォルトスタイルシートが洗練されていれば、デザイナーがいなくてもそこそこの品質のアプリケーションができてしまう。
デザイナーがデザイン（画像のつくり込みやバランス感覚、色づかい）に専念できる。

実は私の中では「デザイナーがデザインに専念できる」ことの重要性をかなり重視しています。よほど複雑なレイアウトを試みない限りもうレイアウトで悩まない。フォントサイズで悩まない。Photoshop でイメージを描いてスライスすればすぐにコーディングが可能となるくらい簡単にしたい、という思いから、ガイドラインを書きたい衝動が起きました。

また、デザイナーの力がなくとも、整備されたデフォルトスタイルシートを使うことにより、全てのひとに一定水準の環境を提供できるのではないかと考えています。

そして、ルールが一貫していることが大切

ルールは作っただけでなく、作ったルールを実行して「一貫させる」ことが大切だと思います。なぜでしょうか。

それは、メンテナンスが容易になり、同じグループのものを一度に大量変更するような変更にも柔軟に対応できるからです。また、ルールが一貫していることでプログラムが解釈しやすい文書になります。新人教育という観点で言えば、指導しやすくなるというメリットもあります。

記述ルールが一貫していないと、文書作成者以外の人がみたときにわかりづらいだけではありません。例えば、現在 XHTML 1.0 で書かれている文書を将来的に XHTML 2.0 に適合するように書き換えるという場面に遭遇した場合に、見出しの順序やチャプター・セクションの統一した囲み方を統一したルールに従って記述さえしてあれば置換命令もとても簡単にできますが、もし、統一されていなかったら自動処理はとても難しく、手作業による変更を強いられてしまいます。

ルールで「縛り付けてしまう」問題点も忘れずに

ルールを覚えることに遠回りするようではあまり意味がありません。また、ルールは継続的に守られていないとメリットが享受できません。ルールのためのドキュメント作成に膨大な時間がかかるようなら生産性が下がるどころか本末転倒ですね。

そんなことがおきないように、常に目的を見失わないようにしたいものです。ウェブ制作者は制作をして「お客様／使う人を喜ばせる」「対価を得る」など必ず目的があるはずです。目的を果たす為に効率のよい方法の１つとして「ルール」は存在すべきと思います。

（だとしてもせめて、ひとつの文書内くらいは同じ規則でおきたいものですね。なぜなら書いた本人があとで見てわからなくなってしまうから。）

その他、往々にして起きる問題についてはソフトウェア工学の名著「ピープルウェア」という本で詳しく述べられています（ピープルウェアの要約ページ Chapter17 がピンポイントだと思います）。

謝辞

ガイドライン作りの重要性については CSSNite vol.7 Web制作現場の対立を解消する！(X)HTML+CSSガイドライン作り - 益子貴寛(サイバーガーデン)さんの資料を参考にさせていただきました。すべての Web 制作に関わる方に有益な内容だと思いました。ありがとうございます。