HOME

楽しい消防団

自転車に乗ろう

私がせんむ

パソコンレスキュー隊

せんむのQ&A

PC改造部屋

宮中囃子連

掲示板

リンク集

パソコン レスキュー隊

ームページの初歩の初歩

PCレスキュー隊目次

HPの初歩の初歩目次 

 

ホームページの仕組み

 ホームページとは、本来はインターネットで見るときに、ブラウザ(インターネットエクスプローラーやネットスケープなど)で最初に表示されるページのことで、通常ホームページと呼んでいるのは「WEBサイト」または「WEBページ」と呼ぶのが正しいそうですが、ここではわかりやすくホームページ(以下HPと省略)と表現します。

 

 
HTML(ハイパー・テキスト・マークアップ・ランゲージ)


 HPはHTML(ハイパー・テキスト・マークアップ・ランゲージ)という、テキスト(文字)ファイルで書かれたものです。これをHTMLファイルといいます。しかし、実際に見ると画像や写真、色とりどりの文字が並んでいます。

 これはHTMLのなかに、タグというものが書かれていて、ブラウザ(インターネットエクスプローラーやネットスケープナビゲーターなど)が、そのファイルを読み込んだ時に、そこにかかれているタグなどを解釈して画像を表示したり、文字に色をつけたりしているわけです。

TOP

 

 
HPの実態はHTMLというテキストファイル


 ここで大事なのは、HTMLそのものに画像が貼ってあるのではない、ということです。ワープロなどで作った文書に画像を貼り付けて印刷すると、紙の上には文字と一緒に画像が印刷されますが、
HPの場合はページに画像を糊付けしてあるわけではありません。実際はテキストだけなのです。

 そこに書かれたタグというものに「○○にある◇◇という画像を表示しろ」「●●という文字を赤くしろ」という文が書かれていると、ブラウザは○○にある◇◇という画像を探しに行って表示し、●●という文字を赤く表示するのです。

 つまり、HPの実態はHTMLというテキストファイルです。文章や画像など別々にあるファイルをブラウザというソフトが一つのページとして見せてくれているだけなのです。

TOP

 

 
HTMLソース


 ためしに、どこかのHPを表示しておいて、「表示」→「ソース」とクリックしてみてください。自動的にメモ帳が起動し、わけのわからない、英語みたいなのが出ると思います。これがHTMLソース(HTMLファイルの中身)です。

 よく見ると、ところどころに日本語があると思います。それがHP上で見られる本文です。その前後に「<」や「>」でかこまれた英語みたいなのがあります。それがタグと言われるものです。

 また、HTMLでは通常の改行は無視されます。HTMLで改行するためには、改行のタグを書く必要があります。

TOP

 

 
タグ


 タグとは、もともと荷札という意味です。荷物につける荷札です。荷札には持ち主やら、送り先やら中身の説明やらがかいてありますね。(宅急便の送り状を想像してください。)インターネットは、パケット(小包)でデータを送る、という考え方がありますので、タグ(荷札)と言う名前にしたのではないか、と思います。

 このタグというものもテキストですが、次に来るテキスト(文字列)に意味を与えています。「次に来る文字列は赤い」とか、「ここに○○という画像が来る」というようなことが書いてあります。これを読んだブラウザが律儀に文字列を赤く表示したり、画像を探してきて見せてくれるのです。

 簡単に考えればタグはブラウザに対する命令、と考えてもいいと思います。つまり、HP自体に画像が貼ってあったり、文字が赤いわけではなく、タグに書かれた命令を読んだブラウザがその命令を実行しているわけです。

 そのためブラウザの種類やバージョン、実際にPCで見ている人の設定によって、同じHPでも見た目が変ってきます。

    ↑ここ重要

TOP

 

 
HTMLの基本構造


 HTMLの基本構造は下記のようになります。
