ネットサーフィンをひととおりしてみたが、自分もCoolなホームページで世界に情報発信してみたい。そう思っている人も多いことだろう。プロバイダーの中には、会員のホームページを無料で設置するサービスを行っているところも増えてきた。個人でも、エディターとハイパーテキ
ストの記述言語であるHTML（Hyper Text Markup Language）の知識さえあれば気軽にホームページを立ち上げられる環境が整ってきた。ここでは、そのHTMLの基本的な書き方、そしてできあがったホームーページを実際に発信する方法を解説していく。
特 集

川添 歩・編集部

072 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

073

トは道具を創り、それを操る動物

しかし、道具の使い方がずっと同じままでことにコミュニケーションにまつわる道具である。そして言うまでもなく、道あるのなら、
まったく新しい考え方の優れた開発の歴史はそうした感動・触発の連続

具とヒトが棲む世界の広がりには密接な関道具とその使い方は、
いったいどこから出てであった、と私は考えたい。ついでに言えば、

係がある。

ヒ

くるのか？天才のひらめき？ そして私たちは

実はこうした感覚の欠如こそが、わが国のところで私たちはふつう、道具を「不便ただ黙々と次から次へと新しい使い方を覚

情報化政策の抱える問題の根幹なのだ。

を便利に変えるもの」という見方でとらええ、効率アップに向けて努力するしかない？

ることが多い。しかし、とくにコミュニケ

そう考えると、道具なんて融通のきかない、

今、私たちはインターネットという新しーションに用いられる道具と私たちが造りなんにも面白くないモノになってしまう。
さい仕組みを手に入れたことで情報の新大陸上げていく意識の世界との間には、それ以らに、その道具の助けを得て拡大していくはを切り開き、私たちの意識世界を拡張しよ上に注目すべき 感動的な関係

ずの世界さえもつまらないものに思えてくる。

うとしている。インターネットを介したコ

実は道具の面白さは、使う側のアイデア

ミュニケーションの魅力は、こうした形の次第で、当初考えられた以外の使い方がで発見を通じてネットワーク上に相互触発的きてしまう点にあるのだ。

に自分のプレゼンスを打ち出していける機がある。

コミュニケーションのプロセスでは、私たちはさまざまな記号を部品として組み合会の均等さと豊富さにある。

わせ、解体するという操作を繰り返しながコンテンツが道具によって新たな装いをら、表現や解釈を行う。記号操作の道具にまとって姿を現したとき、私たちのそれま

もちろん クール であるだけでは新た

は、紙と鉛筆から始まってさまざまなもの

での思い込みを壊すような 新鮮な裏切り

な道具は作れない。しかし、まず クールがあるが、コンピュータは今世紀の生んだを感じることがある。提示されるものと意さに気づき、感動し、感動させることが、もっとも純粋な記号操作の道具だといえる。

識との幸運な出会いである。そんなとき、新しい世界を切り開くための、より強力なこうした言語的な道具はいろんなことが私たちは「ああ、こんなやり方もあったの

道具作りの第一歩であることは間違いない。

できる ゆとり ……別の言い方をすればか！」と感心させられ、「クール！」と言さて、私たちは今、WWWとHTMLという融通性、自由度を持っている。だが、道ってみたりする。そこで、私たちのうちの新しいコミュニケーションのための道具を具に利便性だけを求める社会では、あらか

誰かが「こんなやり方！」をより便利に、手にしている。これを「より便利」な方向

じめ定められた使い方に従うことが奨励さ

あるいは楽しく行えるような道具を作るこに使うか、「クールで新たな感動」に向けれる。
「この道具はこう使うものだ」と決とになり、そしてその道具がまたさらに新て使うかはあなた次第である。

められてしまうのである。

しい世界を開いていくのである。

074 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

インターネットマガジン・シニアコラムニスト

今泉洋

C O O L

H O M EP A G E

特集：COOLなホームページの作り方
第1部

ホームページオーナーになるためのHTML入門
アクセス株式会社
+ 編集部

川添 歩

ayumu@axes.co.jp http://www.axes.co.jp/

1

HTMLって？

WWW で、あるページから他のページにリンクする仕組みをハイ
パーテキストという。そして、その指定をすることを英語でマークアップ（markup）するという。これは一種のプログラム言語
なので、HyperText Markup Language、HTML と呼ばれる。
といっても、誰でも1 日で基本は学べてしまうくらい簡単だ。

まずHTMLを覗いてみよう
HTMLとはどのようなものかを知るには、
まず人の作ったHTMLを見てみるのが一番だ。あなたがすでにWWW ブラウザーでネットサーフィンをしているのであれば、どこのサイトでもいいからまずページを表示してみてほしい。その上で、ブラウザーのメニューからView Sourceを選んでみよう。
テキストエディターが、今表示しているページのHTMLソースを開くはずだ。
WWWブラウザーに表示されているものと、テキストエディターで開いたHTMLを比較して見てみると、なんとなくHTMLというものがどういうものかわかる。文字部
分はそのままHTMLで書かれていて、その中にどうやら書体やグラフィックやリンクの指定がされている、と推察できるだろう。
Virtual Vegas（http://www.virtualvegas.com/）と3D ゲーム「マラソン」（http://www.amug.org/˜marathon/spy/）のホームページとHTML ソース

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10075先達に学ぶ

HTMLを書く準備●

HTMLは要するに普通のテキストファイ●

今月号の付録 WWW on CD の「個人ページ特集」でルだ。したがってHTMLを書くには、テキは、12 名の個人ホームページオーナー方々のご協力をストエディターと、結果を確認するためのいただき、そのページの内容をCD-ROM に収録していブラウザーがあればよい。

る。WWW ブラウザーさえあれば、実際にインターネッ

書いたHTMLをテキストファイルとしてトに接続されていなくても各ページをブラウズすること保存したら、そのファイルをNetscapeなどができる。これらの力作から、ユニークなアイデア、レのWebブラウザーでOpen File（Netscape）

イアウトの工夫、色使い、その他のテクニックを学び、自分のCool なホームページ作成に活かしてもらいたい。
なお、CD-ROM の詳しい使用法は本誌p.222 を参照のとかOpen Local（NCSA Mosaic）といったメニューによって開くと、HTMLが解釈されてフォーマットされた結果が表示されこと。

る。
この際、ファイル名の後ろが「.HTML」
または「.HTM」になっていないと、ブラウザーがそのファイルをHTML としてではなく単なるテキストとしてそのまま表示してしまう場合があるので、気をつける。
表示の結果を見て、直すところがあればエディターで直し、保存と表示を繰り返しながらHTMLを書いていく。
同じファイルについて何度も表示と変更を繰り返す場合は、エディターとブラウザ
ーを両方立ち上げておいて行き来するのがよいだろう。エディターでファイルに修正を加えて保存した後、ブラウザーに戻ってメニューまたはツールバーからReloadをすることで、ファイルを再度指定することな
く同じファイルが読み込まれる。

Tips

1
他のブラウザー利用者への配慮
利用するWWW ブラウザーによってHTML の仕様
やバージョンが異なるため、表示のされ方にも差が出てくる。最終的にはできるだけ複数のブラウザーを入手して確認してみることをおすすめする。
実際には、かなり多くのサイトは現在ほぼ標準仕様WWW ブラウザーの地位を獲得したNetscape
で見ることを前提として作られている。そのためNetscape 用として作っても今のところは問題ない。ただしNetscapeの機能を多用してNetscape以外のブラウザーでは思ったように見ることができない場合は、ホームページに「Netscape で見てほしい」旨を書いておくとよい。

☞
076 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

C O O L

2

H O M EP A G E

HTMLの文法「タグ」
HTML の中の「<」と「>」でくくられたさまざまな設定や指定のことをタグと呼ぶ。このタグこそがHTML の文法であるといってもよい。タグの種類はそれほど多くないし、必死になって覚えることもない。だいたいどのようなタグがあるのかを知っておいて、あとは必要に応じて本記事などを参照すれば十分だ。

空タグと対になったタグもよい。

れない。ただし例外もあるので、できるだ
け複数のブラウザーで確認したほうがよい。

タグには空タグと対になったタグがある。
空タグとは単独で使用されるタグで、改行を示す<BR> や区切り線を挿入する際のタ

基本的なタグはこれだけ
下図がHTMLファイルのもっとも基本的

なお、
このあとの説明は基本的にNetscapeを基準にして書いていく。特にNetscapeだな骨組みだ。この骨組みだけのファイルをけに対応しているタグには対になったタグは、文字列を前後でくく作っておいて、いつもそれを書き換えてフけてある。また、他のブラウザーで異なるって指定するタグで、たとえばある文字列

ァイルを作るようにしておくと便利だろう。

結果になるような場合は、その注意点を書

グ<HR>がそれにあたる。

のマークをつブラウザーが対応していないタグがあっくようにした。また、タグ内にある「n」は<タグ>文字列</タグ>

た場合はどうなるか。多くの場合、そのタ

そこに数字が入ることを示し、「¦」はそれという書式で書かれる。

グはなかったものと無視されるだけだ。すで区切られたいくつかの選択肢のうち、どなわち「<」から「>」までの部分は表示されか1つを入れることを示す。

の書体を指定する場合に使う。このタグはタグは大文字で書いても小文字で書いて【HTML の骨組み】<HEAD> 〜 </HEAD> には本文以外の、HTML のタイトルなどを指定する部分を入れる

ホームページに表示するための記述部分の全体は<HTML> 〜</HTML>で囲む<HTML><HEAD><TITLE>タイトル</TITLE></HEAD><TITLE> 〜</TITLE> で囲んだ部分はタイトルで、 < H E A D > 〜</HEAD> の間に書かれる。タイト
ルはウインドウのタイトルとして表示されたり、またブラウザーからファイルを保存するときにデフォルトでつけられる名前として使われる<BODY>
本文
……

Tips

……

2

</BODY></HTML>

タイトル裏技
タイトルは1 つのHTML ファイルの中で何度でも書くことができ、そのたびにウインドウのタ
イトル部分の表示が変わる。これを利用して電光掲示板のような効果やテキストを使ったアニメーション効果を出すことができる。
ただし、これはそのページを表示するたびに再びアニメーションすることになるので、一度ならば面白く感じても二度三度となるとわずらわしいだけとなるかもしれない。配慮が必要だ。

<BODY> 〜 </BODY> の間に、ブラウザーで表示されるすべての本文が書かれる

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

077

テキストの改行を指定する
HTML と表示例

ソース中の改行を反映する<PRE><PRE> タグを使うと、ソース
中の改行がブラウザーで見たときに反映される。

文章を読みやすくするタグ
ホームページの文字の読みやすさは、1行表示時の改行中に入れる文字数や段落の区切りを工夫することで向上する。改行や区切り線のタグを上手に活用しよう。
● 改行

区切り線の表示例

HTMLで改行を入れてもブラウザーで見る場合には意味をもたず、前後の行はつめて表示される。ただし、タグ内に改行を含
むとそのタグが正常に機能しない場合があるので、「<」と「>」の間には改行を入れないで書いたほうがよい。ブラウザーで改行をさせるためには次のタグを使う。図でHTMLと実際の表示例を示したので参照し
てほしい。
●区切り線
テキストに改行以外でなんらかの区切りをつけたいときは、行の間に水平の線を入れることができる。

区切り線 <HR>
ウインドウの左端から右端まで、くぼんだような線が表示される。

くぼみのない線<HR NOSHADE>
ただの黒い線が表示される。

区切り線の幅指定<HR SIZE=n>
数字は線の幅をピクセル数で記述する。

区切り線の長さ指定<HR WIDTH=n>n にはピクセル数を表す数字か、またはウインドウの幅に対するパーセンテージ（HR WIDTH=n%）を記述する。

区切り線の行揃え<HR WIDTH=n ALIGN=LEFT
RIGHT ¦ CENTER>¦

長さの指定をしたときに、さらに線を左
右中央のどこに合わせるかを指定できる。

078 INTERNET MAGAZINE 1995/10<BR> と<P>

一般に、表示の際に改行を入れるには、入れたい場所に<BR> を記述しておく。また、段落の区切りなどでは<P>を入れることで、連続した2 つの改行が挿入される。

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

C O O L

H O M EP A G E

3

文章をレイアウトする

