実際ページを運営してきて感じたある法則について語らせて頂きます
これは自分の運営しているコンテンツに関することではなくまたHTMLを理解している人に関してはとくに技術的なお話ではありません。
ちなみにこれは人の集まるwebサイトの制作、運営法でもなく。優れたwebデザインのお話でもありません。
どちらかというとページ制作に関する哲学のひとつといえます。
この法則は親となるひとつの法則があり、それに従う小さな法則が付き従います。
管理人自体、勉強中の素人ですから、もしかしたら他でこの事を書いていらっしゃる方がいるかもしれません。
もしその場合は管理人までご連絡いただけるとありがたいです。
大法則
変更に弱いWebページはそれだけで既に罪悪である
webページとはソフトウェアと同じで常に更新されるものである。これはもはや説明しないでも問題はないでしょう。
この変更は背景色から画像まで、デザインに関する大幅な変更から、topでのちょっとしたニュース、情報に間違いがあったための訂正など多岐にわたりますが、ここではその更新に強いwebページの製作法について語らせて頂きます。
これを実現するための一番の方法は
- HTMLを標準に準拠して書き、文書構造とサイトのデザインを完全に分離して書く。
- 見通しの良いコードを書き、テキストのサイズ程度は気にしない。
の２つになります。
HTMLを標準に準拠して書く事は検索ロボットからの精度を上げるためだけにあるのではないのです。
変更に強いwebページを作り、またwebページをデータベースに変換するための再利用性を高めて、文書を長く価値有るものにすることなのです。
そのためにはデザインに関するコードをすべてスタイルシートに分離して、文書の内容自体を守ならなければいけません。
これから上げる小法則のほとんどは、不本意ながらいままでのweb作成で良くされてきたことの否定をするお話です。
そのうち幾つかはweb作成に関して成り立ち続ける可能性のある魔法の鍵だと本人は思っていますし、悪い技術は淘汰されてなくなるものですから。半分以上の法則は数年で効果を失うでしょう。
管理人の考えて、他のHTML関連サイトでも多く語られていることは、幾つか省かせていただきましたので、それに関して知りたい場合は、他のサイトを当たってください。
小法則
デザインに多くの画像を使用してはいけない
画像とは制作に時間がかかる割に変更に非常に弱い。
しかもサイトの大幅リニューアルのある場合、大抵これは全ての画像を作り替えることになります。
どんなデザインにも噛み合う汎用性の高い画像というのはそうそう存在なんてしないのです。
もちろん、少しの変更で他のサイトでも流用できる画像を溜めておくことも一つの方法ですし、現在の状況を考えると、デザインに画像を使用できないことは非常に苦しいので、全く使わない訳にもいかないのが現実ですが、デザインに使用する画像は一つでも少ない方が良いのです。
webサイトとは、基本的にキーボードのある15〜21インチまでのディスプレイで見られることのみを考えて策定されてはいないのです。
もし、あなたの作ったサイトが大型のディスプレイで写される事になった場合。pxでサイズが指定されているあなたの画像は画面に不相応に小さく表示される可能性もあるのですから。
classの名前を見栄えから付ける
これに関しては、実例を一つ上げた方が良いでしょう。
綱吉:「なあ、陽子…、前からひとつ聞きたかったことが…」
陽子：<em class="red">「胸のサイズは聞くなっ」</em>
綱吉：「何でわかったんか…」
ここではclassの名前を文字を赤くしていることからredとしているが、これはあまり良いことではありません
もしあなたのサイトがリニューアルされたときに背景色を赤に近い色…、例えばピンクに変更したとき、可読性を上げるために、class="red"で付けられている文字の色を変更することになるでしょう。
そのとき、赤で表示されていないクラスの名前がredであることは不自然になりますからクラスの名前も変更をすることになり、不必要にソースの変更箇所を増やしてしまうことになります。
こうなることを避けるには、例えば
綱吉:「なあ、陽子…、前からひとつ聞きたかったことが…」
陽子：<em class="angry">「胸のサイズは聞くなっ」</em>
綱吉：「何でわかったんか…」
このようにHTML文書内のクラスの名前はその文書適役割から付けるのが望ましいのです。
もしかしたらお気づきの方もいらっしゃるかもしれませんが、このことはプログラムを作成するときの関数の名前の付け方と同じ考え方になっています。プログラムをやったことのある方は同じようにやると良いかもしれませんむやみに色数の多いぺーじ
女性のページやサイト作成初心者によく見られるものであるが
サイトマップの表示に上から赤、橙、黄色、緑、青、紫、とメニューの順番に七色を振っていったりする例があります。
多くの場合はこれを実現するためにソースの中で<span style="color:red">等で囲いクラスを使用しないで実現しますが、この方法でページを作ると、デザイン変更の際に最終的にソースの内部を変更することになってしまいます。
HTML文書の中には文書と文書構造のみを現して、デザインに関するコードを混ぜては行けないのです。
idを装飾用に使うぺーじ
classを使うより軽くなると言ってidを装飾用に使うことは非常に宜しくない
ひとつにつき、わずか3バイトの容量差のために変更の必要のあるコードを入れるべきではないのです
考えて下さい、「回線速度はほおっておいても早くなる」のです。それはインターネットが普及し始めてからの33.6k〜ADSLへの回線速度の変化を考えれば、疑問に思うところはないでしょう。
実際HTMLの規格では
- id = name[CS]
- この属性で要素に名前を与えます。この名前はユニーク（唯一）なものでなければなりません。
- class = cdata-list[CS]
- この属性で要素に、クラス名や一組のクラス名を割り当てます。幾つもの要素に同じクラス名を割り当てることができます。クラスを複数割り当てる場合は、ホワイトスペース文字で区切ります。
となっており、同じページ内で同じ名前のidを当ててはいけないことになっています。
最終的に1kや2k程度のファイルサイズの差で、将来あなたのサイトのソースを変更することになることは、非常に効率が悪いでしょう。
それならば画像を１枚減らした方がよっぽど効率的ではないでしょうか？
style要素を使用する
最初のデザインのとき。簡単のためにこれを利用するのは実際悪いことではありません。
ただstyle要素は考えるまでもなく変更に弱いのです。
最終的にページのアップロードをするときはこれを全てclassに変更しておくことを強くお勧めします。
実際、XHTML1.1以降ではstyle属性は非推奨要素に指定されているのですから。
装飾としてclassを多用するページ
class、やidでのデザインは変更に弱い。
たとえば、classやidにで文書的役割を書きたして置いて、次にスタイルシートでデザインを付け加える。
デザインの方法としては望ましいのですが、あまり多くのclassにデザインを与えることは良いことではありません。
あなたのサイトのデザイン変更のときに、classやidで与えた文書のスタイルシートのデザインは、全てではないと思いますが、必ず幾つかのスタイルは書き換えることになるでしょう。
これは最初にデザインを与えたクラスの数が多いほど、比例して、必ず増えることになります。
ただこれはクラスに、むやみにスタイルを適用することを悪とするもので
HTMLソースの中に数多くクラスを指定しておくことを悪とするものではありません。
できるなら、全てのタグの中にクラスを仕込んでおくくらいのほうが良いのです。
結論
結局WWWCのHTMLの目標には明確に更新しやすさなんて入っていないのですが。
文書構造をしっかり分かるようにしておくと、後々でのスタイル変更に非常に強くなります。
自分には、こっそりそのあたりも考えて策定されているようにしか見えません。
おそらくこの他にも数多くの法則がweb作成には有ると思われます
(たとえば環境に依存しないwebサイトの設計法や、アクセシビリティに優れたwebページの作成法に関して)
そのうちいくつかは技術的問題から現在は行うことが出来ず表に出ていないと思われますし
現在まだ、関連技術の実装が不完全であるために、幾つかの妥協はあると思われますが、最終的にはこの法則はかなりのモノが後のXMLでのwebサイト設計に関しても通用するものと思われますし、実際私にはそこを考えて規格化されているようにしか見えません。
もしかしたら、技術的に進んでしまったために表に出ることとなってしまっている問題もあるでしょう。
ですが、それに関しては私の領分ではありません。他の方の言葉を探して頂きましょう。