::コンテンツ::

WEBサイト作成の基礎知識

WEBサイト作成にあたっての基礎的な情報について扱っています。

ホームページの仕組みについて

ホームページ作成に興味のある方向けに、
ホームページの仕組みについてここでは解説いたします。

ホームページ作成に伴う基本用語と、
どういう仕組みで成り立っているのかをおさえてください。
（いえ、気楽に読んでいただければそれでOKです(^^；）

ホームページは、「ネット上の博物館」

人に説明する時、私はこのように表現しています。
ここでも同様に説明していきたいと思います。

あなたは、芸術家だとします。
ある日、個展を開こうと思い、博物館にて自分の作品を公開する運びになりました。

このシチュエーションが、ホームページの公開と似ているのです。

つまり、あなたはホームページのデザイナーであり、
ホームページをネット上に公開しようとしているのです。

芸術家として、博物館に公開されるまでの流れをひととおり追ってみます。

まず、作品を作ります。
これは普段、自宅ですることでしょう。

次に、博物館に展示の契約を結ばなくてはなりません。
博物館の一角をお借りすることになるでしょう。

そして、自分の作品を博物館に運ばねばなりません。

最後に、晴れて作品の公開となるのです。
お客さんは博物館にやってきて、あなたの作品を見てくれるでしょう。

この後、個展が終了するまでの間
あなたは、作品を一部いれかえたりするかもしれませんね。
きっと、作品を自宅と博物館との間で運んだりすることもあるでしょう。

このような流れで、個展は無事に終了しました。

博物館の公開とホームページの公開の類似点

さて、ではどこがどう似ているのかを具体的にみていきます。

作品をつくる
　まずは、「ホームページ」その物を作らねば話になりませんね。
　あたりまえに聞こえてしまうかもしれませんが、
　この作業はあなたのパソコン上で行われるのだということに注意しておいてください。

契約を結ぶ
　「何の？」と聞かれるかもしれませんね。
　「ネット上の博物館」に対して、その一角を貸してもらえるように頼まなくてはいけないのです。
　
　ここでの、「ネット上の博物館」が、「プロバイダ」などをさします。
　つまり、ホームページとは、誰かに頼んで展示してもらうものなのだ・・ということを押さえてください。

　「ホームページをもてます」と一般的に言われるのは、
　実際には、「ホームページの作品展示用のスペースを提供して差し上げます」という意味なのです。
　それらのスペースを提供してくれるのは、「プロバイダ」や、「専用のレンタル業者」など多種にわたります。

　ところで、ホームページ展示用のスペースを貸すといっても、
　実際世界の現実としては、これはパソコンの記憶個所を部分的に貸してくれているのです。
　ですので、スペースの大きさを表現するのに、10MBや20MBといった「MB」単位を使うんですね。

　また、この「スペース/スペースのあるパソコン」のことを「サーバ」とネット用語で表現します。
　今後嫌というほど使う言葉ですので、もし知らなかった方は今覚えてください。
　
　博物館のたとえと対応させながら、まとめてみます。
　「博物館の管理人」　＝　具体的には「プロバイダ」などの会社　（スペースを貸し出してくれる）
　「博物館」　＝　「サーバ」と呼ばれる。実際には「パソコンの本体そのもの」である。
　「博物館の一角」　＝　あなたが借りる「ホームページスペース」のこと。
　
　初めにふれましたが、ネットは仮想の空間です。
　ホームページとは、常時ネットにつながっているパソコンの中にあるホームページファイルに対して
　人々が接続し、情報を読み出し、あたかも画面の上にそれがあるように感じる物なのです。

運ぶ

　いささか、契約を結ぶ話題が長くなりました（＾＾；
　さて、いざ契約を結んだとしましょう。
　すると、今度はホームページの作品をその展示場所へ移さねばなりません。

　この作業のことを「転送」と呼びます。
　また、「サーバへのせる」　とも言います。
　英語では、「upload」（アップロード）といい、これもそのままよく使われます。

　そして、この作業のための専用ツールが「FTPツール」と呼ばれるものです。

公開

　これについては、特別なことは行う必要はありません。
　基本的には、サーバへのせた時点ですでに公開されていると考えるべきです。

　ただ、普通の博物館と違って、どこに展示してあるかが、目にみえるものではありませんから
　どこにのせてあるか、つまり展示場所を明確に教えてあげなければなりません。
　
　「アドレス」とは、ネット上でのホームページの場所を指す言葉です。
　このアドレスを具体的に指定してやることで、あなたはホームページを見ることができます。
　また、友人の方などにホームページを見せる場合には、アドレスを教えてあげることになるのです。

作品のいれかえ

　この部分は蛇足です。
　ホームページを作ることは、作り、送り、新しく作り、また送り、必要ならば手直ししてまた送り・・
　この作業の永遠の繰り返しです。

　もちろん、現実の博物館ではすぐに期限が切れて公開が終わりますが
　ネット上では、一年中公開しているものです。
　つまり、この作業がホームページ公開の裏作業として常にあるわけです。

イメージ図で流れを確認しましょう

以上で、公開までの流れは終わります。
簡単なイメージ図で最後の確認　+　専門用語の追加をしてみますね。

自宅PC（ローカル）　--　ホームページを送る（転送）　---＞　展示用PC（サーバ）

サーバに対して、あなたのPC上のことを特別に「ローカル」と表現します。
　「サーバ」の対義語が「ローカル」と考えてください。
転送のことは、別名「アップロード」「送る」「サーバにのせる」などとも表現します。

自宅PC（ローカル）　＜--　ホームページをダウンロード　--　展示用PC（サーバ）

常に、サーバの方へだけへ転送するわけではありません。
逆も出来ます。
このことを通常、「ダウンロード」と呼びます。
（UP load　の対義語で、　DOWN load　です　（注：大文字にしてあるのは強調のため））
もちろん、サーバから、ローカルPCに「転送」といってもいいわけです。
（サーバへ送る方が圧倒的に多いので、ただ「転送」というとサーバ側へを一般的に指す気がします）

ちなみに、閲覧者も同じ事をしています。

閲覧者PC　＜--　ホームページをダウンロード　--　サーバ

閲覧者はサーバに接続し、ホームページをつなぐたびにダウンロードして見ているのです。

終わりに

ホームページのシステム全体の簡単なガイダンスは以上で終了です。
概念的なことはそんなに難しくないと思いますが、いかがでしたでしょうか。

少々くどいかもしれませんが、まとめ代わりに繰り返すと、
「自分のPCは常時ネットにつながっていないし、また常時中身を公開する仕組みも普通はない。
　だから専門の常時ネットにつないでいるPCのスペースを借りて、その場にホームページのデータを置かせてもらう。
　結果的に、転送作業が必要になるのだ。」
ということですね。

もちろん、この先サーバの契約から、ホームページを作るための言語HTMLの学習など
ホームページ作成の道は長いわけですがこれがその一歩となっていただければ幸いです。

ホームページ作成にあたってまず押さえておきたい事柄

実際にホームページを作成するにあたって、
あらかじめ知っておかなければならない基礎知識や、
必要な作業などについてこの場でふれたいと思います。

ホームページスペースの確保

まずはホームページの設置先を見つけなければなりません。
作りつつ公開するのがベストですので、あらかじめどこに設置するかを考えておいたほうがいいと思います。

ホームページスペース選び方のポイントをあげてみます。

１．とりあえず設置しやすい場所を確保するか否かを決める

もし、ためしに公開してみたいだけだというのであれば
何よりもまず設置しやすい場所をひとつ確保してしまえばいいわけですよね。

最初はどう選んでよいのかわからないサーバですが、
慣れてくればいろいろわかるようになります。
その後初めて、移動するかしないかということを考えればいいわけです。

選択肢としては、プロバイダ提供のサーバを借りるのがベストでしょう。
料金的にも無料もしくは低価格のはずですし。

もし、プロバイダでサーバを貸していなければ、無料レンタルサーバを借りましょう。
代表格としては、ヤフーのジオシティーズがあります。
入門用程度には役に立ってくれると思います
（ただし、本格的に設置されるのであればおすすめはできません）

以上はあくまでとりあえず設置してみることを前提にした選び方です。

２．商業利用をするか否か

ホームページ上で、物の通信販売を行いたいという方もいるでしょう。
また、企業のホームページを公開したいという方も多いでしょう。

その場合、商業利用（営利利用）を許可しているサーバを利用することが大前提となります。
一般的に値段などが高くなってしまう場合もありますので、
この場合にはきちんとサーバを選ぶ必要性が生じます。

途中でサイトを移転することはなかなか難しい面がありますから、
最初に開設したサイトを後々使い続けても困らないような場所を選ぶことが重要です。
特に、独自ドメインを取得するか否かは迷うところですね（下記参照）

この場合は以下のポイントを参考に場所を選んでください。
プロバイダのサーバではなく、専用のレンタルサーバを借りることになる可能性も高いです。

３．独自ドメインの利用

ドメインはネット上での「住所」にあたるものです。
プロバイダなどのスペースでは、自分で住所の全てを決めることはできません。
多くの場合、「プロバイダ名」＋「ユーザ名」になってしまうことでしょう。

それに対し、独自ドメインとは住所の権利を自分で所有し、その住所を使うことです。
たとえば、当サイトでは「ryulife.com」を取得しています。
（サイト名の「竜館」と「ネットライフ」をかけたんです・・（関係ないですが（＾＾；））

独自ドメインを取得することでサイト自体のイメージを作れますし、
サイトの印象をあげることもできます。
直接アドレスを打ち込んでつなぐユーザはあまりいませんが、
独自ドメインの方がアドレスを忘れにくいというのも利点です。
（短くなるので、自分自身で書くときにも書きやすくなります）

企業サイトでは独自ドメインは必須です。
個人サイトでもそれなりに大きくする場合や、商用利用する場合はほしいところですよね。

独自ドメインを利用するには、
・ドメイン取得を代行してくれるサーバと契約する
・方法を自分で調べて自分で取得し、独自ドメインを使えるサーバと契約する
・ドメイン取得代行サービスを利用してドメインを取得、独自ドメインを使えるサーバを利用。
・独自ドメインを無料で取得してさらにサーバも貸してくれるサービスを利用
　（ただし、バナーがつき、別サーバに移行するのには有料料金がかかる）
のサービスがありますので参考にしてください。

ある程度サーバ自体の条件がよい場所を選んで利用するのが一番楽だと個人的には思います。

４．サーバ、サービスの性能をはかる目安

レンタルスペースの容量（単位MB）

当然、多ければ多いほどいいわけです。
ですが、多すぎても結局使わないことにも注意してください。

普通のテキスト中心のサイトでは、
かなり大きくならない限り５MBでも使い切らないと個人的には思います。
10MBもあれば当分の間は問題ないでしょう。

一方、デジカメの画像をアルバム形式で表示させてみたいという場合には話はかわってきます。
100KBの画像を10枚のせるとその瞬間、１MB使ってしまいます。
最低10MBくらいは必要で、この場合は多ければ多いほど安心です。

最近、HDDの値下げの影響もあってか、
大容量のスペースを提供するサーバも増えてきました。
100MB提供の場所もけっしてめずらしくありませんので、
画像中心のサイトを構築される方はそういったサーバを探せばいいでしょう。

一般には、
50MBくらいにもなると、絶対に使い切らないレベルになりますので
ほかの要素を考えた方がよいでしょう。

サーバOSの種類とスペック

多くのサーバのOSはLinuxです。
TurboLinuxもしくはRedhatLinuxなどUNIX系のOSだと思います。
これ自体には特に差は顕著にはでません。

CPU
１GHｚのCPUをつんだサーバもいまどきめずらしくありません。
もちろん、高い方がいいことは確かですが、それほどの差にはなりません。

メモリ
多ければ多いほどよく、これがサーバの性能を大きく左右します。
サーバはどうしても仕組み上、多くのプロセスを並列して処理することになります。
そのため、メモリが多ければ多いほど動作が速くなる結果になります。
512MB程度のメモリはほしいところですね。

RAIDの利用
RAID機能を搭載しているサーバのHDDは読み込み速度などが上昇しますので、
より軽くなります。

重さ、回線の込み具合

サーバの性能ははっきりいってしまえば、それが軽いか、重いかで判断されます。
思いとは、反応速度が遅いことをさします。

たとえばあるサイトは瞬時に表示されるのに、
別のサイトはたいして中身が大きくもないのに長時間待たされたりすることあると思います。
後者のサイトはかなり重いサーバであるということです。

サーバの設置場所とその回線の物理的な性能にもよるのですが、
一番重要なのは体感速度です。

重いサーバは本当に使うことが嫌になりますので
これも非常に重要な要素です。

CGI、SSIの利用

CGIとは掲示板やカウンタのことととりあえず考えればいいでしょう。
（本当はぜんぜん違いますが（＾＾；）

自分で掲示板を選んで、自由に設置できるサーバであるか否かも重要なポイントです。
レンタルもののCGIではやはり限界がありますので。

ホームページ作成・・HTMLについて

ホームページの話題を続けていますが、
肝心のページの作り方をまだとりあげていませんよね。

あるサイトをブラウザで見ているときに、
上部のメニューから、「表示」＞「ソース」を選んでください。
そのときに表示されるものが「HTML」というコンピューター言語で書かれたホームページの正体です。

HTML（hyper text markup language)はホームページ作成に使われる専用の言語です。
中身は上から順番に表示されていくこと、
タグと呼ばれるものを使って全体の枠組みを決めるようになっていることが特徴です。