HTML で文章を修飾する方法には2 種類ある。1つは、見出しや強調する部分を「ここは見出し」という意味付けで指定するもので、実際にその部分がどう見えるかはブラウザーによって異なる。もう1 つは、直接文字の書体を指定する方法だ。

文字の大きさを変える

Tips

紙の出版物と同様、ホームページで表示

3

する文字も目立たせたい部分は大きく、逆に補足的な部分は小さくするのが常識だ。
文字の大きさの指定方法には次のものがある。図と見比べながら確認してみよう。

基本フォントサイズ変更<BASEFONT SIZE=n>HTML の最初において基本フォントサイ
ズを指定する。数字は1 から7 までで、FONT SIZE の数字による指定と同じ。

各種フォントサイズの表示例（Mac、Osaka フォントの場合72dpi）

Netscapeのフォントサイズ
文字の大きさの指定はどれも意味付けによるもの
なので、実際のフォントサイズはブラウザーや、その設 定 によって異 なる。 N e t s c a p e では
Preferences のFont and Colors で指定したフォントサイズが<FONT SIZE=3> あるいは<H4> の文字の大きさになる。
1 つのページの中ではせいぜい3 〜4 種類ぐらいの大きさを使うのがよいだろう。それ以上の段階を設けるのであれば、むしろページを分割したほうがわかりやすくなるからだ。

1 見出しによる指定 <Hn> 〜</Hn>

1

見出しの指定は<H2> のように書く。H
の後には見出しの段階に応じて1から6までの数字を入れる。1 がもっとも上位の見出しで、大きい文字で表示される。6では文字も本文（無指定のテキスト）より小さくなる場合もある。
見出しで指定された文字列の後ろには必ず自動的に改行が入り、行間が空けられる。またNetscape などでは太字となる。

2 フォントサイズによる指定<FONT SIZE=n> 〜</FONT>

2<FONT SIZE=3> のように数字（1 〜7）
で文字の大きさを指定する。見出しの<Hn> では数字の小さいほうが大きい文字になったが、FONT SIZEでは逆である
ことに注意。数字が大きいほど文字も大きくなる。見出しによる指定と異なり、改行は指定しない限り入らないし、文字の太さも指定しない限り普通の太さである。

3 フォントサイズ変更指定<FONT SIZE=+¦-n> 〜</FONT>

3
インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

基本となるフォントサイズからより大きい
もの、小さいものを相対的なサイズで指定する。基本フォントサイズは前述のBASE
FONT タグで指定するが、BASEFONT
タグで指定していない場合は< F O N T
SIZE=3> の大きさが基本サイズである。

INTERNET MAGAZINE 1995/10

079

各種文字修飾のタグの表示例

各種文字修飾のタグ

1太字にするいくつかのブラウザーでは見出しの指定をするとその文字は太字となるが、見出し以外で文字を強調するために太くするには以下のような方法がある。
太字<B> 〜</B>

この指定をした部分の文字が太くなる、
物理的な指定。
強い強調<STRONG> 〜</STRONG>
論理的な指定。通常これにより太字になる。

どちらを使ってもほぼ同様の結果が得られる。たいてい<B>が使われる。

4等幅フォントを使うプログラムコードを記述したり、表を記述するときなどに、空白文字を入れて桁を揃えるために、等幅フォントを使いた
いときがある。文章中の一部分を等幅にするのであれば<TT> などでよいだろうが、まとまった行を等幅で表示するのであれ
ば、<PRE> を使うほうが<BR> を入れる必要もないので便利。ただし<PRE>
タグの間では<I><B><U> 以外の書式指定は使わないほうがよい。
タイプライター <TT> 〜</TT>

2斜体にする
英文では文章中の一部を強調するときや引用するときに斜体を使用するが、日本
語では斜体にすると読みにくい場合も多いので、日本語で強調したい場合には太字を使用したほうがいいだろう。
斜体<I> 〜</I>

この指定をした部分の文字が斜体になる、
物理的な指定。
強調<EM> 〜</EM>

論理的な指定。通常これにより斜体になる。
引用

この指定をした部分の文字が等幅になる、
物理的な指定。
キーボード入力 <KBD> 〜</KBD>
コード <CODE> 〜</CODE>
この指定をした部分の文字が等幅になる、
論理的な指定。本来の使い方では、前者はキーボードの入力を、後者はプログ
ラムコードを記述する際に使用する。
フォーマットつき <PRE> 〜</PRE>
このタグで囲まれた部分は、改行や空白（タブは使わないほうがよい）を含めてソースをそのままの形で等幅フォントで表示する。タグの前後には自動的に1 行ず
つ空きが作られる。

<CITE> 〜</CITE>

引用部分を明示するためのタグで、通常
これにより斜体になる。
引用の場合には後述のブロック引用を使
うほうがいい。
変数<VAR> 〜</VAR>

プログラムや計算式の解説中で特定の文字が変数であることを示すタグ。通常これも斜体になる。<VAR> は変数を示す
とき以外に使用する意味はないだろう。

3文字を点滅させる
点滅<BLINK> 〜</BLINK>

Macintosh 用のNetscape では、テキス
トのバックが点滅する。

080 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

1
2
3
4

5

6

7

<B>太字</B><BR><STRONG>強い強調</STRONG><BR><HR><I>斜体</I><BR><EM>強調</EM><BR><CITE>引用</CITE><BR><VAR>変数</VAR><BR><HR><BLINK>点滅</BLINK><BR><HR><TT>等幅の書体</TT><BR><TT>タイプライター</TT><BR><KBD>キーボード入力</KBD><BR><CODE>コード</CODE><BR>
<HR>
<PRE>
フォーマットつき：このタグで囲まれた部分は、改行や空白（タブは使わないほうがよい）を含
めてソースをそのままの形で等幅フォントで表示する。
</PRE><HR><b>&lt;通常の段落&gt;</b><P>
200年前、イギリスでおこった産業革命は、社会構造全体を変えてゆく大きな原動力となりました。
<br>
今、世界中でいっせいにはじまっているデジタルネットワークによる情報革命が、あの産業革命をはるかにしのぐ規模で、現在の世界の様々なしくみを変えてゆくことは間違いありません。
<P><BR><b>&lt;BLOCKQUOTEで挟んだ場
合&gt;</b><br><BLOCKQUOTE>
200年前、イギリスでおこった産業革命は、社会構造全体を変えてゆく大きな原動力となりました。
<br>
今、世界中でいっせいにはじまっているデジタルネットワークによる情報革命が、あの産業革命をはるかにしのぐ規模で、現在の世界の様々なしくみを変えてゆくことは間違いありません。
</BLOCKQUOTE><HR><H3 ALIGN=CENTER>&lt;H3
ALIGN=CENTER&gt;による中央揃え</H3><P ALIGN=CENTER>&lt;P
ALIGN=CENTER&gt;による中央揃え<BR>&lt;P ALIGN=CENTER&gt;による中央揃え
は&lt;/P&gt;までの行を<BR>
すべて中央揃えにする。</P><H3 ALIGN=RIGHT>&lt;H3
ALIGN=RIGHT&gt;による右寄せ</H3><P ALIGN=RIGHT>&lt;P ALIGN=RIGHT&gt;
による右寄せ<br>&lt;P ALIGN=RIGHT&gt;による右寄せ
は&lt;/P&gt;までの行を<BR>
すべて右寄せにする。</P><b>……はずだがNetscapeは対応していない。
</b>

行揃え
ある行、または段落の位置揃えを変える
方法がいくつかある。

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

5字下げ（インデント）
ブロック引用<BLOCKQUOTE>〜</BLOCKQUOTE>
引用の場合ばかりでなく、ある範囲の文
章をまとめて字下げをするためによく使われる。左側が字下げされるだけでなく、右側にも同様のスペースが置かれる場合がある。

6中央揃え（センタリング）
見出しの中央揃え<Hn ALIGN=CENTER> 〜</Hn>
前出の<Hn> 〜 </Hn> にオプションを加えることで、中央揃えになる。
テキストと画像の中央揃え<CENTER> 〜</CENTER>
このタグで囲った部分は、文章、画像ともに中央揃えになる。
テキストの中央揃え<P ALIGN=CENTER> 〜</P>
このタグで囲った部分が中央揃えになる。

7右寄せ
右寄せは現在 Netscape などではサポートされていない。 ただし、 後 述 の表
（TABLE）を使えば、見出し以外のテキストを右寄せにすることは可能だ。
見出しの右寄せ<Hn ALIGN=RIGHT> 〜</Hn>
前出の<Hn> 〜 </Hn> にオプションを加えることで、右寄せになる。ただし現在のNetscape ではサポートされていない。
テキストの右寄せ<P ALIGN=RIGHT> 〜</P>
このタグで囲った部分が右寄せになる。
ただし現在のNetscape ではサポートされていない。

INTERNET MAGAZINE 1995/10

081

C O O L

4

H O M EP A G E

リスト形式のデータを整理する
箇条書きのような用途に、リスト形式に表示するタグが用意されている。これによってリストの階層も作れ、いくつか便利なオプションも用意されている。

1 番号なしリスト<UL><LI></UL>

12<b>一般的なリスト</b><UL><LI>ペペロンチーノ<LI>カルボナーラ<LI>ペスカトーレ<LI>マトリチャーナ</UL>

2 リストは階 層 にすることも可 能 。

<b>リストの入れ子</b><UL><LI>パスタ<UL>

Netscape では階層が変わると行頭につくマークも「○」や「□」に変わる。
<LI>ペペロンチーノ<LI>カルボナーラ<LI>ペスカトーレ<LI>マトリチャーナ</UL><LI>ピザ<UL>

4

リストの表示例

56082 INTERNET MAGAZINE 1995/10

3 番号つきリスト<OL><LI></OL><LI>シーフード<UL><LI>エビ・イカ・ツナ<LI>ホタテ・ツナ</UL><LI>カレー<LI>ジャーマン
<LI>テリヤキチキン

3<UL> と</UL> で箇条書きにする部分を囲み、各項目の頭に<LI> をつける。行
末 に < B R > をつける必 要 はない。
Netscape では行頭に「●」がつく。

</UL>
</UL>
<b>番号つきリスト</b><OL><LI>ペペロンチーノ<LI>カルボナーラ<LI>ペスカトーレ<LI>マトリチャーナ</OL><b>番号つきリスト(2)</b><OL TYPE=A><LI>ペペロンチーノ<LI>カルボナーラ<LI>ペスカトーレ<LI>マトリチャーナ</OL><b>番号つきリスト(3)</b><OL TYPE=i><LI>ペペロンチーノ<LI>カルボナーラ<LI>ペスカトーレ<LI>マトリチャーナ</OL><b>定義型リスト</b><DL><DT>ペペロンチーノ<DD>にんにくのスパゲティ。食後の口のにおいを気にしないで<br>
食べるには、彼女にもペペロンチーノを食べさせるのが<br>
一番の手！
<DT>カルボナーラ<DD>卵とペーコンのスパゲティ。こってりしていてカロリーも<br>
高いが、ときどき無性に食べたくなることがありませんか？
</DL>

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

マークの代わりに連番をつけたい場合はこちらを使用する。<OL> と</OL> で箇条書きにする部分を囲み、各項目の頭に<LI> をつけるのは同様。

45 また、Netscape では連番の形式としてローマ数字でなく、アルファベッ
トやギリシャ数字を指定できる。リスト
全体ならば<OL> に、ある項目以降ならば < L I > に、 オプションをつけて < O L
TYPE=A¦a¦I¦i¦1> のように記述する。
さらに開始番号を1 以外にしたければ、<LI> のオプションとして VALUE=n を付加する機能もNetscape にはある。連番の指定をアルファベットなどにしていても、VALUE で指定するのは数字であることに注意。
ただし、これら機能はNetscape でしか指定のとおりに表示されないので、見る人の間違いを防ぐためにできるだけ使わないほうがよいだろう。

6 定義型リスト<DL><DT><DD></DL>
辞書の言葉のように、見出し語があって、直後にその説明文がつくような形式のリスト。説明文部分は字下げされる。
<DL> と</DL> の間に、「<DT> 見出し語」と「<DD> 説明」の組みを続けて記述する。

C O O L

H O M EP A G E

5

テーブルタグで表を美しく

