基本HTML TAG

最初のHTMLタグ環境を開始しますが、これは必ずhtmlタグから始まります。

このタグ環境の中に、ドキュメント情報を主に記述するheadタグ環境と、コンテンツ(本文)を記述するbodyタグ環境が入ります。

HTML構造イメージ

<要素 Attribute>****</要素>

<html>タグと</html>タグはHTMLドキュメントの始まりと終わりを区切るために使われるタグです。

この<html>タグと</html>タグの内側にドキュメントヘッダ(<head>)、ドキュメントボディ(<body>)が含まれ、文書構造を定義しています。

<head>タグとは、ドキュメントヘッダ部分を表し、タイトルやドキュメントのさまざまな情報を定義したヘッダタグを囲むために使用されるタグです。このタグは<html>タグの直後に記述し、<body>タグや<frameset>タグよりも前に記述します。

<meta>タグとは、ドキュメントのヘッダ部分に記述され、ドキュメントについてのさまざまな情報を記述するためのタグです。ブラウザに直接内容が表示されるわけではありませんが、SEO対策にとって非常に重要なタグの一つにあげられます。

<title>タグとは、ドキュメントのタイトルを定義するタグで、終了タグ</title>までに記載された内容がドキュメントのタイトルになります。このタイトルは一般的にブラウザのウィンドウのタイトルバーに表示され、ステータスバーにも表示されます。また、「お気に入り」や「ブックマーク」に登録する際には、このタイトルがデフォルトの名前として使われます。SEOの観点からもタイトルは最重要項目のため、ドキュメントの内容を的確に表現し、サイト内の位置づけも分かるようなタイトルにすることが重要です。

<body>タグとは、ドキュメントボディを定義するタグで、開始タグの<body>から終了タグの</body>までの間に記述されたドキュメントは実際にブラウザに表示され、Webページの本文になります。

<base>タグとは、ドキュメントのヘッダ部分に記述し、ドキュメント内のほかのアンカーに対するベースURLを定義するタグです。ドキュメント内に記述された相対URLはこのベースURLを基準にして認識されるようになります。

<basefont>タグは、相対的なフォントサイズの変更のための基準となるフォントサイズや色などを定義するタグです。このタグは廃止予定となっているため、今後は使用するべきではありません。

up

スタイルシートの設定

ヘッダ内でスタイルシートを設定する場合は、

style

要素を用います。

この要素はヘッダ部以外では使うことができません。

必ずヘッダ部で記述します。

<style type="text/css">
<!--
body { background-color: #fffffff }
-->
</style>

外部スタイルシートを利用する場合には、以下のように記述します。

<link rel="stylesheet" href="mopa.css" type="text/css">
<body background="images/kabe.png">
(非推奨)
<body style="background-image:url('images/kabe.png')"> (CSSの設定:推奨)
body { background-image: url("images/kabe.png") }
 (CSSの設定:推奨)

要素一覧
タグ Attribute 終了タグ 説 明
基本タグ
<HTML>
document
 root
 element
html
dir=***
lang="ja"
必要 HTMLの開始と終了,ペ−ジの先頭に記述
dir=
 ltr
 rtr
lang="ja"
version=
* ltr:英語や日本語は左から右に記述する
英語だったらen、アメリカ英語 だったらen-US、日本語ならja
DTDの識別子を表 します。
<HEAD>
document
 head
head
dir=***
lang=ja
必要 ヘッダー情報
dir=
 ltr
 rtr
lang=ja
profile=URL
* そのドキュメントのプ ロフィールを記述したURLを指定します
<META> HTTP-EQUIV=
"refresh"
CONTENT="n;
URL="abc.htm"
無し アドレスを変更した場合に多く使用してます。

定期的に内容が更新されるようなペ−ジの場合は、URLにそのペ−ジ自身のアドレスを指定すれば、n秒後に自動更新させられます。
name="xxx"
content="txet"
textにそのペ−ジのキ−ワ−ドを指定しておくと、検索エンジンなどでその内容を参照してくれます。
name=
 "description"
content=
 "txt"
ペ−ジの説明を記述します。
name=
 "robots"
content=
 "noindex"
検索ロボットに参照させないようにする。
 最近の検索サイトでは、この記述を無視(守らない)傾向にあります。
HTTP-EQUIV=
"Content-Type"
CONTENT=
"text/html;
charset=
shift_jis"
HPがシフトJIS文字コ−ドで作成されていることをブラウザに知らせる
HTTP-EQUIV=
"Pragma"
CONTENT=
"no-cache"
訪問者のブラウザに保管されているキャッシュファイルを無効にして、毎回最新のファイルをロ−ド(表示)させる。
HTTP-EQUIV=
"Cache-Control"
CONTENT=
"no-cache"
同上
http-equiv=
"Content-Script-Type"
content=
"text/javascript"
このページでjavascriptを使用する場合に指定します
http-equiv=
"Content-Style-Type"
content=
"text/css"
このページでcssを使用する場合に指定します
<link rel=
"stylesheet"
 type=
"text/css"
 href="a.css">
外部CSSファイルを使用する場合に指定します
<TITLE> Attribute 必要 ウインドウに表示はされませんが、ブラウザのアクティブバ−に表示されます。
 ブックマ−クやお気に入りのタイトルになる。
 検索サイトのロボットが検索する項目でもあります。
<BODY> Attribute
<body
 bgcolor=
"#ffffff"
必要 文書情報(HTML本文)の開始と終了
BGCOLOR=
"#hhhhhh"
背景色16進数または、カラ−ネ−ム
カラ−サンプル
 (非推奨)
TEXT=
"#hhhhhh"
文字色16進数,カラ−ネ−ム
LINK=
"#hhhhhh"
リンク文字16進数、カラ−ネ−ム
VLINK=
"#hhhhhh"
選択済みリンク文字16進数、カラ−ネ−ム
ALINK=
"#hhhhhh"
アクテブなリンク文字16進数、カラ−ネ−ム
BACKGROUND=
"URL"
背景に画像を指定、画像の場所を指定(非推奨)
BGPROPERTIES=
"fixed"
壁紙のスクロ−ルを固定する(ウォ−タスクロ−ル)IE独自
LEFTMARGIN=n ペ−ジ全体の左マ−ジンを指定する(推奨:ペ−ジが見やすい)
TOPMARGIN=n ペ−ジの上マ−ジンを指定します。
<BASE> HREF=url
TARGET=
無し 基準となるURL、ディレクトリでの管理を行う場合に便利
<BASEFONT > SIZE=n 無し 基本フォントn=1〜7 最大=1 省略値=3
廃止

up

HOMEの次HTMLの次基本TAG


目的別要素

広告