バックエンドプログラマのためのフロントエンドへの道 03 HTML semantic_html/css_WEB-ITnose

目次

HTML セマンティクスとは何ですか?

なぜセマンティクスなのか

よく使われるタグのセマンティクス

1. HTML セマンティクスとは何ですか?

簡単に言うと、各タグは独自の処理を行うため、マシンが直接読み取ることができます。

2. なぜセマンティクスなのか?

1. 検索エンジンによってインデックスされやすくなります。

2. 他の種類のデバイス (スクリーン リーダーなど) による分析に便利です。

3. チームの開発とメンテナンスに便利です。

3. よく使用されるタグのセマンティクス

他の人のコンテンツの大部分を引用する 他の人のコンテンツも引用します。 タグとは異なり、これはコンテンツの大部分を引用するのに適しています。
改行 HTMLでは、キャリッジリターンとラインフィードは無視されます。

---

水平線 は、異なる段落を区切るために使用されます。 ウェブサイトの連絡先アドレス情報デフォルトのスタイルは斜体で表示されます。 <td> </td>単一行のコード<td> </td> <td> </td>

<td> </td>事前にフォーマットされたテキスト<td> </td> preタグ内のコンテンツにはキャリッジリターンと改行が保持されます。通常、複数行のコードを表示するために使用されます。 <td> </td> 

Listシーケンスのないリスト。

Ordered listOrdered list

Container は、Web ページの独立した領域を分割するために使用されます。 id および class 属性と組み合わせて、HTML 構造をより明確にすることができます。

タグ	意味	note
	Web ページのタイトル	ユーザーと検索エンジンに伝えるために使用されますこれは Web ページのメインコンテンツです。検索エンジンは、タイトルから Web ページのテーマをすぐに判断できます。
	記事の段落	デフォルトのスタイルでは、段落の前後にスペースが入ります。
~	記事のタイトル	h1 は最も重要です、通常はウェブサイトの名前に使用されます。これらのタグはフォントをより太く大きくしますが、h タグは単にこの効果を実現するために使用することはできません。
/	記事内の特定の単語を強調します	どちらのタグも強調を表現するために使用されますが、 の方が強力です。 は斜体で表示され、 は太字で表示されます。
	セマンティクスなし	その機能は、個別のスタイルを設定することです。
	他の人の短いコンテンツを引用する	記事内で他の人の文章を引用する必要がある場合は、このタグを使用してください。デフォルトでは、ブラウザは自動的に二重引用符を q タグに追加します。短いコンテンツに適しています。

Table: テーブルに多くのコンテンツが含まれている場合、テーブルはダウンロードされて少し表示されますが、tbody が追加された場合のみ表示されます。テーブルが完全にダウンロードされました。

: テーブルの行

テーブルの概要情報 概要情報はブラウザには表示されません。その機能は、テーブルの可読性を高め、検索エンジンがテーブルの内容をよりよく理解できるようにすることです。 ハイパーリンクimage

		は、Web ページ上にいくつかのデータを表示するために使用されます。含まれる要素は次のとおりです: tbody、tr、th、td
: テーブルのヘッダー。デフォルトでは太字で中央に表示されます。	: テーブルのセル
		いくつかの主要な属性: src、alt、title src: 画像の場所を特定します alt :画像のダウンロードが失敗した場合の代替テキスト title: 画像上にマウスを移動したときに表示されるテキスト