表形式のデータは桁を揃えて枠をつけると美しい。HTML 3.0 は表組みをサポートする予定だが、Netscape はそれを先取りするとともに拡張している。
かなり多様な設定ができるが、それだけ複雑でもあるので、ソースは段下げをするなど工夫して全体の構成を見やすくしておかないと、すぐにわけがわからなくなるので注意しよう。

テーブルの定義
ページにテーブルを表示するには、まず表の始まりと終わりを次のようにTABLEタ
グで指定する。
<TABLE>〜</TABLE>

1 枠の表示<TABLE BORDER> 〜</TABLE>
BORDER をつけることによって、枠を表示 する。 N e t s c a p e ではさらに
BORDER=n と数値を指定することで、外枠の太さをピクセル数で設定できる。

2 セル間のスペース<TABLE CELLSPACING=n>
枠を表示している状態ではセル間のスペースはすなわち枠の太さになる。

また、TABLEタグのオプションで、1枠の表示
2セル間のスペース
3セル内のスペース
4表の幅を指定することができる。
テーブルの枠の太さ、
枠と文字との間隔を数値で指定

4 表の幅

3 セル内のスペース<TABLE CELLPADDING=n><TABLE WIDTH=n¦n%>

セル内のスペース（枠と文字とのすきまをどれだけとるか）を指定する。

表の幅の指定の仕方は、<HR> の長さと同様、ピクセル数またはウインドウの幅の何パーセント、という方法で行う。

Tips

Webサイトのサーチエンジンとして名高いYahooのホームページ（http://www.yahoo.com/）を見たことがあるだろうか。

4

文 字 中 心 のページだ

Excelでテーブルをつくる

が、図のように２段組
みで書かれている。確表計算ソフトMicrosoft Excel 5.0 用のマクロ、XL2HTML.XLS（v.1.21）
はExcel で作った表をHTML に変換してくれるフリーのコンバーター。
WindowsとMacintoshで利用できる。
手持ちのExcel の表をホームページに載せたい、あるいはタグを書く手間を省きたいという人には重宝するだろう。
（http://www710.gsfc.nasa.gov/704/
dgd/xl2html.html）

かHTMLは段組みをサポートしていないはずなのに...。ソースを見ればわかるのだが、実は、これはテーブルとリストを組み合わせているだけだ。2 つのセルのテー
ブルの中にURLのリス

Excel で表にしたい部分を選び、メニューバーのスマイリー
ボタンを押すだけでHTML ファイルができる。テーブル対応のブラウザーで開くと、ご覧のとおり

トが埋め込まれている。

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

083

<CAPTION>単純な表</CAPTION><TABLE BORDER><TR><TD></TD><TD>A</TD><TD>B</TD></TR><TR><TD>1</TD><TD>セルA1</TD><TD>セルB1</TD></TR><TR><TD>2</TD><TD>セルA2</TD><TD>セルB2</TD></TR></TABLE><P>

表組みの実際
テーブルタグを使って実際に組んだ表が以下の図だ。HTMLと、その表示のされかたをよく見比べて、自分の作りたい表はどのように組めばいいかを理解してほしい。

1
表の各種パターン

2

3

4

2
3
4

084 INTERNET MAGAZINE 1995/10<CAPTION>罫線なし、表見出し使用</CAPTION><TABLE><TR><TD></TD><TH>A</TH><TH>B</TH><TR><TH>1</TH><TD>セルA1</TD><TD>セルB1</TD>
</TR>
<TR>
<TH>2</TH><TD>セルA2</TD><TD>セルB2</TD></TR></TABLE><P><CAPTION>ROWSPANを使用</CAPTION><TABLE BORDER><TR><TD ROWSPAN=2>人々</TD><TD>男の子</TD><TD>太郎</TD>
</TR>
<TR>
<TD>女の子</TD><TD>花子</TD></TR></TABLE><P><CAPTION>COLSPANを使用<TABLE BORDER> <TR>
<TD></TD><TD COLSPAN=2>人々</TD>
</TR>
<TR>
<TD>名前</TD><TD>太郎</TD><TD>花子</TD></TR></TABLE><P><CAPTION>ROWSPAN/COLSPAN/表見出し使用</CAPTION><TABLE BORDER>
<TR>
<TD>
<TH ROWSPAN=2></TH><TH COLSPAN=2>性別</TH>
</TD>
</TR>
<TR>
<TD>
<TH>男</TH><TH>女</TH>
</TD>
</TR>
<TR>
<TH ROWSPAN=2>年齢</TH><TH>20才未満</TH><TD>太郎</TD><TD>花子</TD>
</TR>
<TR>
<TH>20才以上</TH><TD>次郎</TD><TD>京子</TD></TR></TABLE><P>

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

3 列数分のセル <TD ROWSPAN=n>
4 コラム数分のセル <TD COLSPAN=n>1 表の題名を指定する

表の中身<CAPTION> 〜</CAPTION>

表の内容は、基本的には「列」とその中にある「セル」を記述していくことで定義

オプションをつけて < C A P T I O N A L I G N =TOP¦BOTTOM > として、表の上下どちらに題名を表示するかを指定できる。

する。表の列は、<TR>〜</TR>

2 表に見出しをつける <TH>と定義し、表の内の1つのセルは、表内の見出しとして文字を太くする場合に、<TD>〜</TD><TD> の代わりにこれを使用する。文字が太くな
り、セルの中央合わせで表示される以外は、オと定義する。

プションの指定のしかたなどは<TD> と同様だ。

<TR>タグの間に<TD>タグでセルをいく
つか作って横 1 列分を表現する。<TD> は複数の列にわたるセルを作る場合には、<TD
ROWSPAN=n> で列数を指定する。また2 つ以
上のセル（コラム）にわたるセルを作る場合には、<TD COLSPAN=n> でコラム数を指定する。

5 セル内の行揃え<TR¦TD ALIGN=LEFT¦RIGHT¦CENTERVALIGN=TOP¦MIDDLE¦BOTTOM>
セルの中で文字列を揃えるために、ALIGN また
はVALIGN のオプションを使用する。指定はどちらか一方でよい。列全部への指定ならば<TR>のオプションとして、あるセル単独で指定する場
合は<TD> のオプションとして指定する。

必ず<TR>タグの中になければならない。
6 セルの幅<TD WIDTH=n¦n%>
セルの幅の指定の仕方も、
ピクセル数またはウインドウの幅の何パーセントという方法で行う。

表の各種パターン<CAPTION>各部分の幅</CAPTION><TABLE BORDER=5 CELLPADDING=10
CELLSPACING=10><TR><TD>セルA1</TD><TD>セルB1</TD><TD>セルC1</TD>
</TR>
<TR>
<TD>セルA2</TD><TD>セルB2</TD><TD>セルC2</TD></TR></TABLE><P>

5

6<CAPTION>文字の位置揃え</CAPTION><TABLE BORDER><TR><TD></TD><TH>・・左・・</TH><TH>・・中央・・</TH><TH>・・右・・</TH></TR><TR VALIGN=top><TH>上<BR>・</TH><TD>上左</TD><TD ALIGN=CENTER>上中央</TD><TD ALIGN=RIGHT>上右</TD></TR><TR VALIGN=center><TH>中央<BR>・</TH><TD>中央左</TD><TD ALIGN=CENTER>まん真ん中</TD><TD ALIGN=RIGHT>中央右</TD></TR><TR VALIGN=bottom><TH>下<BR>・</TH><TD>下左</TD><TD ALIGN=CENTER>下中央</TD><TD ALIGN=RIGHT>下右</TD></TABLE></PRE><P><CAPTION>
表の幅の指定</CAPTION><TABLE BORDER><TR><TD WIDTH=80>Width=80 pixel</TD><TD WIDTH=50>Width=50 pixel</TD></TR></TABLE>

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

085

C O O L

H O M EP A G E

6

ホームページに絵を入れよう
写真やイラストなどのグラフィックを使うと、Web の画面がぐんと華やかになる。実際、文字だけのホームページというものはほとんど見かけることがない。会社ならロゴや案内地図、個人では自分の写
真やイラストなどを入れることもできる。

グラフィックの作成（Netscape ではJPEG フォーマットにも対「Image Alchemy」が70種類以上の画像フ応）。定番のグラフィックソフトともいえるォーマットをサポートしていて、デモ版もの絵はデジタルデータでなくてはならない。

Adobe Photoshopなら保 存 形 式 として配布されている。

手持ちのグラフィックソフトで画像ファイ「Compuserve GIF」が用意されているのでルを作ってもいいし、スキャナーがあれば問題ないが、GIF フォーマットをサポート

それで写真やイラストを読み込んで簡単にしていないグラフィックソフトを使った場合

GIF フォーマットへ変換するときに注意

グラフィックデータが作れる。最近では低やスキャナーで画像を読み込んだ場合は、しなければならないのは、画像データの色

価格のデジタルカメラが出回っており、手いったんPICT、JPEG、TIFFなどのフォー数だ。色数が多いとデータ量も増え、ユー

軽にスナップ写真をコンピュータに取り込

マットで保存しておき、その後フォーマッ

ザーの環境によっては画像が正しく表示さむことができようになっている。また、著

ト変換ソフトを使うことになる。

れなかったり、表示に時間がかかったり、

ホームページに絵を入れるには、当然そ

データ量を抑える

作権フリーのイラストや写真を収録した素Macintoshの場合は、「GIF Converter」

さらにはデータそのものが読み込めなかっ

材集のCD-ROMを利用してもいいだろう。

や「Graphic Converter」（ともにftp://ftp.

たりする。GIF フォーマットで使用できる

iij.ad.jp/pub/info-mac/gst/grf/で入手可のは256色のシステムカラーだが、ディスプ

いろいろな形式の画像ファイルを能）などのシェアウェアを使うのがよい。

レイで見ることを前提にした場合には、256

GIFフォーマットに変換

Windowsの場合にはペインティングツール

色以下でも十分な場合が多い。また、画像

画像ファイルには各種のフォーマットが「 PaintShop Pro」（ ftp://oak.oakland.

のサイズもレイアウトを考えながら適当にあるが、HTML でサポートされているのは

edu/ SimTel.win3/graphics/psp30.zipでリサイズする必要がある。

GIF と呼ばれる画像フォーマットだけだ

入手可能）がある。また、MS-DOS では

ホームページのためのヘルパーグッズ

フラットベッドスキャナー
ScanJet 3c●¥138,000●ヒューレット・パッカード㈱ ●tel. 03-3335-8333●高速なプレスキャンが自慢の
解像度600dpi のスキャナー。ス
キャン専 用 ソフトウェアの「DeskScan」が付属する

086 INTERNET MAGAZINE 1995/10

ダウンロード可能な各種アイコンの画像を収めたサイト
http://sunsite.unc.edu/gio/ico
nbrowser/icons/

デジタルスチルカメラ
QV-10● ¥65,000 ●カシオ計算機㈱● tel.03-3347-4811 ●
190g と軽量で、ファインダ
ーには小型のTFT 液晶画面を使用。機動性を活かした
屋外での撮影に最適

QCAM for Macintosh●¥23,800 ● ㈱ 誠和システムズ● tel. 03-5378-0445 ● Macintosh のモデムまたはプリンターポ
ートにつなぐだけでビデオキャプ
チャーができる低価格のモノクロ
CCD カメラフィルムスキャナー
FHOTO VISION FV10
● ¥79,800 ●富士写真フィルム ㈱ ● tel.
03-3406-2981 ●ネガフィルムやポジフィ
ルム、プリントなどから画像を取り込むのに便利。AV パソコン以外はビデオキャプ
チャーボードが必要
素材CD-ROM、THE PROFESSIONAL
PHOTOGRAPHY COLLECTION●《輸入CD-ROM 》¥6,000

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

画像・文字の配置とHTML のソース

1

2

<IMG SRC="liftoff1.gif" >（無指定）<P>
<HR>
<IMG
SRC="http://www.impress.co.jp/img/inetm
ag.gif" > 他サイトからの画像<P><HR><IMG SRC="spacewalk1.gif"
ALIGN=TOP> （文字上揃え）<P><IMG SRC="spacewalk2.gif"
ALIGN=CENTER> （文字中央揃え）<P><IMG SRC="spacewalk3.gif"
ALIGN=BOTTOM> （文字下揃え）<P><HR><p align=center><IMG SRC="earth.gif" ><BR><BR>（画像センタリング）<BR></P>

グラフィックをホームページにNetscapeではレイアウトする<IMG SRC="filename"

できあがったGIFフォーマットのグラフィ

