| 【 １：ホームページを見る】 | 【 ２：ソースとは 】 | 【 ３：準備 フォルダを作る】 |
| 【 ４：「ｈｔｍｌ」の基本形】 | 【 ５：タイトルを書く】 | 【 ６：文章を書く】 |
| 【 ７：ここまでのおさらい】 |
【 ８：】 | 【 ９：】 |
|
初めに！！ 自分のホームページを作る。 なんとなく難しそうですが、意外と簡単です。 今では『ホームページビルダー』などのソフトもありますから、作るのは簡単です。 しかし、メンテナンス（修正や追加）などは、ソフトで作ると意外と難しいかも知れません。 なぜなら、ホントはこうするんだよ、というのを跳ばしてしまうからです。 ここでは、ホントのことから知っていただくような順序で記述したいと思います。 ほんとに簡単ですから、順番に見ていってください。 さあ、ホームページを作りましょう。 ここでは、Internet Explorerを使って記述していきます。 マウスは、左右クリックのものを使います。 「メモ帳」も使います。OSはウインドウズです。 ある程度のパソコン知識も要りますので、わからない言葉が出てきたら、そのつど理解してからやっていくようにしてください。 でないと、最後になって、完成できないことがありますのでご注意を。 説明は、簡単にするため、かなり省略している部分があります。 難しいことは抜きにして、とりあえず、作っていきましょう。 大事な言葉は少し説明しています。 後は、自分で勉強できるようになりますので、安心してついてきてください。 【頁ＴＯＰへ】 | ||
【１：ホームページを見る】 まず、貴方はホームページを見たことがありますか？当然見ていますよね。 では、そのページの「ソース」を見たことはありますか。 あまり見たことはないでしょう。 では最初に「ソース」を見てみましょう。 この画面の上で、マウスを右クリックして見てください。中ほどに「ソースの表示」と出てきましたら、そこをクリックしてください。 ほら、画面の一番上の青い部分に「hpsakusei1.html-メモ帳」と出てきました、そしてなにやら、アルファベットと、記号と、日本語が記入されています。 日本語の部分は読めますね。１０行目ほどのところに<H1><DIV align="CENTER"><FONT size="4" color="#0080ff">初心者のホームページ作成！<br></DIV></H1> とありますが、これがこのホームページの表題 初心者のホームページ作成！ です。 それから下の記述は日本語で書いてあり、それが画面に表示されています。 日本語と日本語の間には、<table width="680・・・・、<tr><td>とか、その他いろいろの記号とアルファベットが書いてあります。 これを「タグ」と呼びますので、覚えてください。 ホームページは、このタグの組み合わせによって出来ています。 例にほかのページの「ソース」もみて参考にしてください。 【頁ＴＯＰへ】 | ||
【 ２： ソースとは】 「ソース」とは、ホームページそのものでした。 つまり、ホームページを作っている プログラムの記述 なのです。 ホームページを作る とは、このプログラムを書いていくこと で、このプログラムのことを「html」といいます。 つまり、「html」は「タグ」の組み合わせにより書かれたホームページを作るためのプログラムです。 この「html」を書いていくのに、ここでは「メモ帳」を使います。 それでは、早速ホームページを作る準備をしていきましょう。 【頁ＴＯＰへ】 | ||
【 ３：準備 フォルダを作る】 まず最初に、作ったホームページを格納しておく「フォルダ」を作っておきます。 「デスクトップ」の画面上で、右クリックし、「新規作成」⇒「フォルダ」とクリックすると、画面に「新しいフォルダ」が出来ます。このフォルダに「ホームページ」と名前を付けておきましょう。 それでは「ホームページ」フォルダをクリックし開いてください。 その画面の中で、右クリックし「新規作成」⇒「テキストドキュメント」とクリックすると、画面に「新しいテキストドキュメント」が出来ます。 これをクリックしドキュメントを開きます。ここに、「ｈｔｍｌ」を記入していきます。 いよいよ、ホームページの作成です。 今回は、こんなページを作ります。順番にやれば必ず出来ますので、安心してください。 【頁ＴＯＰへ】 | ||
【 ４：「ｈｔｍｌ」の基本形】 「ｈｔｍｌ」にも基本の型があります。 これは覚えてください。どのホームページも、この形で出来ています。 <HTML> <HEAD> ページのデータ記入部・・・・タイトル、記入文字の種類、構成要素、キーワード、作成者など </HEAD> <BODY> ページ本体部・・・・表現したい内容 </BODY> </HTML> ここでは、最初に <BODY> ページ本体部・・・・表現したい内容 </BODY> の作成から始めます。 では、先ほどのドキュメントに <HTML> <HEAD> </HEAD> <BODY> </BODY> </HTML> と記入してください。 そして、一旦このドキュメントに名前を付けて保存します。 名前は、半角アルファベットで index.html （htmlの前に . を忘れずに）とします。 ホームページフォルダに新しく index.html ファイルが出来ました。 【頁ＴＯＰへ】 | ||
【 ５：タイトルを書く】 最初は、文字の記入です。 記入する文字は、タイトル として赤い色 で 初歩のホームページ作成 、 太く 少し斜め に書くことにしましょう。 サブタイトルとして、緑色 で、初めてホームページを作ります としましょう。 こんな感じになります。
| ||
【 ６：文章を書く】 タイトルが書けましたので、次は説明文を書いていきましょう。 記入する文字は何でもいいですが、 初めてホームページを作っています。 意外と簡単に出来そうなので、これからが楽しみです。 だんだんと難しくなるのだと思いますが、頑張って勉強したいと思います。 としてみましょう。 タイトルの次の行に、<BR> と書いてください。 次の行には、 <FONT size="4" color="#ff00ff">初めてホームページを作っています。<BR>意外と簡単に出来そうなので、これからが楽しみです。</FONT><BR><FONT size="5" color="#00ff40">だんだんと難しくなるのだと思いますが、頑張って勉強したいと思います。</FONT><BR>（ここで改行） としてみましょう。 では、先ほどと同じように、上書き保存した後で、ホームページフォルダの index.html をクリックして確認してください。 ここでは、改行を <BR> で指定し、 <FONT size="4" color="#ff00ff"> では、文字の大きさとピンクの色、 <FONT size="5" color="#00ff40"> では、文字の大きさとグリーンの色 を指定しています。 そして、後に影響が出ないように </FONT> で閉じています。 <BR> は、閉じる必要のない独立した タグ です。 【頁ＴＯＰへ】 | ||
【 ７：ここまでのおさらい】 おさらい① ホームページは、html という言語で書かれたソースプログラムで作成する。 おさらい② html は、ページデータを記述する<HEAD>部と、ページ本体の<BODY>部からなる。 おさらい③ html は、タグ の組み合わせで書いていく。 おさらい④ タグ を指定することによって、文字のデザインを変えることが出来る。 おさらい⑤ ホームページを作る前に、格納する フォルダ を作っておく。 おさらい⑥ html は、メモ帳を使って書く。 おさらい⑦ 作りながら、そのつど確認して、間違いがあればすぐに修正しておく。 分かったことは、 ①ページの中身は、<BODY>（開始タグ）と</BODY>（終了タグ）の間に書く。 ②タイトルは、<H○>～</H○>で表現する。 ③文字の大きさは、<FONT size="○">～</FONT>で指定する。 ④文字の色は、<FONT color="#○○○○○○">～</FONT>で指定する。 ⑤改行は、<BR>で指定する。 ⑥画面の真ん中に配置するには、<CENTER>～</CENTER>で指定する。 以上のことが分かったところで、文字の色や大きさをいろいろ変えて、試してみてください。 カラーコードは、カラーコード表を参考にしてやってみましょう。 文字の大きさは、1～7 、タイトル（見出し）は1～6 までです。 フォントの種類も同じように<FONT face="MS P明朝">～</FONT>等と指定できますが、見るパソコンによって、ない種類の文字は表示されませんので、あまり変わった種類の文字で作っても、意味の無いことがあります。 【頁ＴＯＰへ】 | ||