美しいコードは美しい Web サイトの基盤です。優れた CSS は、同様に優れた HTML コードの上にのみ存在し、Web サイトをより堅牢にします。この記事では、Web デザインに携わるすべての人に適した、きれいな Web デザイン コードを実現するための 12 の法則について説明します。
1. 厳密な DOCTYPE
やりたい場合は、正しく実行してください。 HTML 4.01 であろうと XHTML 1.0 であろうと、それらはすべて Strict モードを提供します。Strict モードを使用すると、コードでエラーが隠蔽されなくなります。
2. 文字セット宣言。特殊文字はエンコードされて処理されます。
文字セット宣言は、タイトルを含む Web ページ内のすべてのコンテンツを表示する方法をブラウザーが認識できるように、hea> 部分の先頭に配置する必要があります。さらに、& などの一部の特殊文字は、最も安全な方法である & に置き換えるのが最適です。
3. 適切なロックと
インデントは Web ページのレンダリングには影響しませんが、ソース コードを読み取るエクスペリエンスは大幅に向上します。インデントに関する特別なルールはありませんが、全体で一貫性を保つことをお勧めします。
4. CSS と JavaScript を外部ファイル
に
配置します。 CSS とJavaScript を参照用に外部ファイルに配置すると、1 つの Web ページのサイズが削減されるだけでなく、ブラウザのキャッシュ メカニズムでこれらのコードを共有できるようになります。同じコードの繰り返しのダウンロードは最小限に抑えたほうがよいでしょう。
5. 以下に示すように、Tag タグを正しくネストします
。コードの最初の行では、h1> タグが a> タグ内にネストされていますが、これはタグがブロック オブジェクトであるため、適切な習慣ではありません。ただし、インライン オブジェクトにはブロック オブジェクトを含めないでください。
6. 不要な div を削除します
(特に、現在私たちが陥っている DIV+CSS 神話では、CSS スタイルを割り当てることができるように、人々はすべてを div に入れようとします)。この乱用が原因となる可能性があります。膨満感で。
7. より適切な命名規則を使用します。
以下に示すように、Cat の CSS クラスには赤の斜体という名前が付けられています。これは、Cat が赤の斜体を使用していることを意味します。
8. 以下の図に示すように、CSS を使用してテキストの書式を制御するようにしてください
。CSS を使用すると、より柔軟にテキストの書式を制御できます。
9. 独立したクラス/ID を body に割り当てる
独立したクラス/ID を body タグに割り当てます。これにより、ページ内のすべてのオブジェクトが body に配置されるため、ページ内の任意のオブジェクトを簡単に見つけることができます。
10. 検証
言うまでもなく、Web ページのコードを可能な限り検証する必要があります。一部のコード エラーはブラウザによって自動的に修正できますが、一部のエラーは、特に Strict モードの場合に悪影響を及ぼします。たとえ何もしなくても、緑色の W3C 認証マークを見ると、少なくとも気分が良くなります。
W3C 検証に合格するために厳密である必要はありません。たとえば、IE6 には W3C 標準に多くのバグがあるなど、Web デザインにはさらに多くの考慮事項があります。 100 %自分の Web サイトが IE6 をサポートしていないことを W3C 検証を通じて宣言することは、少なくとも中国では、得るものよりも失うものの方が多い - 翻訳者
11. 合理的な構造順序
Web ページの構造を論理的な順序に保ちます。
12. 最善を尽くす
ゼロから作成する場合、古いコードを変更する必要がある場合、一部の CMS システムのコーディングがうまくいかなくなると、作業が行き詰まってしまいます。大規模な Web サイトでは変更すべきことがたくさんありますが、何があっても、常に良い習慣を維持することが非常に重要です。