Web 品質 -重要なHTML要素

Web品質を高めるには、<DOCTYPE>、<title>、<h1>が重要なタグです。

<!DOCTYPE> 要素

すべてのHTMLおよびXHTMLページは、どのHTMLバージョンに従うかを定義するために<Doctype>要素を使用する必要があります。

doctypeは使用しているHTMLのバージョンを定義し、ブラウザがページをより迅速かつ一貫してレンダリングするための重要な情報を提供します。

文書型宣言により、検証ソフトウェアがページの構文をチェックすることもできます：

HTML 5

<!DOCTYPE html>

HTML 4.01 Strict, Transitional, Frameset

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0 Strict, Transitional, Frameset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<title> 要素

<title>要素は最も重要なHTML要素の1つです。その主な機能はWebページの内容を説明することです。

タイトルはWebページの表示部分ではありませんが、以下の場所で表示されるため、サイトの品質を高める上で重要です：

  • 検索エンジンのリスト
  • ウィンドウのタイトルバー
  • ユーザーのブックマーク内

タイトルはできるだけ短く、説明的であるべきです。

ユーザーがインターネットでサイトを検索するとき、ほとんどの検索エンジンは検索結果にサイトのタイトルを表示します。タイトルがWebページの内容と一致していることを確認してください。そうすれば、ユーザーがこれらのリンクをクリックしてあなたのサイトにアクセスする可能性が高まります。

ユーザーがあなたのサイトにアクセスすると、ウィンドウのタイトルバーにタイトルが表示されます。ウィンドウが最小化されている場合でも、タイトルがサイトの内容を説明する役割を果たすようにしてください。

ユーザーがあなたのサイトを訪れた後、Webページのタイトルは履歴フォルダーに保存されます（ユーザーはWebページをお気に入りに追加することさえあります）。その後のアクセスを成功させるために、タイトルがあなたのサイトを明確に説明できるようにしてください。

優れたタイトル：

実例

<title>HTML Tutorial</title>

<title>XML Introduction</title>

良くないタイトルの例：

実例

<title>Introduction</title>

<title>Chapter 1</title>

初心者向けチュートリアルサイトは、体系のに整理され理解しやすいHTML、CSS、JavaScript、DHTML、XML、XHTML、WAP、ASP、SQLチュートリアルを一通り提供しており、非常に多くの実例とソースコードを含んでいます。

<h1> 要素

<h1>要素は、Webページの最上位の見出しを記述するために使用されます。

一部のブラウザは<h1>要素をデフォルトで大きなフォントで表示するため、一部のWeb開発者は最上位の見出しを表示するために<h1>要素の代わりに<h2>要素を使用することがあります。これにより読者に影響はありませんが、「Webページの構造を理解」しようとする検索エンジンやその他のソフトウェアを混乱させる可能性があります。

<h1>を最上位の見出しに、<h2>と<h3>を下位のレベルに使用するようにしてください。

このテンプレートに基づいてWebページを構築してみてください：

This is the main heading

Some initial text

This is a level 2 heading

This is some text. This is some text. This is some text.

This is a level 3 heading

This is some text. This is some text. This is some text.

This is a level 3 heading

This is some text. This is some text. This is some text.

デフォルトの見出しフォントサイズが気に入らない場合は、スタイルまたはスタイルシートを使用して変更できます。

その他の拡張