作る際には、「メモ帳」や「Simple text」といったエディタ（要するに文字を打つソフト）か、
自動的にタグも生成してくれるHTMLエディタという専用ソフトのいずれかを使います。

<html><head></head><body>
HTML文書の例です。<br>
これをブラウザでみると、一般に言うホームページになるのです。
</body></html>

↑HTMLのサンプル。「<」と「>」で囲まれた部分をタグと呼ぶ。

HTMLエディタを入手しましょう

HTMLエディタと呼ばれるものは、ホームページを作成する専用のソフトです。

HTMLエディタを使う利点
・タグを打たなくてすむ
・作成にかかる時間、手間を大幅に短縮できる
・作成のサポートをしてくれる機能を利用できる

タグを打たなくてすむことが何よりも大きな利点です。
これで作成の時間を大幅に減らすことができます。

作り始めればわかることですが、 ホームページ作成にはとても時間がかかります。
数ページ作るだけならともかく、 サイト全体では100ページ以上になるかもしれません。
だからこそ、できるだけ作成にかかる時間を減らしたいのです。

また、できあがるホームページの様子が作るそばから確認できたり、
HTMLエディタの拡張機能を利用できることも大きな利点です。

結局のところ、手間を省ける分、
サイトのデザインや内容といった面を重視できること・・これが最大の利点でしょう。

