Loading article…
HTMLは、 Web ブラウザでの表示を目的としたドキュメントの標準マークアップ言語です。タグとタグは、ドキュメントの一部を定義するために使用される要素であり、一意の分類が必要な場合に識別できるようにします。段落、強調などの他の HTML 要素がコンテンツの意味を正確に表現する場合、タグとタグを追加で使用することで、読者のアクセシビリティが向上し、作成者の保守性が向上します。既存の HTML 要素が適用できない場合、タグとタグはドキュメントの一部を適切に表現できるため、<p>、<h1> 、<p2> 、<h3>、<h4>などのHTML 属性を適用できます。[ 1 ] [ 2 ]<div><span><p><em><span><div><div><span>classidlangdir
<span>は、例えば文中の単語など、文書のインライン部分を表します。は、数段落やキャプション付きの画像など、文書のブロックレベル部分を表します。は分割を表します。 要素を使用すると、意味属性 (例: )、CSSスタイル (例: 色とタイポグラフィ)、またはクライアントサイド スクリプト(例: アニメーション、非表示、拡張) を適用できます。[ 1 ] [ 2 ]<div><div>lang="en-US"
<div>ドキュメントの「区分」を定義し、インライン素材の範囲よりも上下の要素から明確に区別されるブロックレベルの項目です。[ 3 ]
この要素は、1995年に国際化ワーキンググループの第2ドラフトhtml-i18nでHTMLに導入されました。しかし、HTML言語の一部となったのはHTML 4.01になってからで、1997年のHTML 4 W3Cワーキングドラフトに登場しました。[ 4 ]<span>
<span>は、インラインテキストのあらゆる範囲をマークアップするために導入されました。その理由は、「他の要素が適切でない場合に、LANG属性とBIDI属性を保持するための汎用コンテナが必要」だからです。その後、より豊富な意味要素が定義され、適用する必要のある属性も多数存在するようになりましたが、現在でもその一般的な目的は果たされています。
とには複数の違いがあります。最も顕著な違いは、要素の表示方法です。標準の HTML では、 はブロック レベル要素ですが、 はインライン要素です。ブロック はページ上のドキュメントのセクションを視覚的に分離し、他のブロック レベル コンポーネントを含めることができます。要素は周囲のコンテンツとインラインで情報を含み、他のインライン レベル コンポーネントのみを含めることができます。実際には、カスケーディングスタイル シート(CSS) を使用することで要素のデフォルトの表示を変更できますが、各要素の許可されるコンテンツは変更できません。たとえば、CSS に関係なく、要素にはブロック レベルの子要素を含めることはできません。[ 5 ]<div><span><div><span><div><span><span>
<span>また、要素は、囲まれた要素の論理的なグループ分けを示すためだけに用いられます。<div>
タグとタグに属性を使用する主な理由は3つあります。<span><div>classid
要素や要素が、CSSと組み合わせてレイアウト、タイポグラフィ、色、その他の表示属性をコンテンツの一部に適用するために、属性や属性を持つことは一般的です。CSSは視覚的なスタイル設定だけに適用されるわけではありません。音声ブラウザで音声を読み上げる場合、CSSのスタイル設定は、音声の速度、アクセント、豊かさ、さらにはステレオ画像内での位置にも影響を与えることができます。<span><div>classid
これらの理由から、またより意味論的なウェブをサポートするために、HTML 内の要素に付加される属性は、特定の媒体での表示特性だけでなく、その意味論的な目的を記述するべきです。たとえば、 の HTML は意味論的に弱いですが、 は要素を使用して強調 (斜体で表示される) を示し、より適切なクラス名を導入しています。CSS を正しく使用すれば、このような「警告」は画面上では赤色の太字で表示できますが、印刷時には、それに対処するには遅すぎるため、省略できます。おそらく、口頭で話す場合は、強調を加え、話す速度を少し落とすべきでしょう。2 番目の例は、単なる表示上のマークアップではなく、意味論的に豊かなマークアップです。<spanclass="red-bold">password too short</span><emclass="warning">password too short</em><em>
ページコンテンツの一部をこのようにグループ化してラベル付けすることで、ページ全体の意味をより分かりやすくすることができると考えられます。
ワールド・ワイド・ウェブ・コンソーシアム（W3C）は、数年前から、ウェブ全体を現在および将来の情報システムにとってより有用で有意義なものにすることを目的とした、大規模なセマンティックウェブプロジェクトを実施している。
マイクロフォーマット運動は、意味論的な概念を構築しようとする試みですclass。例えば、マイクロフォーマットに対応したソフトウェアは、のような要素を自動的に見つけ出し、電話番号の自動ダイヤルを可能にするかもしれません。<spanclass="tel">123-456-7890</span>
HTML または XHTML マークアップがページ訪問者のクライアント ブラウザに配信されると、クライアント サイド コードがWeb ページの内部構造 (またはDocument Object Model ) をナビゲートする必要が生じる可能性があります。最も一般的な理由は、ページがクライアント サイド JavaScriptとともに配信され、ページがレンダリングされた後も継続的な動的動作を生成するためです。たとえば、「今すぐ購入」リンクにマウス を重ねると、ページ上の別の場所にある価格が強調表示されるようにしたい場合、JavaScript コードでこれを実現できますが、JavaScript はマークアップ内のどこにあっても価格要素を識別する必要があります。次のマークアップで十分です。もう 1 つの例はAjaxプログラミング技術です。たとえば、ハイパーテキスト リンクをクリックすると、JavaScript コードが新しい価格見積もりのテキストを取得し、ページ全体を再読み込みすることなく、ページ内の現在の価格の代わりに表示することができます。新しいテキストがサーバーから返ってきたら、JavaScript は新しい情報で置き換えるページ上の正確な領域を識別する必要があります。<divclass="price">$45.99</div>
自動テストツールは、 <script>要素や<script>要素の属性を使用してWebページのマークアップをナビゲートする必要がある場合もあります。動的に生成されるHTMLでは、 xUnitファミリーの一員であるHttpUnitなどのページテストツールや、フォーム駆動型Webサイトに適用されるApache JMeterなどの負荷テストツールやストレステストツールの使用が含まれる場合があります。<span><div>classid
HTMLとXHTMLのマークアップにおいて、<p>タグと<p>タグを適切に使用することは非常に重要です。しかし、これらは時として過剰に使用されることがあります。<div><span>
HTMLで利用可能なさまざまなリスト構造は、独自の要素と要素の組み合わせよりも好ましい場合がある。[ 6 ]<div><span>
例えば、これです。
< ul class = " menu " > <li>メインページ</li> <li>目次</li> <li>ヘルプ</li> </ul>生産するもの
...は通常、これよりも好ましい。
< div class = " menu " > <span>メインページ</span> <span>コンテンツ</span> <span>ヘルプ</span> </div>生産するもの
HTML をや要素ではなく意味的に使用するその他の例としては、Web フォームを分割するために 要素を使用すること、そのような分割を識別するために 要素を使用すること、フォーム要素を識別するためにや要素ではなく を使用することなどが挙げられます。 [ 7 ]<div><span><fieldset><legend><label><input><div><span><table>
HTML5ではいくつかの新しい要素が導入されました。例としては、<p> 、 <p> 、<p>要素などがあります。意味的に適切な要素を使用することで、 <p>や<p>よりもHTMLドキュメントの構造が向上します。[ 8 ]<header><footer><nav><figure><span><div>
<div><p>サイト内の未識別のリストをすべて見つける簡単な方法はありません。[...] リストは、段落、<p>、表など、数十種類の異なる方法でマークアップされる可能性があります。
リストが見つかったら、個々の項目をマークアップするのは簡単です。現在のラッパー要素の代わりに、
<p>、
<p>、または<p>を使用するだけです
。[...] 例えば、箇条書きを削除するには、次のルールをページの CSS スタイルシートに追加します。[...]
div<ul><ol><dl>
この
要素を使用すると、テーマに関連するコントロールとラベルをグループ化できます。コントロールをグループ化すると、ユーザーがその目的を理解しやすくなると同時に、視覚的なユーザー エージェントのタブ ナビゲーションと音声指向のユーザー エージェントの音声ナビゲーションが容易になります。この要素を適切に使用することで、ドキュメントのアクセシビリティが向上します。
FIELDSET