これは最低限書く必要があります。
省略してはいけません。
またダブってもいけません。
これがきちんとしていないと、無料HPなどでは広告の位置がおかしくなることがあります。

 

<HTML>
<HEAD>
<TITLE>
ここにページのタイトルを書きます。
これがブラウザのタイトル(青い帯)に表示されます。
またお気に入りに入れたときのタイトルになります。

</TITLE>
</HEAD>
<BODY>
ここが本文(HPの内容)です。
ここに文章を書いたり、画像を貼り付けたりします。

</BODY>
</HTML>


色をつけた部分がタグです。(実際には色をつける必要はありません)

<HTML> <HEAD> <TITLE> <BODY>が開始タグ
</HTML> </HEAD> </TITLE> </BODY>が終了タグです。

<HTML>〜</HTML> <HEAD>〜</HEAD> <TITLE>〜</TITLE> <BODY>〜</BODY>のように上下で対になっているのがわかると思います。
ほとんどのタグは対にする必要があります。

TOP

 

 
アップロード


 実際にHPを作って公開するには、自分のPCの中だけでは他の人は見られませんので、24時間インターネットに接続しているサーバコンピュータにファイルをコピーする必要があります。こうすると、他の人もそのサーバにアクセスすることによって、そのHPを見ることができるようになります。このコピー作業をアップロードする、と言います。

 多くの場合、プロバイダや無料HPサービスのサーバを借りることになると思いますが、サーバもPCと同じようにHDD(ハードディスク)があります。インターネットにつないで、そのHDDの中に自分専用のフォルダ(サーバの場合ディレクトリと呼ぶようです)を作り、そこへファイルをアップロード(コピー)することになります。

TOP

 

 
INDEXページ


 HPでは、最初のページのファイル名は 「index.html」(または「index.htm」)にする、という約束があります。
 この名前にしておくと、たとえば・・・・・・・・・
 
http://pcrescue.easter.ne.jp/

というURL(アドレス)だけでも、ブラウザは自動的にindex.htmlまたはindex.htmファイルを探しに行ってくれます。このファイルがないと、そのフォルダにある、すべてのファイルを表示してしまうことがありますので注意しましょう。

 また、無料HPサービスのイースターでは「index」ファイルは拡張子を「.html」にしたほうがいいようです。「index.htm」ではなく、「index.html」にしましょう。それ以外のページは拡張子が「.htm」でも大丈夫です。

TOP

 

 
フォルダとディレクトリ


 PCの中で、ファイルをフォルダにいれて整理するとわかりやすくなります。HPのファイルでも同じです。これをアップロードするときは、PCの中と同じようにサーバの中にフォルダやファイルを配置しなければいけません。他の人はサーバのなかにあるHPを見にくるわけですから、PCの中に作ったHPと同じ環境(配置)をサーバの中に作る必要があるわけです。

 つまり、HPをアップロードするということは、PCの中のフォルダにあるHPのファイルを、そっくりそのままサーバの中のディレクトリ(フォルダ)の中へコピーする、ということです。PC内のフォルダ名とサーバ内のディレクトリ名は必ずしも同じである必要はありませんが、中身はまったく同じにする(コピーする)必要があります。といっても難しいことはありません。HP作成ソフトには簡単にアップロードする機能がありますし、HTMLを手作業で作成してもアップロード専用のソフトを使えば作業自体は簡単です。

 ディレクトリというのは、サーバに使用されているUNIXというOS(Windowsと同じようなもの)で使う用語です。Windowsで言うところのフォルダと同義語だと考えて間違いありません。

ファイル、フォルダの説明はここを参考にどうぞ

HPでのファイルとフォルダの位置関係についてはここを参考にどうぞ

TOP

 


 簡単なHTMLを書いてみよう  目次

   

おまけのページTOPへ

質問は掲示板へ

HPのトラブルはURLを書いてください

 

 

 

 


女の子お絵かき掲示板ナスカiPhone修理