HTML 初心者のための 15 のベスト プラクティス_HTML/Xhtml_Web ページ制作

以下は HTML 初心者向けの 30 のベスト プラクティスです。参考までに全員に共有します。具体的な内容は次のとおりです

1. ラベルを閉じたままにしておきます

以前は、次のようなコードをよく見かけました (注釈: これは何年前のことですか...):

XML/HTML コードコンテンツをクリップボードにコピー

1. li>ここにテキストがあります。
2. li>ここに新しいテキストがあります。
3. li>わかりますね 外装パッケージの UL/OL ラベルが欠落しており (意図的か非意図的かはわかりません)、LI ラベルも閉じ忘れられていることに注意してください。今日の基準からすると、これは明らかに悪い習慣であり、100% 避けるべきです。とにかくタグは閉じたままにしておきます。そうしないと、HTML タグを検証するときに問題が発生する可能性があります。

より良い方法

XML/HTML コード

コンテンツをクリップボードにコピー

ul
1. >
2. li>ここにテキストが入ります。リ>
3. li>ここに新しいテキストがあります リ>
4. li>わかりますね。リ>
5. ul>
2. 正しいドキュメント タイプを宣言します

著者は以前から多くの CSS フォーラムに参加しており、ユーザーが問題に遭遇したときは、まず次の 2 つのことを行うようにアドバイスします。

1. CSS ファイルにエラーがないことを確認します。 2. 正しい doctype が追加されていることを確認します

DOCTYPE は HTML タグの前に表示され、ブラウザーがページを正しく解析できるように、ページに HTML、XHTML、または両方の混合が含まれているかどうかをブラウザーに伝えます。

通常、次の 4 つのドキュメント タイプから選択できます。

XML/HTML コード

コンテンツをクリップボードにコピー

1. -//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
4. -//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
7. -//W3C//DTD XHTML 1.0 Transitional//EN」 「http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd」 >
10. -//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd” >

このような文書の種類の使用に関するアドバイスに関しては、これまでとは異なる法則が適用されます。多くの人が HTML4.01 標準の使用を選択しています。 選択マニュアルの基本は、これは真の適切なソフトウェアではないため、よく検討して目的のインストールを選択する必要があるということです。

3.永远不要使用内联样式

当你在埋头書代网時、常塺手または偷懒の加上点行内css代码を通過する可能性があります、就像蠷:

XML/HTML コード复制コンテンツ到剪贴板

1. p スタイル="color: red;" >このテキストを赤くして、本当に目立つようにし、人々に注目してもらいます。 p>

これは、依然として問題ではないと考えられますが、一般的なコードの実践では問題です。

コードを書き込む際、コンテンツ構造が完了する前に、形式のコードを追加する必要はありません。

このようなコード形式は、ネットワークの一種です。 — Chris Coyier

より良い方法は、ペイント部分を完了した後、この P の形式を外部形式のファイル内に置くことです。

建议

XML/HTML コード

复制コンテンツ到剪贴板

#someElement
1. > p { 色: 赤;     
2. }

4.すべての外部cssファイルをhead标签内に配置します

プロセス上、CSS 形式のテーブルはどこにでも組み込むことができますが、HTML の構文はネットワークのヘッドマークに組み込まれるため、ページの埋め込み速度が速くなる可能性があります。 雅虎の公開過程で、ヘッドマークに式テーブルが挿入され、これによりトップページが徐々に汚染される可能性があるため、ネットワークの読み込み速度が速くなる可能性があることがわかりました。

XML/HTML コード

复制コンテンツ到剪贴板

1. 頭>
2. タイトル>私の好きなトウモロコシの種類タイトル>
3. リンク rel="スタイルシート" タイプ="text/css" メディア ="画面" href="path/to/file.css" />
4. リンク rel="スタイルシート" タイプ="text/css" メディア ="画面" href="path/to/anotherFile.css" />
5. 頭>

5.javascript文件を底部に放出

ルールに従ってください。つまり、ユーザーの画面に表示されるのが最も早い速度で表示されます。

普及している JS ファイルが特定の機能 (ポイント ボタン イベントなど) を実行するだけの場合は、それを本体の底部に取り込むのが最適な方法です。

建议

JavaScript コード复制コンテンツ到剪贴板

1. これで、私の好きなトウモロコシの種類がわかりましたね。 

        
2.      
3.