ALIGN=LEFT¦RIGHT>

ックデータをホームページに表示するため

でグラフィックの左寄せや右寄せも可能で、には、HTML中で挿入したい場所に

しかも複数行のテキストを回り込ませることもできる。また、テキストと画像の間に<IMG SRC="filename">と画像のファイル名を記述する。必要があスペースをあけるには、

ればパスも含める。また、他サイトにある<IMG SRC="filename " VSPACE="n"画像の場合には、URLも書いておく。

HSPACE="n">オプションで、同じ行にある文字をグラで画像の縦横のスペースを指定できる。

フィックの上部・中央・下部のいずれに合Netscape以外のブラウザーならば、<PRE>

わせて表示するかを指定できる。
<IMG SRC="filename"

タグで<IMG SRC="filename">とテキスト

3<HR><IMG SRC="moon.gif" ALIGN=RIGHT>
月（Moon）<BR>
地球が持つ唯一の衛星<BR><BR>（画像の右寄せ＋文字の回り込み）<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<HR>
<IMG SRC="jupitor.gif" ALIGN=LEFT>
木星（Jupiter）<BR>
太陽系で最大の惑星<BR><BR>（画像の左寄せ＋文字の回り込み）<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<HR>
<PRE>
<IMG SRC="planets.gif"
ALIGN=CENTER>（画像と文字とのスペースを空ける）<P></PRE>

を囲んでスペースを適当に入れればよい。

ALIGN=TOP¦CENTER¦BOTTOM>

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

087

画像ロード中のイライラをやわらげる

GIFの透明化で写真やイラストをインターレースGIF「切り抜き」にする

Macintoshでは、先に紹介したGraphic
Converter のほかに「Transparency」

大きな画像はロードすると時間が長くか

Netscapeではバックグラウンドに色や画（ftp://ftp.iij.ad.jp/pub/info-mac/gst/grf/

かるので、とくに遅いモデムを使っている像を敷くことができるようになった（「7. バで入手可能）というフリーウェアでGIFの場合はイライラする。そこで登場したのが、ックグラウンドとカラーでCOOLに決める」

透明化ができる。また、GIFを透明化する「初め粗く、後で細かく」表示する「イン参照）。そこでよく使われるようになったの

Photoshop のプラグインがAXES のサーバ

ターレース」という方法だ。決してロードが、画像の背景を消す「切り抜き」のテクー（ h t t p : / / a x e s g w . a x e s . c o . j p /の時間が短くなるわけではないが、「イライニックだ。たとえば人物の背景に使ってい˜hisashin/lib/PhotoGIF1.0b6.html）からラ」を多少やわらげるということで、今でる色を透明色に指定すれば、背景が消えて入手可能だ。Windows の場合は「LView

は多くのサイトで使われるようになった。たバックグラウンドの色や画像が見えるようPro」（ftp://oak.oakland.edu/SimTel/

だし、今のところインターレースに対応しになる。GIF89 という規格には指定した1

win3/ graphics/lviewplb.zipで入手可能）ているブラウザーはNetscapeのみ。

色を透明化するという機能があり、これをというシェアウェアがあるので、これを使う使うことでその効果が出せる。

とよいだろう。

先に紹介したGIF ConverterやGraphic
Converter、Paint Shop Proなどのソフトを使うと、通常のGIF フォーマットファイル

切り抜きに見せたい画像の地の部分を、表示時の背景色に近い色にしておくからインターレースGIFフォーマットのファイルを作成することができる。操作はいずれもファイルのセーブ時にフォーマットを指定するだけだ。ただ、何でもかんでもイン
ターレースにするのは、かえって逆効果。
目的によって使い分けるようにしよう。
透明化したい色をパレットから選ぶ

Transparency を使った切り抜き前と切り抜き後の画像
アンチエイリアスをきかせた画像を使用する場合、背景色に近い色を画像の周りにつけておくと切り抜きが滑らかに見える
インターレース画像の表示
1インターレースGIF ファイル読み込み中

Playboy のサイト
（http://www.playboy.com/playmates/
playmate-aug95.html）
2インターレースGIF ファイル読み込み終了

088 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

C O O L

H O M EP A G E

7

バックグラウンドとカラーでCOOLに決める
Netscape 1.1 ではいくつかのHTML 3.0 仕様のタグをサポートするようになった。その1つがバックグラウンドとフォアグラウンドを指定するものだ。Web ページはこれで表現力をかなり増したといえる。

バックグラウンドは<BODY>タグのオプ

背景の色を変える

255、黒はRGB=0、0、0。その他のすべてのションとして指定する。一度の指定でその色はこの中間の数値の組み合わせだ。「$」はHTMLのページ全体に影響する。したがっバックグラウンドカラー

これを2桁の16進数に変換した数値を表していて、ページのある部分を別の色で指定する<BODY BGCOLOR="#$$$">

る。実際にこの数値を得るために、私はAdobeというようなことはできない。なお、バッバックグラウンドの色を指定するオプション。コPhotoshop を使っている。自分の使いたい色

クグラウンドはNetscape 1.1からサポート

ンピュータで扱われる色は24 ビットカラーのを選び、その色のRGB 数値を調べてメモし、されたものなので、それ以外のWWWブラ

RGBのそれぞれを0から255までの数値（十進それを16 進数に変換する。私はイタリアのウザーではこれらはすべて無視される。

法表記）で表現する。白はRGB=255、255、Alessandro Levi Montalciniという学生が作ったCalConvert（ftp://ftp.alpcom.it/softw

1

are/mac/LMontalcini）というフリーウェアの計算機を使っている。

32

色の指定をもっと楽にしたいという人は、
1Color Selector（http://catless.ncl.ac.uk/ Lindsay/colours.html）、
2InfiNet の Background Colors（http://www.infi.
net/wwwimages/colorindex.html）、
3RGB Triplet Color Chart（http://www.phoenix. net/˜jacobson /rgb.html）、
4The Color Specifier For Netscape 1.1（http:// www.interport.net/˜giant/COLOR/hype̲
color.html）などをリファレンスとして使うといいだろう。

4

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

089

背景に画像を貼る

文字の色を変える

テキスチャー

文字カラー<BODY BACKGROUND="URL"><BODY TEXT="#$$$">

指定するオプション。どれだけの期間、既訪

これはバックグラウンドにテキスチャーを使うた

指定したバックグラウンドカラーやテキスチャ（visited）だと認識しているかは、各ブラウザ

めのオプション。あまり大きな画像を使うとユーによっては、文字色がデフォルトの黒では読ーの設定による。

ーザーにダウンロードの時間を強いることにな

みにくいという不具合も考えられる。こんなとるので注意する。ただし、あまり小さな画像できにフォアグラウンドの文字の色を指定するのアクティブリンクも不具合が起きるようだ。たとえば32 ×32 ピ

がこのオプションだ。色の指定はバックグラウ<BODY ALINK="#$$$">

クセルの画像はうまく表示することができない

ンドカラーの指定と同様にRGBの16進数表

現在アクティブなリンクについて、文字色を指ようだ。64 ×64 ピクセル以上のものが適当だ記で行う。

定する。マウスでリンクが張ってあるポインタ

ビジッテドリンクカラー<BODY VLINK="#$$$">と思われる。Netscape 1.1で使用できるインラ

すでに行ったことのあるリンクに使われる色ををクリックしたとき、この色にフラッシュする。

インイメージの画像フォーマット、すなわちGIF

リンクカラーとJPEGを使用できる。この画像のためのURL<BODY LINK="#$$$">

は<IMG> タグなどのためのURL とまったく同リンクを張ってある文字の色を指定するオプシ様に使う。そのHTMLファイルを置いてあるデョン。まだ一度も行ったことのないHTMLなど

ィレクトリでも他のディレクトリでも、あるいへのリンクにはこの色が使われる。

3はまったく別のサイトでも、そこにある画像を
指 定 することができる。 N e t s c a p e
Communications社では使用自由のテキスチャーを用意して、自社のサイトにリンクを張れるようにしている。

2
1

1Netscape 社の提供しているバックグラウンド画像（http://home.netscape. com/assist/net̲sites/bg/backgrounds.html）
2前面の文字が多いときは読みやすさも考慮してバックグラウンドを決める（http://www.contrib.andrew.cmu.edu/usr/rd3k/family.html）
3前面の画像に合わせて壁紙のようにテクスチャーを使うと効果的（http://www.interverse.com/simona/house.html）

090 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

C O O L

8H O M EP A G E

ハイパーリンクの世界へ
さて、ここまではページの見栄えをよくする方法だったが、これからがHTML の本領、ハイパーテキストを形作る「ハイパーリンク」の方法だ。

他のページへのリンクなど、リンク先をユーザーに示す部分を<A

その設定、ページの色指定によっては異なリンクを張るには、まず当然のことなが

HREF>タグで囲む。それによってリンクのる表示の仕方がされる）。

ら「どこから」「どこへ」がはっきりしていスタート地点を指定することになる。指定「どこへ」の指定は目的とするリンク先

る必要がある。

された部分はご存じのとおり通常は青い文

ページのURLを指定する。

字になり、下線が引かれる（ブラウザーや<A HREF="URL">〜</A>

あなたが作るページの文章の一部や単語

他ページへのリンク

他ページへのリンク（画像から）

同じHTML 内への
リンク

<H2>
<A HREF="http://www.impress.co.jp/book.html">●HTML入門</A>
</H2>
<P>
<A HREF="http://www.impress.co.jp/book.html"><IMG SRC="introduction.gif" ALIGN=CENTER></A><P><HR><BR><A HREF="http://www.impress.co.jp/book.html#chapter1">第一章 HTML言語</A><P><A HREF="http://www.impress.co.jp/book.html#chapter2">第二章 HTMLの書き方</A><P><A HREF="http://www.impress.co.jp/book.html#chapter3">第三章 HTML事例集</A><P><H2>●ＨＴＭＬ入門
</H2>
<PRE>
<H3>
<A HREF="#chapter1">・第一章</A><A HREF="#chapter2">・第二章</A><A HREF="#chapter3">・第三章</A><A HREF="#chapter4">・第四章</A><HR><A NAME="chapter1">第一章 HTML言語</A></H3>
この章では、HTML言語の様々な要素について解説します……
…………………………………………………………………………
…………………………………………………………………………
…………………………………………………………………………
<H3><A NAME="chapter2">第二章 HTMLの書き方</A></H3>
HTMLはあまりに簡単なので、Mosaicあるいはその他の……
…………………………………………………………………………
…………………………………………………………………………
…………………………………………………………………………
<H3><A NAME="chapter3">第三章 HTML事例集</A></H3>
この章には、たくさんのWWWページの事例を集めてあり……
…………………………………………………………………………
…………………………………………………………………………
…………………………………………………………………………
</PRE>

他のページの特定の場所へのリンク

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

091

たとえばインプレス社のホームページにリンクを張るのであれば、URLは「http://
www.impress.co.jp/」となる。

<A NAME="chapter1">第一章 HTML言語

を張る場合は、すべてのURLを記述する必</A>

要はなく、ディレクトリー構造に基づいたという具合だ。

したがって、リンクは次のように記述することになる。

目次部分では、他のページへのリンクの相対パスを指定してやるだけでよい（下図参照）。

ときと同様、クリックする文字列を< A<A HREF="http://www.impress.co.jp">イ

HREF> タグで囲む。そしてURL を書く代

ンプレス社ホームページ</A>へ

わりに、<A NAME>でつけた名前を「#」

このHTMLをブラウザーで見ると「インに続けて書く。

他サイトへのリンクを簡単に作る
ネットサーフィンをしていると、自分のお気に入りのWebサイトを紹介し、そこにプレス社ホームページ」の部分が青く下線<A HREF="#chapter1">第一章 HTML言

リンクを張っているホームページが多いこの引かれた状態になっていて、そこをクリ語</A>とに気づく。自分の趣味を紹介するのと同ックすればリンク先に飛ぶ。また、画像をク

こうしておくことで、この目次部分をクリじで、好きなホームページの紹介からそのリックしてリンクさせる場合は<IMG SRC=

ックすると、ページをスクロールすることなくホームページオーナーの性格や人柄が推察"filename">でgifファイルを指定する。

一気にこの項目にジャンプすることができされる。ただし、URLのリストを作っている。

くのはかなり面倒な作業である。

