ホームページ作りをサポートします☆゛

enjoyホームページ
HTMLとはなんだろう??
ホームページ作成 トップページホームページとは作成手順ホームページ作成ホームページの使い方HTMLとはリンクのつけ方SEOとは編集作業でよく用いる用語ホームページ作成に関するリンク集


インターネットユーザーのほとんどがIEを使用している中で、FirefoxやSafariなどのIE以外のブラウザを利用している人も少なからずいます。初めてホームページの作り方を学ぶ人にはわからないかと思いますが、ブラウザの違いでレイアウトが乱れることは頻繁に起こります。 Aブラウザではきちんと表示されていたとしても、Bブラウザできちんと表示されないかもしれません。

サークル・趣味のホームページ作ってみよう!!



HTMLの意味は?

HTMLとは、HyperText Markup Language(ハイパーテキストマークアップランゲージ)の頭文字をとったものです。そして意味はというと、普通の文書をWebブラウザにハイパーテキスト形式の文書として表示するための命令を与える言語です。つまり、「ホームページを作成するために必要になる記述言語」という事です。

HTMLってどんなもの?

ホームページを作るということは、HTMLという「タグ」を使って記述する言語を書くということです。
HTMLは、普通の文書に対して「タグ」を使って様々な命令を出します。HTMLでは、文書の構造や画像などをどのように表示するかを<>でくくられた命令を記述して定義します。この命令の事を「タグ」と呼んでいます。

HTMLの基本

HTMLドキュメントの作成

では、実際にHTMLを使ってドキュメントを作成してみましょう。 HTMLのドキュメントを書くには、Windowsならばメモ帳やワードパッド、MacintoshならばSimpleTextなどのテキストエディタがあれば十分です。一つ注意してもらいたいのは、HTMLファイルを保存する時には、常にテキスト形式でしなくてはいけないことに注意してください。

HTMLファイルの保存方法

HTMLファイルはテキスト形式で保存しなくてはいけないのは前述しましたが、このときファイル名の最後に.html または.htmという拡張子(最後のピリオドより後の部分)をつけてください。そうすれば、HTMLのブラウザの多くは、ファイルの拡張子を見てそれがHTMLのファイルか単純なテキストファイルかを判断します。

HTMLの構造

HTMLには3種類の「ドキュメント構造タグ」があり、これらを使ってドキュメントの全体的な構造を記述します。実際に画面上に影響を与えることはほとんどありませんが、このタグのおかげでどのようなマシンでブラウズしても問題がおこらないクロスプラットフォーム性を実現しています。

<HTML></HTML>

すべてのHTMLドキュメントに表れる最初のドキュメント構造タグは、 <HTML>タグです。このタグはこのファイルの内容が HTML言語で書かれていることを示すものです。全てのHTMLのドキュメントは、下記のように <HTML>タグで囲まれていなければなりません。

<HEAD></HEAD>

<HEAD>タグに囲まれている部分はその文章におけるヘッダ(頭書き)です。ドキュメントの<HEAD>部分には、ドキュメントのタイトル、制作者の情報、日付などブラウザに現れない情報を記入することが出来ます。ヘッダ内には、けっしてドキュメントの本文は書きません。

<TITLE></TITLE>

すべてのHTMLドキュメントはタイトル(表題)を持ち、 <TITLE>タグを使って指定します。 <TITLE>タグはヘッダの中に書きます。このタグによって記述された内容は多くの場合ブラウザのウインドウのタイトルバーに表示されます。現在のページでは「ホームページ基礎知識講座「第2章 HTMLの基本」」となっています。 ドキュメントのタイトルを2つ以上書くことはできません。また、タイトルにはテキスト以外のもの(他のタグやリンクなど)を含むことはできません。

<BODY></BODY>

<HEAD>タグに続いて記述し、HTMLドキュメントのその他の要素すべて(テキスト、リンク、画像、絵など)は <BODY>タグに囲まれます。つまり<BODY>タグに囲まれた部分が本文と言う意味なのです。
また、この<BODY>タグにはオプションがありそれを指定することでそのページの基本的なレイアウト(背景の色、テキストの色とかリンクの色など)を決めることができます。

・<BODY BGCOLOR=#xxxxxx>
この記述で背景色が決まります。xxxxxxのところで16進数を用いて色を指定します。色の指定の仕方は後述します。

・<BODY TEXT=#xxxxxx>
通常のテキストの色の指定をします。

・<BODY LINK=#xxxxxx>
リンク色の指定をします。

・<BODY VLINK=#xxxxxx>
行ったことのあるリンクの指定をします。vlinkとは「visited link」です。

・<BODY ALINK=#xxxxxx>
リンクをクリックしたときに一瞬だけなる色の指定をします。

・<BODY BACKGROUND="背景のグラフィックの名前">
背景に貼る画像ファイルの指定をします。グラフィックファイルについては後で紹介します。

これらのオプションは<BODY>タグを書く際に一緒に書きます。
<BODY bgcolor=#ffffdd link=#ffff00 vlink=#0000ff>

基本的なHTMLドキュメントは以下のようになります。

<HTML>
<HEAD>
<TITLE>タイトル</TITLE>
</HEAD>
<BODY>
本文
</BODY>
</HTML>

見出し・段落・コメント

<Hn></Hn> 見出し

<Hn>タグ(Header)はそのページの見出しや小見出しを示すために使われます。見出しのレベルには6レベルあり、nのところをそれぞれ1〜6まで変えることによってそれぞれ違うレベルの見出しを示します。タグを終了するときに開始したときのレベルと違うレベルで終了してしまうと、修了タグが無いとみなされ表示がおかしくなってしまいます。この見出しタグを用いると大きい文字や太い文字などで他のテキストよりも目立つように表現されます。しかし太字で表示させたり、目立たせたりする目的でこのタグを使うべきではありません。
検索エンジンでは、このタグでマークアップされた語句や文章はそのページ内の中でも重要であるとみなし、重要視します。そのページ内で強調したい部分(本文内で重要と思われる文章や語句)に使うようにしましょう。 全ての見出しレベルは下記のようになります。

<H1>あああ</H1>
<H2>あああ</H2>
<H3>あああ</H3>
<H4>あああ</H4>
<H5>あああ</H5>
<H6>あああ</H6>

<Hn>タグを使う時の注意点!!

・文章の中でレベル順に<Hn>タグを用いる。
・<H4>タグのあとで<H1>タグを使ったりしてはいけません。
・フォントサイズを変更するために、<FONT>タグがあります。
・視覚的にサイズを変えるのならば、<FONT>タグを使用して下さい。

<P> 段落

<P>タグ(Paragraph)は段落を表し改行すると同時に空行を1行挿入します。このタグにはHTMLのバージョンによって多少違いがあるので、それぞれ説明します。その違いというのは<P>タグを閉じるか閉じないかです。一番古いHTML1.0においては<P>タグは「パラグラフの(初めではなく)終わり」を示すタグと定義していたので、パラグラフの終わるところに<P>と記述していました。一方HTML2.0以降においては<P>タグは</P>と対で表すように変更されました。つまり<P>がパラグラフ開始を表し</P>がパラグラフの終わりを示します。

Copyright:(c)2008 enjoyホームページ. All rights reserved.