ホームページ作成・大まかな作り方のイメージ
ホームページつくりの大まかなイメージ・概要を説明します。
ホームページを作るための初歩的な簡単なHTMLの基本、ホームページ全体の構成の考え方、 ホームページの作り方、ホームページの公開の仕方、等を簡単に見ていきます。

トッブページに戻る       文字のサイズを変更する時は Control キーを押しながらマウスのスクロールホイールを回してください
初歩的なHTMLの基本       

文章を作るHTML
専用のホームページ作成ソフトを使わず、手書きでホームページを作るといっても、何も難しく考える必要はありません。
ワープロとかエクセル等を使って文章を作ったことがことがあれば、同じ要領で作れてしまいます。
ワープロで文章を書くときはまずとにかく文章を書いていくと思います。
その後で強調したいところを太字にしたり、色を 変えたり、背景にマーカーをつけたりし、更に要所要所にイラストとか写真を入れていると思います。
手書きでホームページを作る時もこれとまったく同じです。
まず文章を書いてしまいます。すでに何かに書いた文章があればそれをコピーするだけです。
その文章に『ここからここまでは太字』とか『ここからここまでは文字の色を赤』とか命令を追加してやればいいのです。
この命令文が、日本語ではなく英語を使わなければいけない点がすこしわかりづらいだけです。

仮に日本語で命令できたとするとものすごく簡単になります。
下の文章は手近にあったパソコンのカタログより抜粋したものですが、左のただの文章を右のような飾りの ついた文章にすることを考えてみます。
テレビも映画も音楽もワンタッチですばやく楽しめる。
AV感覚で気軽に使えるマルチAVノート誕生。
テレビも映画も音楽もワンタッチですばやく楽しめる。
AV感覚で気軽に使えるマルチAVノート誕生。

左の文章を右のような文章に変えたい時、日本語で命令文を書くとこんな感じかと思います。
<ここから太字>テレビも映画も音楽もワンタッチ<ここまで太字>ですばやく楽しめる。
AV感覚で気軽に使える<ここから文字赤>マルチAVノート<ここまで文字赤>誕生。

「ここから」という言葉は書いてなくても判りますので省略し、「ここまで」という言葉は「/」という 記号に置き換えます。 これらのことを上の文章に当てはめてみます。
<太字>テレビも映画も音楽もワンタッチ</太字>ですばやく楽しめる。
AV感覚で気軽に使える<文字赤>マルチAVノート</文字赤>誕生。

実は、これでもうほとんどHTML文章は完成しているのです。
後は日本語を英語にしてやれば終わりです。
<太字>はBOLDの頭文字をとり<B>と書きます。
<文字赤><FONT color="red">と書きます。

最後に、一つ大事なことがあります。
命令文が表示されたら邪魔ですから、命令文は表示されないようにルールを 作ってしまうのです。
ルールを作るといっても自分で作る必要はありません。
『< >内の文字は画面に表示しない』というルールが既に作られていますから、 そのルールに則り文章を書いていると宣言すればいいのです。
宣言するために、一番最初に<HTML>、一番最後に</HTML>と記入します。

これでもう文章だけのホームページなら完成です。 まとめて書くとこうなります。
<HTML>
<B>テレビも映画も音楽もワンタッチ</B>ですばやく楽しめる。
AV感覚で気軽に使える<FONT color="red">マルチAVノート</FONT>誕生。
</HTML>

最小の構成ですが、これでもう作れてしまいました。
この文章をインターネットエクスプローラなどに表示させると、一番上・右の飾りのついた文章になっています。
後は英語で命令するための言葉(タグといいます)をいくつか覚えればどんどんホームページは作れます。

次はどんどん作った、複数のページをどのように見せるかを考えていきます。


ホームページ全体の構成       

次に構成を考えます
すべての情報が一ページに収まってしまえば考える必要はありません。 複数のページになる場合は、見にきた人が『いかに素早く欲しい情報にたどり着けるか』を考えます。
すべての情報を総合的にガイドするページをまず考え、これを中心になるページとします。 自分のホームページの玄関口だと考えればいいと思います。
常時接続が増えてきているとはいえ、少ないクリックで必要な情報を提供するのは非常に大事なことです。 この中心になるページを最初に開くページに設定し、そこから1クリックで情報が得られるように各ページの振り分けを考えていきます。 その時の各ページとの関係は右のようなイメージになるかと思います。
 

上のような構成は避けるべきだと思います。ページ数が増えると、どこにいるかわからなくなってしまいます。
上に戻る

ホームページの大まかな作り方       

次に中心になるページを作っていきます
全体の流れは右のような感じかと思います。 既に文章があればそれを使います。紙に書いたものならパソコンに「Notepad」を使って入力します。 エクセル、ワード、一太郎等々で作った文章ならそれをコピーし「Notepad」に貼り付けます。 新規に作る場合なら「Notepad」を使って入力していきます。

文章が出来上がったらそれをホームページに使えるように変更します。右のフローチャートでは「HTML化」 と呼んでいます。最初に書いた要領です。

写真やイラストを使うなら、それも用意します。

用意ができたらそれらのレイアウトを考えます。簡単に紙に書くとか、写真やイラストの実物大のコピーがあれば 並べて確認するとかの方法をとるとわかりやすいと思います。

レイアウトが決まったら、配置を決めるための枠を作ります。このような枠を『テーブル』と呼びます。右図のような例ならこんなテーブルを作ります
目次 写真
イラスト
 文章

テーブルの枠の中に、用意したイラスト・写真・HTML化した文章を入れます。

背景を入れたり文章を読み易くする等、細かな修正を加えればとりあえず出来上がりです。


他のページも作る
同じように2ページ目以降も作り、中心になるページとリンクを張れば全体が完成です。


ホームページの公開の仕方       

ホームページとして公開する
出来上がったファイルを全て自分のパソコンに保存し終われば、これでホームページは でき上がりです。
しかしこの状態では、自分のパソコン以外ではホームページを見ることはできません。
みんなに見てもらうためには、ホームページとして公開できるスペースを借ります。 このような他人に公開できるコンピューターをサーバーと呼びます。
このホームページスペース(レンタルサーバー)は無料のものから有料のものまで色々ありますが、 とにかくどこかと契約しスペースを貸してもらいます。
ホームページスペースを借りると、公開したときの自分のホームページのアドレスとか、 ホームページスペースにファイルを送る方法とか、詳細事項がメールまたは書類で送られてきます。
その指示に従い所定の場所に、自分のパソコンに保存してあったホームページを送れば、 連絡されたアドレスで自分のホームページが公開できたことになります。
ホームページの更新作業は、自分のパソコンに保存してあるファイルを修正・追加しそれを レンタルしているホームページスペースに送る形で行っていきます。

この大まかな流れを頭の片隅におき、CHAPTER 1 から読んでいくとわかりやすくなるかと思います。
上に戻る