他のページの特定の場所へのリンクっていて、Bookmarks でURL を整理して<A HREF="URL"><IMG SRC="filename">

もし、あなたが最新版のNetscape を使〜</A>

同じHTML内へのリンク

上記2種類のリンク方法を組み合わせて、いるならば話 は別 だ。 N e t s c a p e の1つのHTMLが比較的長い場合、一番上

他のHTMLファイル内で<A NAME>タグ

Bookmarks には、これまで集めたURL のに目次を作っておくという方法がよくとらが設定してあるところにリンクを張ること

リストをHTML形式で出力してくれる機能

れる。これは同一HTMLファイル内へのリが可能だ。

がある。これをそのまま自分の「What's

ンクである。

<A HREF="http://www.impress.co.jp/book

ファイル内へのリンクであるから、その.html#chapter1>第一章 HTML言語</A>

リンク先「どこへ」を明確にしなければなのように書けば、目次の「第一章 HTMLらない。ファイル名のURLだけではファイ

言語」をクリックすることで、他のサイト

ル内の場所は指定できない。

にあるページの「第一章 HTML言語」のそのため、リンク先となる場所には、そCool」ページにしてしまえばよいわけだ。

項目を表示させることができる。

れを示す<A NAME>タグを埋め込む。このタグではリンク先の場所に好きな名前をつ
ける。

Tips
同じサーバー内でのリンク

5

同じサーバー内にあるファイルにリンク
各ページに目次を目次の項目の数が少なければ、目次だけのページを作るだけでなく、各ページにその目次自体を置いてしまうという手がある。このようにすると、どのページを見ていてもワンクリックで他のページに飛べるし、全体の量と、まだ見ていないページも一目瞭然だ。

同一サーバー内のリンク例

www.impress.co.jp/

project...

magazine

PR

...

staff

advertise~.html~.html

自分のホームページからのリンク<A HREF="../../PR/~.html" >自分のホームページからのリンク<A HREF="../advertise/~.html" >同じディレクトリー内のホームページへのリンク<A HREF="~.html" >目次を各ページに置いている例

092 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

C O O L

9

H O M EP A G E

見に来てくれた人とのコミュニケーション
ホームページで情報を発信するということは、不特定多数の人に見てもらえるチャンスがあるということだ。自分のホームページに対する感想や貴重な意見を送ってもらおう。

メールをもらいやすくする

出るのではなく、指定したメールアプリケ

自分の作成したページやその内容につい1一般的な文字入力フィールドてのコメントを読んだ人からもらうには、たホームページでアンケート

いてい電子メールを使うことになる。

●入力フィールドを作るーションを自動起動する場合もある。
<INPUT NAME="name" SIZE=nMAXLENGTH=n>

メールをもらうために読み手がわざわざメールよりもさらに読み手が反応を返し

メールのためのアプリケーションを自分でやすい方法は、入力フォームを使うことだ。

フィールドに名前をつけて、このタグを書けば立ち上げなくてもよいように、mailto とい

項目ごとに答えていけばいいアンケート用

1行分のフィールドが作られる。SIZE=nでフィうタグが用意されている。

紙的なものを用意しておけば、読み手も答ールドの長さを指定する。MAXLENGTH=nはえやすい。

入力できる最大文字数を指定する。SIZE=nとリンクを張るHREFタグを使って、入力フォームは、いくつかの種類が用意<A HREF="mailto:name@address">

MAXLENGTH=nの部分は省略できる。

されている。

name宛メール</A>

2スクロール可能な文字ボックスフィールドのように書く。こうしておくと、「name宛メール」のところが一般のリンクと同様に色が変わり、クリックできるようになる。クリックするとメールを書くためのウインドウ●まずフォームを定義する
フォームは次のようにFORMタグで囲まれた部分で定義する。

が出て、すぐにメールを書ける状態になる。

<TEXTAREA NAME="name" ROWS=n
COLS=n>〜</TEXTAREA>
ボックスフィールドに名前をつけ、ROWSで行数を、COLS で幅（1 行の文字数）を指定す

メールにはすでに宛先が入っているので、タ<FORM ACTION="URL"

る。〜の部分に文字列を入れておくと、ボック

イトル（subject）と本文を書けばよい。ブ

METHOD=GET¦POST>〜</FORM>

スフィールドに前もってその文字列が表示されラウザーによっては、メールのウィンドウがる。通常は何も入れておかなくてよいだろう。

3ボタンによる選択<INPUT NAME="name"
TYPE="RADIO¦CHEKBOX"VALUE="value">

このページをご覧になった方は、<A HREF="mailto:uchiya-m@impress.co.jp">
電子メール</A>
で感想をお寄せください。

mailto タグで指定したリンクをクリックすると、メールソフトが起動する

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

093

<form method="POST" action="mailto:komiya@impress.co.jp">

1
1
3
4
2
5

名前：<INPUT NAME="Name" SIZE=40 MAXLENGTH=40><P>
E-Mailアドレス：<INPUT NAME="E-Mail" SIZE=40,3><P>
性別：<INPUT TYPE=RADIO NAME="sex" VALUE="male" CHECKED>男性<INPUT TYPE=RADIO NAME="sex" VALUE="Female">女性<INPUT TYPE=RADIO NAME="sex" VALUE="unknown">不明<P>
好きな音楽：<SELECT NAME="music" SIZE=4 MULTIPLE><OPTION>ロック<OPTION>ハウス<OPTION>テクノ<OPTION>ジャズ<OPTION>ポップス<OPTION>歌謡曲／J-POP<OPTION>演歌<OPTION>クラシック</SELECT><P>
このページの作者にはげましのおたよりを書こう！<P><TEXTAREA NAME="comment" ROWS=4 COLS=50>すばらしいページだ！
</TEXTAREA><P><input type=submit value="ポストする"> <input type=reset value="リセットする"></form>

回答はメールで受け取れる

ラジオボタン、またはチェックボックスで回答をストが 表示され、そこから選ぶ形になる。SIZE

してもらう方法は、もっともユーザーに負担がを省略すると選択肢の数に合わせてリストの大かからない質問方法だ。

きさが変化する。

ラジオボタンは複数の選択肢からただ1 つを選

また<SELECT NAME="name" MULTIPLE>

一般的には、サーバー側に受け取るため

ぶ場合に使い、チェックボックスは必ずしも回答のようにMULTIPLE を追加すると、選択肢かのプログラムを置いておく必要がある。し問題はこのフォームに入力してくれた内容を受け取る方法だ。

が1つとは限らない場合に使う。1つの質問へのら選べる項目は複数となる。MULTIPLE の場

かしダイアルアップでプロバイダーにアクセ

回答群は、それらのNAME を同じものにして、合にはポップアップメニューは使えない。

スしてページを作成しているような普通の

VALUE にボタンの意味する内容を記述してお用意する選択肢は<OPTION> の後ろに続けてユーザーは、このようなプログラムをサーバ

く。

記述する。選択肢の数だけ<OPTION>が存在

ーに置くことは難しい。

オプションとしてCHECKEDを付加してすることになる。

ただし、入力された内容をメールにして<INPUT NAME="name"<OPTION SELECTED> とすると、この選択送る方法があり、これならば普通のユーザ

TYPE="CHEKBOX" CHECKED>肢がすでに選択された形で表示される。

ーでもメールを受け取ることができさえす
れば、フォームでの情報受信が可能になる。

のように書くと、すでにボタンがチェックされた形で表示される。ラジオボタンで選択肢を選

5送付／キャンセルボタン

ばせる場 合 には、 選 択 肢 のうちの 1 つを

<INPUT TYPE="SUBMIT¦RESETCHECKEDにしておくべきだろう。

VALUE="name"><FORM

メールでフォームの情報を受信する場合には、このFORMタグで以上の入力を送付するためのボタンがないと、

ACTION="mailto:name@address"

4リストからの選択

最終的に結果を送ることができないので、これ

METHOD="POST"><SELECT NAME="name"を作るのを忘れてはいけない。送付するためののように記述する。URLの部分で、mailto:

SIZE=n><OPTION></SELECT>

ボタンは、TYPEをSUBMITと記述する。

に続けて自分のメールアドレスを書く。
さて、このようにして作ったフォームにいくつかの選択肢のリストから選ばせる方法。

また、すべての入力を初期状態に戻すボタンは数値の指定が1 だとポップアップメニューによ

TYPEをRESETとして作る。

読み手が入力して送付してくれた内容はメる選択になり、2 以上だとその数の行数分のリ

VALUEはボタンに書かれるボタンの名前だ。

ールで送られてくるわけだが、これは書き

094 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

込まれたものがそのまま送られてくるわけ

この形式のデータを普通の読める形のデではない。書き込まれた内容が入力フィーータにするためのツールとして、Macintosh

ルドなどの名前とともに、URLという形式

では田中求之氏のスタック「ClipDecoder」になって送られてくる。たとえば図で入力がある。

された内容がメールで送られてきた結果は、フォーム結果をメールで受け取る方法に

Name=%8F%AC%8B%7B%81@%93O&（http://mtlab.ecn.fpu.ac.jp/provHome.ht

ついて紹 介 している田 中 氏 のページ
E-mail=komiya@impress.co.jp&sex=ml）で、このスタックを入手できる。田中

male&music=%83e%83N%83m&commeさん、ありがとう。

nt=%82%B7%82%CE%82%E7%82%B5%82%A2%83y%81%5B%83W%82%BE%81I%0D%0AIt%27s+cool%21のようなものだ。基本的には各項目の名前の後に回答があり、項目間を&でつないだものなのだが、スペースや記号、漢字の部分がコードに変換されているので、このままでは内容がよくわからない。
フォームの内容はClipDecoder で簡単に変換できる

拍手をもらおうNRI Cyber Business Park（ http://www.cyberbp.or.jp/business/NSC/regist.html）の会員登録のページどうしても「入力された」ものが必要なので、ラジオボタンをつけた。この場合、メールの本

Tips

フォームからメールをもらう方法を利用するこ

文には「GREAT=on」とだけ入って送られて6とで、単にメールを出してもらうよりもずっとくる。項目が1 つだけで、しかもアルファベッ

読み手側の負担が少なくなり、したがってコメ

トなのでURL 形式で受け取っても内容が簡単

ントや反応をもらいやすくなる。ここであげたにわかるのがミソ。ラジオボタンにしたのは内容

例のようなアンケートもいいが、もっと気軽に、を変更できない（しなくていい）からだ。

単純に反応をもらうとしたら……。

もちろん、拍手でなくブーイングボタンにして誰かの作品や行為に対して「面白い！」とかもいいだろう。このようなボタンを反応のほし「すごい！」「すばらしい！」といページの一番下などに入れ思ったとき、人は拍手をする。

ておくのだ。ともかくユーザー

思わず手を打つというこの行動に選択の余地をほとんど与えをフォームに反映させるには、入力するとかボタない （押すか押さないかだけ）ことによって反ンを選ぶとかをせずに、ワンクリックでやりたい。

応を促すのがこのHTMLの目的だ。

Netscape以外の対処法
メールで結果を送る方法は、Mosaic などいくつかのブラウザーでは使えない。入力した結果をメールで送るのでなく、メール入力ウィンドウが開いてしまったりする。
すべてのブラウザーに対応するには、サーバーのディレクトリでSSI（Server Side Includes）という機能を使う必要がある。ここでは詳述しないがhttp://www.st.rim.or.jp:80/˜eyez/
httpd/index.html にこの方法の具体的な解説がある。

おおっと思った瞬間にクリック。
そこで図のような簡単なHTMLを作ってみた。

<FORM METHOD="POST"

ラジオボタンがなくてもメールは発信されるが、

ACTION="mailto:komiya@impress.co.jp">

その代わり中身の何もないメールになる。メール<INPUT TYPE=RADIO NAME="GREAT"のヘッダーを見ればどこから誰が出したかはだ

CHECKED>

いたいわかるので、自分のホームページに1つだ<INPUT TYPE=SUBMIT VALUE="拍手！">けつけるのであれば、それでもいいだろう。

</FORM>

メールの内容で他のメールと区別するためには、

h「COOL なホームページの作り方」第1 部はここまで。第 2 部では完成したホームページを実際にプロバイダーのサーバーから発信する方法を実践的に解説する。なお、来月号の特集では、ホームページで音声と動画を扱うためのテ
クニックを紹介する「COOL なホームページの作り方2 −マルチメディア編」を掲載する予定である。

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

