ＨＴＭＬ－タイトルや背景－　　－ＨＴＭＬの基礎

タイトルや背景

■タイトルや背景などについて

ここでは、タイトルの設定の仕方や背景の色や画像・コメントの入れ方などについて説明します。このページに掲載しているタグは以下の通りです。

<!DOCTYPE～>　（ドキュメントタイプの設定です。）
<title>
<meta～>　（メタ情報の設定です。）
（コメントの挿入）
<body>
<hr>

<html>と<head>は説明する必要もないと思います。

■ドキュメントタイプの宣言　<!DOCTYPE～

ＨＴＭＬ文書を作成する際、文書の先頭でドキュメントタイプを宣言します。

ドキュメントタイプでは、ＨＴＭＬ文書がどのＨＴＭＬのバージョンに基づき記述されているのかを表しています。

ドキュメントタイプを宣言せずにウェブページを作成しても、ブラウザに内容を表示する事はできますが、Ｗ３Ｃでは宣言する事を必須としています。しかし、ネット上に沢山あるウェブページのなかにはドキュメントタイプを宣言していない所は沢山あります。それでも表示することは可能ですが、正確なＨＴＭＬの記述方法ではありません。

HTML 4.01 Strict DTD	ＨＴＭＬ４．０１の仕様に厳密に従う場合に使用します。
HTML 4.01 Transitional DTD	ＨＴＭＬ４．０１以前のバージョンを利用した場合でも互換性を保つ事が出来ます。
HTML 4.01 Flameset DTD	ページ内にフレームを設定する場合に利用します

使用例
<!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">

ドキュメントタイプとＵＲＬの間には１つ以上の空白を挿入します。
また、通常はスペースの前で改行します。

PAGETOP

■タイトルの設定　<title>

使用例
<title>この部分がブラウザのタイトルバーに表示されます</title>

<title> </title>は必ず<head> </head>の間に記述して下さい。

PAGETOP

■メタ情報の設定　<meta～

使用例
<meta name="下記参照" content="下記参照"> <meta http-equiv="下記参照" content="下記参照">

name属性	content属性	解説
author	ページ作成者	ページの作成者の情報を記述
description	ページの説明	ページの説明を記述します
keywords	ページキーワード	検索を行う際のキーワードを記述します
generator	ページ作成ソフト	作成に使用した作成ソフトの記述

http-equiv属性	content属性	解説
content-type	text/html; charset=shift-jis	ページ表示の際の文字コードを記述
content-script-type	text/javascript	ページの記述言語を記述
refresh	数値	指定した数秒後にページを再読込み
refresh	数値;URL=	指定した数秒後に指定したＵＲＬへページが移動

上記の値の中のキーワード属性などは、検索エンジン対策に使われていましたが、検索エンジンに上位表示させるためにそれを悪用したスパム行為が増加したため今ではほとんど記述する事の意味があまり無くなってしまいました。（一部検索エンジンを除き）参考程度に見ておいて下さい。

PAGETOP

■コメントの挿入

使用例
<!--　　　ここに作成日や覚え書きなどの情報を挿入　　　-->

コメントはブラウザには表示されません

PAGETOP

■ページの背景や基本的な文字の色など　<body>

使用例
<body background="値" bgcolor="値" text="値" link="値" alink="値" vlink="値" topmargin="値" leftmargin="値" rightmargin="値" bottommargin="値"> </body>

属性	属性の値	解説
background	画像ファイルのパス	背景の設定
bgcolor	色の名前またはカラーコード	背景色の設定
text	色の名前またはカラーコード	基本文字色の設定
link	色の名前またはカラーコード	リンクが貼られている文字の色
alink	色の名前またはカラーコード	リンク部分を選択している時の色
vlink	色の名前またはカラーコード	アクセス済みのリンクの文字の色
topmargin	ピクセル数	ページの上余白を設定
bottommargin	ピクセル数	ページの下余白を設定
leftmargin	ピクセル数	ページの左余白を設定
rightmargin	ピクセル数	ページの右余白を設定

PAGETOP

■段落の設定

使用例
<p>文字列</p>

の間は、１つの段落として認識されるので文字列の上下に１行ずつスペースが入った状態で表示されます。

PAGETOP

■改行の設定

使用例
改行したい場所に入れます<br>ここから改行されて表示されます。

上記の文字列をブラウザで見ると

改行したい場所にいれます
ここから改行されて表示されます。

と見えます。 を一回挿入するごとに１行の空行が入ります。

PAGETOP

■区切り線の挿入　<hr>

使用例
<hr> <hr size="値" width="値" align="値" noshade>

属性	属性の値	解説
size	ピクセル数	線の太さ
width	ピクセル数、比率（%）	線の長さ
align	left center right	位置
noshade	なし	線に影が付かない

PAGETOP

メール

質問メールがとても多くなった為、現在返信が遅れております。お返事が出来ていないものも沢山あり、今のところいつになるのか・必ず返信出来るのかどうかの保証が出来ません。申し訳ございませんが、その事をご理解いただいた上でご送信下さい。また、ここではHTMLの質問に関してのみ受け付けております。

メールはこちらから：ykrmain★★★eay.jp

PAGETOP

Webページ作成の為のＨＴＭＬを解説しています。★本サイトにはプロモーションが含まれています★

　Webページ作成の為のＨＴＭＬを解説しています。★本サイトにはプロモーションが含まれています★