HTML のヒントを共有する: コードを意味論化する

この記事では HTML のスキルを共有します: セマンティックあなたのコード

HTML のセマンティクスはよくある質問のようです。なぜセマンティクスに関する記事があるのでしょう : HTML の各タグには固有のタグがあります。意味とセマンティクスにより、適切な場所で適切なタグを使用して、人間と機械をより容易にすることができます (機械はブラウザーや検索エンジンと同様に理解できます) インデックスエンジン) 私の説明があれば、すべてが一目瞭然です。十分に明確ではないので、Google で調べてください。 適切な場所で適切なタグを使用する方法 これは簡単な理解のロジックです。たとえば、h1 〜 h6 タグは順序なしリストに使用され、ol は塗りつぶされたリストに使用されます。 リストを定義するために使用されます; em、強力なタグは強調のために使用されます... 率直に言うと、HTML タグ のそれぞれの英語の解釈がそのセマンティクスを決定します (この記事の後半で、英語の比較表を載せます)一般的に使用される Html タグの定義を参考にしてください)。 人間と機械の両方にとって明らかなことは何でしょうか? HTML ページがセマンティックであるかどうかを確認する最良の方法は、ページの Css リンク を削除し、Web ページの構造が正しいかどうかを確認することです。よく整理されていますが、ページはまだ非常に読みやすいですか? なぜこんなことが言えるのでしょうか? ブラウザーにはデフォルトのスタイルがあることは誰もが知っています (Chrome の Web Developer Tools for Chrome プラグイン、または Firefox の Web Developer プラグインを使用することをお勧めします) -in)、h1~h6 など、フォント サイズの太字/減少のデフォルト スタイルがあり、上下の余白があり、ul、ol、dl にはすべてデフォルトの箇条書きがあり、strong にはデフォルトで太字のスタイルが付いています。 、同じページ、適切なセマンティクスを備えた HTML は、ページ CSS が削除された場合でも引き続き良好なパフォーマンスを維持できます。 もう 1 つのポイントは、優れたセマンティック コーディングは 検索 エンジンにとってよりフレンドリーであるということです。検索スパイダーは CSS を認識しませんが、HTML タグを認識できます。ここに簡単な例を示します:

	Mr.Think的博客
	专注Web前端技术,热爱Php,崇尚简单生活的凡夫俗子.
	Mr.Think的博客
	专注Web前端技术,热爱Php,崇尚简单生活的凡夫俗子.

ヘッド、フッター、サイドバー、記事などの違いを理解する必要があります。これらの要素はすべて、新たに追加された セマンティック タグです。 HTML コーディング セマンティクスは、高品質のフロントエンド開発に向けた一歩であり、Web 標準に準拠することを意味し、スタイルを削除した後もページを整理することができます。セマンティクスの詳細については、こちらをご覧ください。自分で Google するか、Adang の「Web フロントエンド開発の実践方法」の第 3 章を読んでください。添付: タグ セマンティクスの中国語と英語の比較表 ( HTML5 でサポートされていないタグの 行は削除してください)。

以上がHTML のヒントを共有する: コードを意味論化するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。