095

C O O L

H O M EP A G E

特集：COOLなホームページの作り方
第2部【実践編】ホームページを立ち上げよう
編集部

ホームページを立ち上げるには？
ネットサーフィンをしているだけの人の中には、世界に向けて情報を発信することは自分の手には負えないことと思っている人が結構多いようだが、これまで解説してきたように、実際にHTML のコーディングをするのは、じつはそんなに難しくはない。
ということで、ここではHTML でのコーディングが終わったあと、実際にWWW ホームページ
を立ち上げる方法を紹介する。

プロバイダーのプロバイダーによって異なる

ホームページ設置サービスを利用しよう

ホームページのサービス内容と利用料金

WWWホームページを立ち上げたくても、

まず、「ホームページ設置サービスを提供

個人にとっては専用線と専用のサーバーはしているプロバイダー一覧」を見てみよう。

の3つに分類される。技術的には、（1）が高嶺の花だ。費用もさることながら、サー個人の場合には通常の会費以外は不要ともっとも簡単で、HTMLが書ければあとはバーを設置したりメンテナンスしたりするいうところがかなりある一方で、ディスク

ほとんど問題ないが、プロバイダーの管理のはかなり高度の技術が要求されるし、そスペース使用料をとるプロバイダーもいく

者の手をわずらわせるのでアップロードのれにかかる時間もけっこうなものになる。

つかある。無料の場合は使用できるディス

たびに料金がかかったりする。（2）ではそこで手軽になるべく苦労しないでサークスペースは2〜5Mバイト程度に制限されFTPでのファイル転送ができる必要がある。

バーを立ち上げたいという人におすすめなているが、画像や動画、音声などのファイ（3）になると、さらにUNIXの操作の知識のが、プロバイダーが提供しているホーム

ルを多く置くのでなければこのサイズで十などがすこし必要になる。自分の力量を見ページ設置サービスの利用だ。最近ではそ分だろう。

極めて、どのタイプが適しているかを判断

イプ（3）すべての作業を自分でやり、プロバイ
ダーは一切手助けしないタイプのようなサービスを提供するところも増えたので選択の幅も広くなった。ホームペー

料金のほかに検討しなくてはいけないのが「設置方法」だ。大きく分けると、いうプロバイダーも多くあるので、その気になればけっこう簡単に自分のホームペー
ジを持つことができる。

096 INTERNET MAGAZINE 1995/10

また、もしできるなら、多くのホームページが置かれているプロバイダーを選ぶよ

ジを置くためのディスクスペースに制限はあるものの、個人の場合は追加料金なしとしよう。

（1）データファイルをプロバイダーに渡し、うにしよう。そういうプロバイダーではユー

設置はプロバイダー側でするタイプ

ザー同士がBBSやメーリングリストで情報（2）決められた場所に自分でファイルを転交換をしていたりして、ホームページを立送し、設置はプロバイダー側でするタ

ち上げるときにはけっこう役にたつものだ。

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

個
人 通常の会費以外は不要

ASAHI-ネット

α-Web

法
人 月額利用料金 ¥30,000個
人 月額利用料金¥100,000/100MB

法 増設費用¥10,000/10MB
人
個 通常の会費以外は不要
人 （ダイアルアップIP接続のみの会員は手数料¥2,060）

個 登録料¥10,000
人 月額利用料金 ¥1,000

非商用は通常の会費以外は不要

リムネット

登録料¥10,000

法
月額利用料金 ¥30,000人

増設費用（月額） ¥5,000/10MB

インターネット
ワーク京都
インターネット
フューチャー
NewCOARA

個 通常の会費込み¥10,000
人 （商用禁止）
法 登録料¥10,000
人 掲載料金 ¥30,000個
人

非公開専用会議室、メー
10MBまで。
増設は10MB単位 ル、MOなど

24社

http://mmjp.or.jp/index.html（mail）
ap-net@asahi-net.or.jp

法人・団体のホーム
ページは、専任のスタッフが制作

http://www.alpha-web.or.jp/（mail）
www-admin@alphaweb.or.jp

ビジネスモールという仮想的なショッピ
ングモールにホーム
ページを開設（mail）
homepage@super.win.or.jp

個人会員のホームページアクセス頻度レ
ポートサービス有り（mail）
win-www@super.win.or.jp

ページ単位の利用、
ショッピングモールのテナントサービスもある

http://www.rim.or.jp/（mail）
pr@rim.or.jp

個人の場合は有料で20MBまで拡張可能

100MBから。 データをもらい大塚商会 現在関連組織
のみ
増設は10MB単位 でディスクにおとす

7MBまで

100MBから。 リンクを張る場合はメー増設は10MB単位 ルで登録用紙を送る

3MB

自分のディレクトリにFTPで1200名以上（商用は約10名）

50MBから

ディスク渡し、FTPなど

約10社

2MBまで

ファイルを自分のホーム
ディレクトリにFTPなどでコピーし、登録する36件

http://www.jeton.or.jp/（mail）
support@jeton.or.jp

30名

http://www.imasy.or.jp/（mail）
info@imasy.or.jp（faqの自動ﾒｰﾙｼｽﾃﾑ）
get-faq@imasy.or.jp

10MBまで拡張可能

各自shellにloginして設定する

個人

通常の会費以外は不要

500KBまで法
人

月額利用料金 ¥1,000

なし

約35件
申し込みはメール、デー （登録のみでタはFTPで転送するは80件）

http://web.kyoto-inet.or.jp/people.html（mail）
query@kyoto-inet.or.jp

通常の年会費以外不要

5MB
（検討中）

最低限のルール（ディレクトリ、ファイル名など）に従い、FTPで転送

http://www.ifnet.or.jp/（mail）
staff@ifnet.or.jp

特になし
（検討中）

通常のホームページは各
自がファイルを作成した
後、メールで担当者に連絡する。
｢一村一品Virtual Shop｣
は事務局と相談して登録

約70件

特になし

FTPまたはフロッピーデ
ィスクで

数件

5MBまで

1データを圧縮、テキス
ト化した後、使用機種
名、ツール名、ディレクトリ構造の説明をつけてメールで送る個人
法人

個人 通常の会費以外は不要「一村一品Virtual Shop」の法 コーナーでは月々¥500プラス
個 初期費用 ¥100,000
人 基本料金（月額）¥100,000/100MB
法 増設費用（月額）¥10,000/10MB
人 データ更新費用¥50,000/回

通常の会費以外は不要

個人

加入費用 ¥20,000
月額利用料金 ¥10,000/10MB
法 増設費用¥10,000/10MB人
個

C&Cインターネット 人 個別見積り
サービスmesh 法人
個 ダイアルアップIP接続を年間契人 約している会員は無料

10MBが基本。 指定サイトへFTPで転送。
以降、10MB単位 FD、DAT、CMT等の郵で増設（最大 送も可（手数料¥3,000）
100MBまで）50MBが基本。
以降、10MB単位 ユーザーによって異なるで増設可能

http://www.bekkoame.or.jp/

業者を
案内可

個人ユーザーの非営
利目的のホームペー
ジを無料で預かる試
行サービスを実施中。レポートサービス（有料：¥10,000）も用意

7件（mail）
info@sphere.or.jp

12法人

http://www.meshnet.or.jp/（mail）
info@mesh.ad.jp

仮想電子広場として「The Cyber Plaza」
を開設。登録は個別に対応しているhttp://www.gol.com/（mail）
sales@gol.com（news）
gol.general/gol.internet

ユーザー専用サーバー（GOL内、ユーザ
ー内）の構築サービ
スもある（mail）
helper@twics.com/
support@twics.com

会員は個人のホームページの他に、自分の働く会社が提供するサービスを紹介することもできる

特になし

5MBまで

ファイルを自分のWWW
用ディレクトリに転送する（個人用）
http://www.twics.com/www/
twics/members.html（提供サービス紹介）
http://www.twics.com/www/
twics/services.html

個
人

約35件

（個人用）
http://shrine.cyber.ad.jp/~jwt/shrinehomesg.html

法
人

4件

（ビジネス向け）
http://www.cyber.ad.jp/
new-CTI/vip/vip-j.html

法
人

1ページ
¥20,000より

http://www.sphere.ad.jp/
you/you.html

約100件

通常の会費以外は不要

ページ単位の利用、
ショッピングモールのテナントのサービスもある（mail）
info@space.ad.jp（news）
bekkoame.perosnal-www

1ファイルをFTPでサーバーに転送する10社
2作成をしたファイルの （予定含む）
設定をメールなどで担当者に依頼（有料）

個
人

TWICS

今秋には250GBの大容量サーバーを設置予定。
回線速度も768Kbps
以上にグレードアッ
プする予定（mail）
tooru@fat.coara.or.jp

http://www.space.ad.jp/（対応中）

8月よりサービス開始予定（mail）
www@bekkoame.or.jp
460名以上50件
ファイルをFTPでサーバ（予定含む）
ーに転送する

データ超過料金 〜¥150/1MB
データ更新料金¥5,000/1回

予定（会議室）「unix会議室」
telnet coara.or.jp

4MBまで

初期費用 ¥200,000
ディスク占有料金 〜¥500/1MB

法 月額基本料金 ¥25,000〜
人 ディスク使用料 〜¥100/1MB

応相談

http://www.coara.or.jp/

2FTPにHTMLファイル
を置き、準備ができたらメールで連絡法人

サイバー
テクノロジーズ
インターナショナル

10社

5MBまで
（予定）

BEKKOAME

グローバル
オンライン
ジャパン

20件（WINの作 成 し た フ ァ イ ル を ホームページ
WWW用ディレクトリに にリンクして
転送する
いるもの）

通常の会費以外は不要

法
人

備
考

（会議室）ASAHIﾈｯﾄ内の「チャレンジ・ザ・HTML」

個人

InfoSphere

作
成
代
行
サ
ー
ビ
商
ス
用
利
用

http://asahi-net.or.jp/an.lib/userhomeindex.-j.html

人

netSpace

問
い
メ 合わ
ー せ
ル 先
ア
ド
レ
ス
会
議
室

50件

http://www.win.or.jp/
法 登録料金 ¥300,000
人 月額利用料金 ¥80,000

インターネット互助会横浜IMASY

ホ
ー
設 ムペ
け ー
て ジ
い を
る
会
員
数
会
員
へ
の
リ
ン
ク
ペ
ー
ジ

ASAHIネットの専用メニ
ューで設定

5MBまで

インターネットWIN

JETON

設
定
方
法

フ
ァ
イ
ル
サ
イ
ズ
の
制
限

費
用

プ
ロ
バ
イ
ダ
ー
名

ホームページ設置サービスを提供しているプロバイダー一覧（会議室）PARTICIPATE（mail）
helper@twics.com/
support@twics.com（会議室）PARTICIPATE

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

097

HTMLコーディングが完成したら、トファイルかバイナリーファイルかに注意しが完了したら、管理者に通知のメールを出サーバーにアップロードするてアップロードしよう。ほとんどのWWW

すのを忘 れないようにしよう。（ 3 ） のサーバーが稼働しているUNIX、MS-DOS、WWW ホームページの立ち上げをすべてユ

オフラインでのHTMLコーディングが完

Macintoshでは、それぞれ改行コードが異ーザーが行う場合は、ホームページ一覧に成したら、いよいよプロバイダーのサーバなっているからだ。もちろんアップロードの登録してもらうためのルール、たとえばデーマシンにアップロードとなる。

前にはプロバイダーのアップロードのルールィレクトリの名前などが決まっているので、に合っているかを再度確認する。また転送

それに合わせるようにしよう。

先ほどの設置方法別に注意するポイントを挙げると、（1）のデータファイルをプロバイダーに渡す場合は、データファイルのホームページをつくったらみんなに作成ルールが決まっているのでそれに合っ知らせようているかをチェックしておこう。（2）のFTPでファイルを転送する場合は、テキス

せっかくホームページをつくったのだか

HOME PAGE OWNER INTERVIEW
これはチャンスだ!
日本初というのは歴史に残るぞと思ったんです

ホームページの制作環境は？

ホームページに対する反響は？

機種はMacintosh LC III でした。今じゃ、中

