CSS における XHTML タグの対応する属性と使用法

XHTML CSS を使って Web ページをデザインし始めた頃は、タグの使用経験も少なく、あまり気楽に使っていました。目的の効果が得られれば何でもいいだろうと、思いついたことを何でも使ってしまうことが多かったです。しかし、検索エンジン最適化について学び、理解を深めるにつれて、タグの使用は実際には科学であることがわかりました。 123WORDPRESS.COM - jb51.net の CSS チュートリアル記事ではセマンティクスを重視していますが、HTML タグはどのように使用すればよいのでしょうか。一般的にどこで使われていますか?
XHTML CSS を使って Web ページをデザインし始めた頃は、タグの使用経験も少なく、あまり気楽に使っていました。目的の効果が得られれば何でもいいだろうと、思いついたことを何でも使ってしまうことが多かったです。しかし、検索エンジン最適化について学び、理解を深めるにつれて、タグの使用は実際には科学であることがわかりました。
ここでは、CSS の各タグの対応するプロパティと使用法については詳しく説明しません。Web ページでの適用に焦点を当て、皆様のお役に立てれば幸いです。
1. 部門
XHTML ウェブサイトを構築する人にとって、DIV はなじみのある言葉でしょう。多くのウェブサイトや資料では、Web 標準のウェブサイト構築を DIV CSS ウェブサイト構築と呼んでいます。この名前には理由があります。W3C では、Web ページのレイアウトに Table タグを使用することを推奨しておらず、レイアウトタグとしての DIV が当然レイアウトの責任を負っているからです。
DIV は大きなコンテナとも言えます。ウェブページの全体的な構造レイアウトに加えて、ウェブページ上で比較的独立しているように見える領域を分割するために使用することをお勧めします。 DIV の機能は、新聞と同じように、さまざまなコンテンツを大きなコンテナーに分割することです。さまざまな領域で、特定の状況に応じて適切なラベルが選択されます。
2. H タグ H タグはタイトルタグであり、段落の意味を示すために段落の前によく使用されます。表示レベルや表現する意味に応じて、H1～H6に分けられます。
H1 は最も重要であり、Web サイト全体の役割と性質の説明を表現したり、Web サイトの対象ユーザーを示したりするためによく使用されます。その他のタグは、レベルに応じて、特定の領域の名前や特定の紹介テキストの一般的な説明を表示するために使用されます。
H タグは、Web サイトまたはテキストの段落の一般的な説明を表すため、検索エンジンにとって高い価値を持ちます。しかし、気軽に使えるというわけではありません。たとえば、一部の Web サイトでは、特定のキーワードのランキングを意図的に追求するために、H タグを使用してテキストの段落内にキーワードを表示します。または、Web ページをレイアウトするためのコンテナーとして H タグを使用することもできます。これは H タグの目的を完全に混乱させるため、推奨されません。
3. ピ
P は段落タグであり、テキストグループの異なる段落を区別するために使用されます。検索エンジンの場合、クロール順序に応じて、最初の P タグ内のテキストも価値が高くなります。たとえば、Baidu は Meta タグの説明内のテキストを無視し、最初の P タグ (絶対ではない) 内のコンテンツを取得します。
ユーザーに優れたブラウジング体験を提供しながら、検索エンジンがより多くのコンテンツをクロールできるようにするために、一部の Web サイトではコンテンツを分割するときに <br/> タグを使用します。不可能というわけではありませんが、期待した効果が得られない場合もあります。厳密なタイプのドキュメントの場合、<br/> はプレゼンテーションタグであり、使用できません。
ほとんどの Web サイトでは移行ドキュメントタイプが使用されていますが、テキストのセグメント化には使用しないことをお勧めします。
4. UL タグと LI タグこれは順序なしリストです。UL タグはリストの宣言であり、LI はリスト項目です。項目が比較的独立しているため、ナビゲーション、ニュース、記事リストなどの場所でよく使用されます。 UL は、さまざまなリストを区別するためのコンテナーとしても使用できます。
一部の Web サイトでは、「Web 標準」を追求してテーブルを UL や LI に変換することがありますが、これにより Web ページの読み取りや保守が困難になります。この誤解は、Web 標準が伝える概念に反しています。
5. 表
ここでは Table の使い方については詳しく説明しません。Web 標準では将来的に Table が使えなくなるわけではありませんが、レイアウトに Table を使うことは推奨されておらず、データを表示するときのみ使うべきだということをお伝えしたいと思います。したがって、Web に準拠した Web ページと Table タグの使用との間に矛盾はありません。
6. 検索エンジン用に用意されたタグ (1) タイトル: ウェブページのタイトル、ウェブサイトの説明。このタグは検索エンジンにとっても非常に価値があり、多くの場合、ターゲットキーワードが含まれています。
（２）メタキーワード：ウェブページ内の主なキーワード。もともとは検索エンジンがウェブサイトを分類しやすくするために用意されたものですが、その後、多くのウェブサイトがキーワードランキングを有利にするためにこのタグを不正に使用することが多くなったため、現在ではこのタグは検索エンジンにとってほとんど意味をなさなくなっています。
（3）メタディスクリプション：ウェブページの説明。キーワードと同様に、元々は検索エンジンの分類を容易にすることを目的としていました。同様に、多くのウェブサイトがこのタグを不正行為に使用しているため、検索エンジンにとってそれほど重要ではなくなりました。現在、主流の検索エンジンの中で、Google だけがまだコンテンツをクロールしていますが、コンテンツに基づいてキーワードを決定することはほとんどなくなりました。
実際、検索エンジンにとって最も重要なのはコンテンツの品質です。同様に、ウェブサイトを作成する目的は、訪問者に対して自社を宣伝することです。一時の快楽に流されて基本を忘れないで下さい。結局のところ、ユーザーが気にするのは、Web サイトのランキングではなく、その情報が自分たちに必要なものであるかどうかです。
上記は、初心者にとって混乱しやすい、よく使われるタグの紹介です。jb51.net の更新された CSS チュートリアル記事をフォローすることを歓迎します。今後、新しい問題が発生した場合、引き続き拡張していきます。

<<: MySQL リンクを表示し、異常なリンクを削除する方法

>>: Dockerイメージの作成とプロジェクト全体のワンクリックパッケージングとデプロイ