ところで・・
稀にHTMLエディタの利用に反対される方もおられるのです。
ですが、反対するに値する理由はあまり無いと個人的には思います。

たとえば、専用ソフトを使うとHTMLの文法がなおざりになると言われる方がいます。
しかし、別にホームページそのものが結果的にできあがるのであれば文法知識はいらないのではありませんか？

日常生活の計算で、複雑なものには皆さん電卓を使いませんか？
√やlogといった計算、わざわざ手でやる必要ありますでしょうか？また、そもそも手で計算する方法わかりますでしょうか？
それと同じことだと私は思います。

プロを目指す人には当然HTMLの文法は大事です。
しかし、全ての人にとってそれが大事なわけでは決してありません。

HTMLエディタでは限界があり、結局HTMLを手打ちすることになるのでは？と言われる方もいます。
これは真実です。しかし、エディタを使うべきではないという主張の根拠にはなりえません。

いまやHTMLやCSSの事柄に関しては、ほとんどHTMLエディタで対応できるようになりました。
ですから、普通にページを作る際にはほとんど手打ちをする必要はありません。

しかし、JavaScriptの利用といった高度な内容についてはどうしても手打ちで書かなければなりません。
それは事実なのですが、その場合にはその部分だけ手で打てばいいことですよね。

エディタを使っていても、自然とHTMLの文法に慣れていくものです。
もし、本格的にHTMLを勉強したいと思えばそのとき勉強すればそれですむことでしょう。
最初から、HTMLを勉強しなくてはいけないのだ・・とそう考える必要性はどこにもないと思うのです。