そりゃ、多いですよ。突然メールが来るんで古屋でみかけると3 万円ぐらいですよ。でも、す。
「はじめまして」って。今も1 週間に10そのぐらいのマシンでも、十分つくれちゃいま通ぐらいかな。
「参考になりました」とか「質すね。普通のグラフィックソフトに普通のエ問があります」とかね。雑誌の記事を書いて小林照幸氏

ディターです。当時は、HTML 作成のためのいる方とも、何人かメールでやりとりしましjhttp://www.bekkoame.or.jp

ソフトなんてほとんどありませんでしたから。

た。ほかにも、企業でホームページを立ち上/~kbystryk/

今も、普通のエディターで書いてます。

げたいっていう相談も結構あります。みなさんが聞けば誰でも知っているような一流企業

ホームページを作ろうと思った動機は？

も多いですよ。企業としてさっそく創りたい

去年の10 月の終わりか11 月の初めだったとからっていう相談もあれば、上層部に稟議を思います。日本のインターネット接続プロバイ通すためのプレゼンテーションの材料として創ダーとしては初めてBEKKOAME/INTERNETってほしいという相談まであります。

が会員へのホームページの無料開設サービス
をアナウンスしたんです。その前から「自分これからホームページを作ろうとする人へのWWW のホームページを持ちたい」とは思私が相談を受けてきた中で感じたことですが、っていたんですけど、それができる環境という今、大企業とか年輩の人に多いのは、始めるのはそれまでなかったんですよね。だから「おための動機を一生懸命に探してそこで止まっ

おっ、今だ、これはチャンスだ! 日本一を維持てしまっていることなのです。そんなに難しくするのはたいへんなことだけど、日本初とい考えなくても「おいしいラーメン屋さん」をうのは歴史に残るぞ!!!」と思ったんです。そ教わって、ちょっと行ってみるぐらいの感覚れに……私、じつはBEKKOAME/INTERNETBEKKOAME からのサポートは？

で試してみたほうがいいんじゃないかな。そのの入会金を銀行振り込みするときにATM 機

前例がなかったわけですからね。まだ会員数

うえで、何か困ったことがあったら私にでもが使えなくて行員さんにやってもらったほど、も少ない時期だったので、スタッフと電話でマ

誰にでも気軽に相談してください。技術の知

機械に弱いんです。そんな私が日本初というンツーマンですよ。BEKKOAME/INTERNET

識があることが特別偉いわけじゃないから、知ことになれば、インターネットっていうのは、のスタッフは、みんなやさしいんです。ときどらないからって卑屈になることはまったくない

少しぐらい機械に弱い人でも誰でもできるんきスタッフとユーザーとで飲み会をやるんですんだし、初めての人とでも簡単にコミュニケ

だぞっていうことになるでしょ。

が、そのときみんなで情報交換などもできるーションがとれるというのがコンピュータネッ

し……。

トワークのすばらしいところなんだから。

098 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

ら、できるだけ多くの人に見てもらおう。
プロバイダーのホームページ一覧に登録

112 ページ「ホームページアクセス倍増計

見た人が面白いと感じ、なんども訪れてく画」を見てほしい。

れるというもの。それには、やはり自分のホームページはすべて自分で管理するのがしてもらうだけでなく、自分のホームペー
ジを紹介してくれそうなWWWサーバーの自分のホームページは自分で最適といえる。だれに気がねすることなく、オーナーや出版社などに、開設のお知らせ

管理するのが一番思いついたときにすぐ更新できるようにな
ると、インターネットライフが何倍にも楽

メールを出してみよう。
また、GALAXY、InfoSeek など「サーいつも新鮮な情報が詰まっていてこそ、

しくなることうけあいだ。

チエンジン」と呼ばれているサイトに登録

自分のページを自分で管理することは、してもらうのも1 つの方法だ。登録方法に最初はすこしとまどうかもしれないが、慣は、電子メールで送るタイプと、サーチエ

れてしまえばそう難しいことではない。こンジンにアクセスして登録フォームに記入の特集を参考にして、ぜひチャレンジしてするタイプの2タイプある。詳しくは本誌のみてほしい。

HOME PAGE OWNER INTERVIEW
WWWこそ本当のデスクトップ
バブリッシングと思うんですホームページを作るのは簡単でしたか？

ビスも始まったので、とても満足しています。

私はTWICS の会員なのですが、ホームページ

ホームページのアクセス記録やHTML フォーを作るのは非常に簡単でした。ユーザーはたムによるフィードバックのサービスも重宝してだWWW とという名前のついた個人用スペーいます。

フォレスト・リントン氏

スにフォルダーを作るだけです。そのフォルダ

jhttp://www.twics.com/~forestにデータを入れてやると、TWICS のWeb サ

ホームページに対する反響は？

/theforest.html

ーバーですぐに見られるようになります。

一度も会ったことのない人からよくメールをもらいます。ホームページを褒めてくれたりしますが、日本についての質問もあります。サホームページを作ろうと思った動機は？

イバースペースで友人に「再会」したり、新自分の宣伝になること、サイバースペースでしい友人を作るのはとても愉快な経験です。

目立ちたいこと、「富と名声」（笑）
、出版の他にもメリットがあって……自分の履歴書を世界に関わろうとする人たちとコミュニケー

Web で公開したら、突然仕事のオファーが3トしつつ競争すること……などです。昔から件も舞い込んできたんですよ。

出版業界に興味を持っていましたし、何らかの形で関わってもきました。Web、そしてサ

これからホームページを作ろうとする人へ

イバースペースは、最も強力で新しいメディ

1984 年のMacintosh の登場、そしてDTP 革

アの1 つです。ですから当然のなりゆきだった

命は出版界に大きな変化をもたらしています。

といえるでしょう。

でも、私の考えでは、DTP 革命はまだ始まったばかりなのです。確かに印刷物を作ること

ホームページの制作環境は？

が個人でも手軽にできるようになりましたが、そうしてできあがったものを流通させるのは難ハードウェアは24M バイトのRAM と1G バイ
トのハードディスクを内蔵したMacintosh

プロバイダーからのサポートは？

しいことでした。インターネットで可能になっQuadra 650 に16 インチモニターを付けて使TWICS ではインターネットに関するいろいろたのが、発想の段階から配達までをカバーすっています。ソフトはシステム7.1E およびJ、なトピックでセミナーを開催していますし、電る「本当のデスクトップバブリッシング」だ

Microsoft Word 、 Adobe Photoshop、

子メールでの質問にも対応は速いですね。

と思うんです。誰にも参加するチャンスは与Astrobyte BeyondPress（QuarkXpress 用

もともとTWICS を選んだのは、東京で一般えられているのですから、これを利用しない手のH T M L 自動変換ソフト）、N e t s c a p e 、

ユーザー向けのサービスを始めた最初のプロはないですね。

NCSA Mosaic などです。

バイダーだったからですが、ホームページサー

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

099

リムネットWWWサーバー
立ち上げ記
HTML コーディングで15 分。アップロードで15 分。WWW サーバーの立ち上げは30 分であっけなく終わってしまった。
●●●

やはり、実際に立ち上げてみなくてはとにかくホームページをつくっていよいよアップロードの時が来た

この特集をまとめる最終段階になって、編集部というところは便利なもんで、席

15 分もたつと、「はーい、できました」

サーバーの立ち上げ記録をぜひ掲載しようにすわったまま「リムネットでホームページとの声が返ってきた。さっそく、その人のということになった。サーバー立ち上げの立ち上げたいんだけど、何という名前でデマシンからリムネットのサーバーに実録を紹介すれば、サーバーを立ち上げるィレクトリつくったっけ？」と大声を出す

TELNETでログインする。編集部は専用線

ことがどれほど簡単なことか読者にきっとと、「パブリック・アンダーバー・エイチテ

だが、ダイアルアップIP接続の場合も操作わかってもらえるだろうと考えたからだ。とィーエムエルです」とどこからか答えが返は同じだからいいよねということで、アッいっても、もう原稿を書く時間はもちろん、ってくる。

プロードの作業を開始した（じつは、リム

編集する時間もほとんど残されていない。

そうか、「それじゃ、1 ページでいいからネットの場合はインターネットからログイ

最短時間でサーバーを立ち上げられられる

インプレスの編集者ページにリンク張ったンすると使用時間がカウントされないとこ
ろが違うのだが……、知ってた？）。

プロバイダーはどこだろうと検討した結果、やつ書いて〜」というと、「わかりました「リムネット」に白羽の矢がたった。リムネー」と声が返ってくる。ご存じのようにイットなら、すでにアカウントもあるし、こンターネットマガジンの編集者は自分のホ置くディレクトリをつくることだ。mkdirコ

こなら自由にサーバーマシンにログインしームページを持 っているので、 簡 単 な

マンドで public̲html 、その下に画像フたりファイルを転送したりできる。
「自由放

HTMLコーディングなら、ほとんど誰でもァイルを置く gif

任主義」というのか「まったくユーザーにこなしてしまうのだ。みんなに助けられて、作成した。

頼っている」というのか……。しかし、こ手配はあっという間に終わってしまった。

のようなときには便利な存在だ。

まず最初にやるのは、HTMLファイルを次のステップは、つくったディレクトリ
の中にファイルをアップロードすることだ。

サーバーにログインして必要なディレクトリをつくる
実際にWWW ブラウザーでアクセスしてチェックする

作成したディレク
トリにファイルを転送する

100 INTERNET MAGAZINE 1995/10というディレクトリを

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

使っていたのがMacintosh だったので、終わってしまった。

の持ち腐れである。ところがリムネットの場合は、ユーザーのホームページ一覧に、

Fetch というFTP プログラムを起動してサーバーにログインする。まず目的のディレク

その日の夜にはホームページ一覧に自動的に登録してくれるのだからうれしい。

トリを表示させたあと、ファイルをアップロー登録されるといっても、これはリムネットのサービスでドするために「PUT」ボタンをクリックする。
ファイル名を選択するダイアログボックスが

再度 TELNET に戻って、正しくファイ
ルがアップロードされたかを確認する。

はなく、あるユーザー（dorachan）のつくったプログラムが毎晩ユーザーのディレクト

表示されるので目的のファイルを選択する。

最後は、Netscape を立ち上げ、実際にリを1つ1つチェックして、ホームページが次にアップロードするときのフォーマットをアクセスしてチェックする。画面のようにあれば自動的に登録してくれるのだ。これ聞いてくるので、HTMLファイルの場合はちゃんと見えたのであった（あたりまえ！）。

で、みんなのホームページを見にきたネッ

さて、ここで問題なのはホームページを

トサーファーにアピールすることができる。

を選択する。サイズが小さ立ち上げたのを知っているのは当編集部のさあ、思い立ったが吉日。あなたもさっ

いせいもあって、アップロードはあっけなくたった数人だけである。これでは、宝（？）

TEXTを、 画 像 ファイルの場 合 は

RAW DATA

そくホームページを立ち上げてみよう。

HOME PAGE DESIGN FOR BUSINESS
人を呼び込むための
ホームページデザイン
野村総合研究所
jhttp://www.cyber-bp.or.jp/
index-j.html

ると思います。少しずつ色を変えるとか、何実用化のための課題は何ですか

らかの工夫をしないといけないと思っていま

実際のショップではお店の名前を知らなくてす。ビジネスで利益を生むかどうかは、何度も、賑わっていれば何だろうと興味をそそらも来てくれるリピーターの数で決まってくるわ

れて中に入ってみるということがありますね。

けですから。

それをホームページでうまく表現する手段がまたユーザーの中には、回線が14.4Kbps のまだないんです。いまサイバービジネスパーク

人もいれば1.5Mbps の人もいるわけです。特に出店している企業は誰でも知っている有名

定の機種やソフトウェア、回線速度に依存せ企業が多いので問題ないかもしれませんが、

野村総合研究所（NRI）では、WWW サー

なんとか賑わいを表現するうまい方法を見つ

バー上で「サイバービジネスパーク」と名付けたいと思っています。

けた仮想の商業施設を構築し、インターネッ

また、現在は実験段階ですから問題はないのトビジネス利用の実験を行っている。

ですが、実際のビジネスでは企業からも一等地がほしいとか、立地が悪いとかの反応も出コンセプトはどのように生まれたのですかてくると思います。そうなると、各企業への仮想の商業施設のメタファーをどこから持っ公平さということもデザインに関わってくるでてくるかという問題が最初にありました。おおしょう。自動的にローテーションできるよう

