>> HTML入門トップに戻る
今回は主にhead部に記述するコードについて説明します。
head部に入る前に、一番最初の行にドキュメントタイプを指定します。
html自身にもバージョンがあるのですが、今回はバージョン4.01に沿って説明します。
基本的に以下の三つがあります。
●Strict DTD
非推奨の要素や属性、フレーム等が使用できません。仕様に対して厳格であることを意味します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
●Transitional DTD
フレームが使えない以外は、特に制限なく記述することができます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
●Frameset DTD
フレームも使用でき、特に制限無く記述することができます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
上記三つのうちどれかのコードをそのままコピーしてhtmlファイルの一番上に貼り付けるだけで結構です。
この講座では、1つ目はかなり厳格なので、2つ目のドキュメントタイプを使って説明していきます。
次に、htmlタグ内でページの言語を指定します。
htmlタグの中にlang="ja"と書いてください。
<html lang="ja">
こうなります。タグの後には半角スペースを一つ以上入れてくださいね。
次にhead部の説明に入ります。
head部は基本的にその文書がどのような内容で記述されているのかの情報を書きます。
それには、METAタグを使います。
コードは下記のようになります。
http-equiv属性ではどの情報を登録するかを指定し、
content属性にその内容を記載します。
最初の一行はこのページが何の言語で記述されているか、なんの文字コードで書かれているかを示しています。
いじる場所と言えば、最後の文字コードのところでしょう。
shift-jisなどのほかの文字コードを指定してもよいですが、私はutf8をオススメします。
2行目はこのWEBページ内のスクリプトは何の言語を使っているかを指定します。
text/javascriptと書いていますが、これはjavascriptというスクリプト言語をこのページで使っていますよ、
という意味です。
javascriptとはWEBページに動的な変化を加えることが出来る言語です。
javascriptを使わなければ書く必要はありません。
もし他の言語を使う場合は、「javascript」と書かれた部分を指定の言語に書き換えます。
3行目はこのWEBページのスタイルが何かを指定します。
ページのスタイルは基本的にCSSで指定しますので、上記のように書くだけです。
４～６行目は、このページの説明や検索ロボットに対する設定です。
ここはname属性を使います。
・description
→このページがどういうページなのかを説明するためのものです
・keywords
→このページに関するキーワードを記述します。
・robots
→検索ロボットに対する設定を記述します。
→index,followとかけば、検索ロボットへの登録、文書内のリンクの探索を許可することを意味します。
→noindex,nofollowと書けば、登録もリンク探索も無効にします。
6行説明しましたが、この中で最低限必要なのは1行目だけです。
ほかは必要に応じて付け足しましょう。
書き方はそのままなので全部丸暗記するしかありません。
次にlinkタグがありますが、
これは主にスタイルシートの場所を指定するものです。
上記のコードの../main.cssと書かれてる部分に取り込みたいCSSのパスとファイル名を指定します。
ほかは丸暗記で構いません。
最後にtitleタグです。
この中のページのタイトルを書きます。
以上が大体head部に書く内容です。
ただ覚えて書くだけなので、そんなに難しくないですよね？
次回はbody部についての説明を行います。
>> 【body部について】に進む
>> HTML入門トップに戻る
head部について
head部に入る前に、一番最初の行にドキュメントタイプを指定します。
html自身にもバージョンがあるのですが、今回はバージョン4.01に沿って説明します。
基本的に以下の三つがあります。
●Strict DTD
非推奨の要素や属性、フレーム等が使用できません。仕様に対して厳格であることを意味します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
●Transitional DTD
フレームが使えない以外は、特に制限なく記述することができます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
●Frameset DTD
フレームも使用でき、特に制限無く記述することができます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
上記三つのうちどれかのコードをそのままコピーしてhtmlファイルの一番上に貼り付けるだけで結構です。
この講座では、1つ目はかなり厳格なので、2つ目のドキュメントタイプを使って説明していきます。
次に、htmlタグ内でページの言語を指定します。
htmlタグの中にlang="ja"と書いてください。
<html lang="ja">
こうなります。タグの後には半角スペースを一つ以上入れてくださいね。
次にhead部の説明に入ります。
head部は基本的にその文書がどのような内容で記述されているのかの情報を書きます。
それには、METAタグを使います。
コードは下記のようになります。
<meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta http-equiv="content-script-type" content="text/javascript"> <meta http-equiv="content-style-type" content="text/css"> <meta name="description" content="あいうえお"> <meta name="keywords" content="かきくけこ"> <meta name="robots" content="index,follow"> <link rel="stylesheet" type="text/css" href="../main.css"> <title>さしすせそ</title>
http-equiv属性ではどの情報を登録するかを指定し、
content属性にその内容を記載します。
最初の一行はこのページが何の言語で記述されているか、なんの文字コードで書かれているかを示しています。
いじる場所と言えば、最後の文字コードのところでしょう。
shift-jisなどのほかの文字コードを指定してもよいですが、私はutf8をオススメします。
2行目はこのWEBページ内のスクリプトは何の言語を使っているかを指定します。
text/javascriptと書いていますが、これはjavascriptというスクリプト言語をこのページで使っていますよ、
という意味です。
javascriptとはWEBページに動的な変化を加えることが出来る言語です。
javascriptを使わなければ書く必要はありません。
もし他の言語を使う場合は、「javascript」と書かれた部分を指定の言語に書き換えます。
3行目はこのWEBページのスタイルが何かを指定します。
ページのスタイルは基本的にCSSで指定しますので、上記のように書くだけです。
４～６行目は、このページの説明や検索ロボットに対する設定です。
ここはname属性を使います。
・description
→このページがどういうページなのかを説明するためのものです
・keywords
→このページに関するキーワードを記述します。
・robots
→検索ロボットに対する設定を記述します。
→index,followとかけば、検索ロボットへの登録、文書内のリンクの探索を許可することを意味します。
→noindex,nofollowと書けば、登録もリンク探索も無効にします。
6行説明しましたが、この中で最低限必要なのは1行目だけです。
ほかは必要に応じて付け足しましょう。
書き方はそのままなので全部丸暗記するしかありません。
次にlinkタグがありますが、
これは主にスタイルシートの場所を指定するものです。
上記のコードの../main.cssと書かれてる部分に取り込みたいCSSのパスとファイル名を指定します。
ほかは丸暗記で構いません。
最後にtitleタグです。
この中のページのタイトルを書きます。
以上が大体head部に書く内容です。
ただ覚えて書くだけなので、そんなに難しくないですよね？
次回はbody部についての説明を行います。
>> 【body部について】に進む
>> HTML入門トップに戻る