もちろん、エディタのソフト分の料金はかかってしまいますが、
そのくらいの出費はその分有効に使える「時間」を考えれば損ということにはならないでしょう。
日常生活を便利にするために作られた道具なのですから、ぜひ積極的に活用していってください。

他に必要なツール

あと最低限必要なものはFTPソフトです。
作成したホームページをサーバに転送するためのソフトですね。

Winユーザならば「FFFTP」、
Maｃならば「Fetch」
というソフトを使う方が多いようです。

Winではいろいろな種類のものがありますので好みで選べばいいのですが、
残念ながらMacでは最終的にFetch（有料ソフト）を使わざるをえないかと思います。

HTMLエディタに付属のFTPツールを利用してもOKです。

参考書を集める

やはり、参考書が何かしらほしいところです。
ホームページ関連の基本的な知識を持っていないと困ってしまうことも多いと思いますし、安心ですので。

初心者用のホームページの作り方という本を一冊買うか、
HTMLエディタの説明本を買うといいでしょう。
（HTMLエディタの説明の本にも結局基本知識はのっているはずですので）

タグ辞典といった、HTMLの文法の解説書は別にいりません。
文法知識がほしい方以外には、ほとんど役にたちませんので。

基本用語解説

どうしても、ホームページを作る前に押さえておかなければならない基本用語があります。
一応、まだ説明していないものをこの場でふれてみたいと思います。

拡張子

なんのことかわからないという方は拡張子自体を表示させる設定にパソコン自体がなっていないと思います。
まずは、拡張子を表示させてみましょう。

「マイドキュメント」のフォルダを開いてください。（別にどのフォルダでもOKですけれど）
上のメニューから、「ツール」＞「フォルダオプション」を開いてください。
そして、「表示」という項目を選んでください。

いろいろと一覧が表示されますが、その中から、
「登録されているファイルの拡張子を表示しない」
という項目を探し（↑WINMeでの文章、OSで多少異なることもあります）
そのチェックボックスのチェックをはずしてください。

これで拡張子が表示されるようになったはずです。
マイドキュメントなどを開いてみてください。
「index.html」、「car.gif」、「新規文書.txt」のように、ファイル名に「.」（ピリオド）とその後に数文字が追加されていませんか？

この、ピリオド以下の何文字かが「拡張子」と呼ばれる部分です。
この拡張子はファイルの種類をあらわしています。
txtはテキスト文書、jpeg・gifは画像ファイル、そしてHTML文書はhtmlかhtmのどちらかになります。