まかなコンセプトから出発し、次に実際の都な仕組みとか、実験であるうちにいろいろ試

市計画に携わっているスタッフの協力も得てしたいと思っています。

具体化の作業に入りました。とくに参考にし今後のホームページはどうなりますか

た他のサーバーなどはなく、都市デザインのパ
ターンというものが頼りでした。それで、ショ

制作スタッフの鈴木氏、藤元氏、内山氏

ッピングゾーンだけでなくオフィスやコンベン

まだ進化の途上ですから試行錯誤が続くでし
ょうが、ひと目見ただけで、ものを売りたいの

ションセンターの機能も取り入れたいと考えずに利用できるように注意しています。たとか、広告なのか、ユーザーからの情報を求めた結果が都心のイメージだったのです。

えば、色数はなるべく減らして軽くなるようているのかなどの目的や特徴がわかるものはにしています。最近ではHotJava やVRML な

増えてくるでしょう。大事なことは、デザイン

デザインでは、何がポイントになりますか

どの高度なインターフェイスが注目されていとは見た目のことだけでなく、シナリオ構成ま

週刊誌は毎週表紙が変わりますが、たいていますが、それらについては商品購入の意思決で含めたものだということです。ヒューマンイ

のホームページは中身が変わっても表紙はそ定に関わることを見極めてから取り入れよう

ンターフェイスまで含めた形でデザインを考えのままですね。それが1 つのネックになっていというスタンスです。

るということがこれからの課題ですね。

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

101日本のWebの現状に思う
日本でWeb が本格的に上がり始めてから1 年足らず、私たちがWeb 関連のビジネスを開始して半年余り、この短い間に
Web はインターネットの話題を語るのになくてはならない存在にまでに成長しました。私たちの仕事は、Web サーバーを立ち上げたいというお客様から、ホームページを作ってほしいというお客様まで、多岐にわたっていますが、綺麗な絵が映って、動画がそこそこ動いて、おしゃべりまでしてくれちゃう、初めてWeb をご覧になった方は、一様に何らかの感動を抱き、時代の進化を実感されるようです。
アイアイジェイ メディアコミュニケーションズ： 林 聡子

今や、ホームページは名刺代わりには、インターネット上に分散した情報サー

使われている

バーを渡り歩く（上手に情報を検索する）のに欠かせないものです。しかしながら、最Webにおけるコンテンツは、昨今ではホ近になって開設されたホームページの中でームページと呼ばれるようになってきていまは、それが用いられることが著しく少なくすが、元々、ホームページとは、本でいえなってきています。インターネットサーフィ

ば表紙、家でいえば玄関に相当するもので、ンとは、いくつもの波を渡りながら、インWebコンテンツの一番上のページ（一番最ターネットをナビゲートしていくことであっ初に表示されるページ）の呼称です。

たはずなのに、これができなくなり始めているのです。

このようにホームページとは、いわば、Web コンテンツの「顔」に当たる部分です。Web草創期には、どこか垢抜けていな

ったのも何ら不思議なことではありません。

このままでは、インターネットはかったホームページも、昨今ではどんどん

今や、ホームページはインターネットで活情報の夢の島になってしまう

綺麗に美しく、オッシャレーになってきて動する人々や企業の名刺代わりに使われています。その理由を探ると、1 つには難し

いるといっても過言ではないでしょう。

いものと思われがちのコンテンツ作成が、案外易しいということが知られ始めたこと。

企業のホームページの典型ともいえるパターンは、社長の挨拶、業務概要、製品

ネットサーフィン、忘れてませんか？

テキストエディターとちょっとしたお絵書き

案内、地元の紹介などで構成されるものですが、ちょっと考えてみてください。会社

ツールを使ってデータを揃え、後はお気に商売柄、日々あちこちのサーバーをアク

概要なんて毎日毎日見たいものでしょう

入りのHTMLソースを真似れば、あっといセスしたり、いろいろなところのホームペー

か？

う間にオリジナルのホームページが出来上ジを見るにつけ、インターネットは何と賑係のない企業だったら、一生に一度も見れがってしまいます。単純な画面に色を着けやかになったのだろうと思います。ところば十分だと思ってしまいます。驚くべきこるだけでも、ものすごく綺麗に見えてしまが、同じ画面を表示したままの時間がだんとにこのようなホームページが実に多くな

うから不思議なものです。別の理由としてだんと長くなっているのに気がつくまで、そってきています。手軽に作れるといってもは、自前でWeb サーバーを持たなくても、

んなに時間がかかりませんでした。他のペまとまったボリュームになれば、それなりの

比較的低価格でWeb コンテンツを設置でージをアクセスする気にならないというか、作成費用は発生します。手軽にできるオイ

きるサービスが広まってきたこともあげられ飽きてしまったというか、おいおい、なん

シイ情報発信は、実は大いなる経費の無駄ます。何らかの手段でインターネットにIPだかおかしいんじゃないの？

それどころ使いになっているかもしれません。立ち上

接続できれば、見るだけでなく、自分でホか、溢れかえる情報の海の中から、本当にげ当初は過渡的なアクセスを集めることがームページを持てるようになったわけです。

捜したいものすら、いらぬ情報が邪魔して、できても、継続的なアクセスを得られない

しかもインターネットは世界規模のマーケ

だんだんと見つけにくくなってきてしまって

ホームページが急増しています。これは企ットを持つメディアですから、ホームぺー

いるのではないでしょうか。

業のホームページに限ったわけではありま

少なくとも私にとって、まったく関ジを開設するということは、全世界に対し

Web は情報提供や検索といった本来のせん。ひょっとしたら、開設したはいいけてものを言うことにも等しいわけです。企姿から、広告媒体もしくは別の機能を持っれど、一度も見られないで終わってしまう

業も個人ユーザーも、この魅力的な新しいた機能サーバーへと変化しつつあります。

ものもあるのかもしれません。今やWebにメディアを何とか攻略しようと、現在のよWebの最も大きな特長の1つとして、ハ

よる情報発信は、一歩間違えば情報投棄

うなホームページブームが一気に盛り上がイパーリンクという機能があります。これになってしまう状況にすらあるといえます。

102 INTERNET MAGAZINE 1995/10

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

特集

インターネットは情報の夢の島になって何を置きたいのか 、作成に入る前にちょしまうのでしょうか。このような事態を回っとだけ考えてみてください。そして、ア

避し、本当に活用されるホームページを作クセスしてくる人がどういう表情で見てくるにはどうしたらいいのでしょうか。その答れるかをイメージしてみてください。ホーム

えの1 つは、Web での、ひいてはインター

ページは「作る」のは簡単だけど、「創る」

ネットでの情報発信の意味を、もう一度よのはとても難しいものなんです。

く考えてみることです。インターネットを簡単ですが、誰にでもできる「よりよい情報メディアという観点で見れば、Webはホームページを開設するヒント」をお教え

情報を伝達するという能力に長けたメディ

しましょう。

アではありません。Web での情報発信は、【作る前】アクセスしてもらってこそ初めて、設置さ●どういう人に見てもらいたいのか考えよう。

れた情報が流れていく、実は非常に受動的●何を伝えたいのか、1 つ主張というものを持な一面をもっています。インターネットのってみよう。

情報メディアには、ほかにNetNews、メー【作った後】

リングリストといった旧来のものも存在し、●上げたんだよというプロモーションを行おう。

盛 んに活 用 されています。 たとえば、●反応をもらう手段を用意し、意見はきちんと

NetNews はWeb と異なり、大量のデータ受け止めていこう。

を1 か所に蓄積するのには不向きですが、【もっと後】

情報の即時伝達性には優れたメディアです。

●内容は少しずつでも変化を持たせていこう。

このようにインターネットでの情報発信を上手に行っていくためには、最新のメディ

あなたのホームページにアだけに依存するのではなく、他のメディ主張はありますか？

● 筆者のプロフィール
株式会社アイアイジェイ メディアコミュニケーションズ技術部部長。週に1 本のペースでWWW ホーム
ページを作成しているHTML オーサリングのエキスパート。寝ても起きてもWeb、Web の毎日が続いている。ここに紹介する2 つのサイトは、筆者の手によるものである。

株式会社ベネッセコーポレーション
j http://www.benesse.co.jp/
現在、イタリアのベネチアで開催中のビエンナーレの中の催しの1 つ、「トランスカルチャー展」を紹介している。美術館を訪れる人は、それぞれに違った思惑を抱いている。さあ、どこから巡っていこうか。
このサーバーでは、美術館を訪れる人それぞれのドラマをイメージしながら、思い思いのスタイルでトランスカルチャー展の内容を楽しめるような構成と演出を行っている。

アを組み合わせて行うことが非常に効果的だと考えられます。

いずれにせよ、多くの人々が自分の情報を発信しようとするのは非常によいことに「作る」のは簡単だけど、違いありません。だからこそ、Webが新し「創る」のはとても難しい

い情報メディアとして市民権を得ていくた
めにも、ここで一歩進んだ情報発信とは何

今1 つの答えは、やはり内容の充実でしかを考えてみようではありませんか。苦労ょう。多くのホームページは、どこかで既して作ったせっかくのホームページが見ら

存のホームページHTMLの影響を受けていれずじまいにならないようにするには、いろるように思われます。しかしながら、そのいろな意味での「見てもらう工夫」を考え構成まで真似る必要なんてまったくありまてみてください。デザインに凝るのも一興

せん。システムとしてのWebサーバーは単ですが、適度のお化粧にとどめないと、過なる情報発信サーバーではなく、さまざま

ぎたるは及ばざるが如しです。

な顔を持った新しい「情報ステーション」「何を伝えたいのか」あなたのホームペーとして発展しつつあります。コンテンツはジに主張はありますか？ ウキウキ、わくわWebサーバーの命、作り方次第では商品カくする気持ちを忘れない限り、インターネ

タログにもなれば、1冊の本にもなる、はたットの向こうからアクセスしてくる人々の

また個人のプライベート放送局にもなるわ

顔を忘れない限り、あなたのホームページ

けです。 データを準 備 して加 工 して、は見る人に何かを訴えかけてくれることでHTML にして、さあ発信……ではなくて、しょう。

インターネット上に自分が確保した空間に●

私のイメージギャラリーj http://www.iijnet.or.jp/IIJ-MC/saccha/indexs.html
1993 年7 月からWWW を通じて発信してきた「絵のメッセージ」の総集編のページ。それぞれの入り
口から中は、スライドショー構成になっている。

インターネットマガジン／株式会社インプレスR&D©1994-2007 Impress R&D

INTERNET MAGAZINE 1995/10

103［インターネットマガジン バックナンバーアーカイブ］ ご利用上の注意
この PDF ファイルは、株式会社インプレス R&D（株式会社インプレスから分割）が 1994 年～2006 年まで発行した月刊誌『インターネットマガジン』の誌面を PDF 化し、「インターネットマガジン バックナンバー
アーカイブ」として以下のウェブサイト「All-in-One INTERNET magazine 2.0」で公開しているものです。

http://i.impressRD.jp/bn
このファイルをご利用いただくにあたり、下記の注意事項を必ずお読みください。
z 記載されている内容（技術解説、URL、団体・企業名、商品名、価格、プレゼント募集、アンケートなど）は発行当時のものです。
z 収録されている内容は著作権法上の保護を受けています。著作権はそれぞれの記事の著作者（執筆者、写真の撮影者、イラストの作成者、編集部など）が保持しています。
z 著作者から許諾が得られなかった著作物は収録されていない場合があります。
z このファイルやその内容を改変したり、商用を目的として再利用することはできません。あくまで個人や企業の非商用利用での閲覧、複製、送信に限られます。
z 収録されている内容を何らかの媒体に引用としてご利用する際は、出典として媒体名および月号、該当ページ
番号、発行元（株式会社インプレス R&D）、コピーライトなどの情報をご明記ください。
z オリジナルの雑誌の発行時点では、株式会社インプレス R&D（当時は株式会社インプレス）と著作権者は内容が正確なものであるように最大限に努めましたが、すべての情報が完全に正確であることは保証できません。このファイルの内容に起因する直接的および間接的な損害に対して、一切の責任を負いません。お客様個人の責任においてご利用ください。

このファイルに関するお問い合わせ先
All-in-One INTERNET magazine 編集部
im-info@impress.co.jp
Copyright © 1994-2007 Impress R&D, an Impress Group company. All rights reserved.