HTML5 ではなぜセマンティック要素が使用されるのでしょうか?-フロントエンドQ&A-php.cn

html5 は、セマンティック要素を次の目的で使用します: 1. Web サイトのアクセシビリティを向上させ、より良い Web サイト構造の作成を支援します; 2. 後の変更とメンテナンスを容易にします; 3. スクリーン リーダーやその他の補助ツールの利用を容易にします。障害を持つ人々により良いオンライン体験を提供するためにページがスキャンされます; 4. 検索エンジンの最適化に役立ちます。

このチュートリアルの動作環境: Windows 7 システム、HTML5 バージョン、Dell G3 コンピューター。

どの言語でのコミュニケーションにおいても、言葉の意味を理解することは非常に重要です。これがコンピュータ通信であれば、さらに重要になります。したがって、HTML5 では、コードを容易に理解できるように、より多くのセマンティック要素が提供されています。

したがって、セマンティクスは単語やフレーズの意味、つまり

セマンティック要素 = 意味を持つ要素を定義します。セマンティック要素は、ブラウザーと開発者の両方にとって単純かつ明確な意味を持ちます。

例:

HTML4 では、 、 などは非セマンティック要素です。彼らは何も明らかにしませんでした。

一方、 、 、 などは、内容を明確に定義しているため、意味要素です。

HTML5 セマンティック要素は、すべての主要なブラウザーでサポートされています。

なぜセマンティック要素を使用するのでしょうか?

HTML4 では、開発者は独自の ID/クラス名を使用して要素 (ヘッダー、上部、下部、フッター、メニュー、ナビゲーション、メイン コンテンツ、コンテナー、コンテンツ、記事、サイドバー) をスタイルする必要があります。 、トップナビなど。

検索エンジンが正しい Web ページのコンテンツを識別することは非常に困難です。これは、HTML5 要素 ( ) で簡単になります。

#W3C セマンティクスの理想に従って: 「企業やコミュニティを含むアプリケーション間でのデータの共有と再利用を可能にする」

#html5 のセマンティック要素の意味 1. 変更と保守が簡単です。

HTML5 が登場する前は、従来の Web ページは基本的に div を使用してレイアウトされていました。実際、全体のレイアウトとさまざまなセクションの重要性を理解するのは少し困難でした (ただし、セマンティック クラスを追加することはできます)。そして HTML5 を通じてセマンティック要素、基本的な構造情報は、タグを通じてすぐに理解できます。こうすることで、数か月後に戻って変更を加えることが容易になります。そして、他の誰かがあなたのプロジェクトを引き継ぐ場合、それはさらに重要になります。

2. アクセシビリティ。

スクリーン リーダーやその他の補助ツールがページをスキャンするのに便利で、障害を持つ人々により良いオンライン エクスペリエンスを提供します

3. 検索エンジンの最適化。

Google や Baidu などの検索エンジンは、自動的に Web をクロールし、すべての Web ページを取得します。タグが意味論化されると、検索エンジンはサイトをわかりやすく理解し、検索でサイトをランク付けできるようになります (追記: もちろん、お金は依然として非常に重要です)

4。Web サイトの信頼性を高めることができます。アクセシビリティは、より優れた Web サイト構造の作成にも役立ちます。