■第三段階・ファイルの転送(FFFTP)つかい方↓

■ホームページの作成 目で見るホームページの構造・テキスト、画像、レイアウト

☆ホームページは華やかなものが最近は特に多くて目をみはるものがあります。こんなん作るん無理と思われるかもしれませんが、大別するとテキスト(文字)と画像(写真)とレイアウト(デザイン)で出来ています。たったこれだけなんです。この三つです。最低限でいいですからこの三つに慣れるとホームページを作ることができるんです。

※正確にはこの三つだけではありません。たとえばインターネット上の離れた所で動いているプログラムの処理結果やインターネット上の離れたところの動画なども組み込まれています。

■ホームページ作成 テキスト、画像、レイアウトの確認・・・

◇ホームページは 文字(テキスト)と画像(写真)とレイアウト(デザイン)のたった三つの種類でできてます◇
この三つの簡単なコーディング(HTML)を覚えると なんとかなってしまうのがホームページです。
どうしても分からない場合はコピーして貼り付けてみてください理解できることがよくあります。

 
◇画像を用いた説明

■ホームページの構成
スタートホームページ作成 矢印 左の画像をご覧下さい。文字と画像とレイアウトで出来ている事がお分かりいただけると思います。
矢印 特にレイアウトのところですが、1番の矢印は、タイトルのエリアの中に 背景色のねずみ色を指定しています。
矢印 2番もそうですが、エンジ色の背景をいれています。
矢印 3番は画像を入れています。
矢印 4番はメインの内容を書くエリアです。
矢印 5番はリンクメニューを書くエリアです。
※エンジ色の下に画像があって、その下にクリーム色ところに文字が書いてありますが、ここまでの範囲が「ヘッダー」です。その下の、背景が白色のところがメインの内容を書くところです。右側の縦長のエリアがサブの内容を書くエリアです。そして、見えませんが一番下がヘッダーと同じ幅のフッターエリアがあります。このようにヘッダー、メイン、サブ、フッターと割り振ったレイアウト構成です。
この中へ 文字と画像を入れてやると、なんとホームページができてしまうのです。

 
 

【まとめ】
○何回も言わせてもらいますが ホームページは文字と画像とレイアウトで出来ています。そしてレイアウトとは、それぞれの内容を書き込むエリア(範囲)を決めることと思っていただいていいと思います。例えば 漫画の本なんかは それぞれの場面(シーン)を書く位置が割り振られていますね、そして次の場面と次の場面の間には少しの余白があって、こんな感じです。 実を言うとホームページのかっこいいのも沢山のエリアで区切られていて その中にここにはこれ、というように書かれていて 区切り線を見えなくしてあるのです。これがレイアウトです。
☆また、ブラウザ(インタネットを閲覧するソフト・インターネットエクスプローラーなど)は、ソース(HTML)の開始タグから終了タグまでの一行をよんで 計算して組み立てて表示してくれているのです。 HTMLとはブラウザに「こう表示してください」と伝えるための依頼書と思っていただくと分かりやすいかもしれませんね。なんとなくイメージはつかめましたか?。

※開始タグと終了タグは 例えば<h1>見出しホームページ作成</h1>これを最高レベルの見出しタグといいます。この中で
<h1>が開始タグ、</h1>を終了タグといいます。中には<br>(改行タグ)のように単体で使われるものもあります。

レイアウトとは、それぞれの内容を書き込むエリア(範囲)を決めること
■それでは ホームページ作成といきたいところですが、
もう少しホームページのイメージ感覚をつかみましょう。
ホームページはこんなイメージ
用語のご案内へ戻る  このページは目で見るホームページの構造  次は ホームページはこんなイメージ
■第三段階・ファイルの転送(FFFTP)つかい方↓