さて、ここまでメモ帳にｈｔｍｌタグ混じりの文字を書いてきて、「もっと簡単に出来ないだろうか？」と思われたかもしれません。実は、もっと簡単にする方法があるのです。それが、ホームページ作成ソフトです。 ワープロのように文章を打ち、その文字を見栄えのいいように配置し、文字の色や大きさを指定して・・・・と、作業をすれば、原則としてその状態でＷｅｂページに表示出来るように、勝手にタグをつけてくれるのです。 おお、そんな便利なものがあるのなら、じゃあ、今まで勉強してきたのはナンだったんだ！ と、そう思うかもしれませんね。でも、さきほど、「原則として」と書きました。つまり、何が何でもそうなんだ、というわけではない、ということです。 もしホームページ作成ソフトを使わないのなら、タグだけをマスターすれば済みます。しかし、作成ソフトを使うなら、作成ソフトの使い方をマスターしなくてはいけません。それがじつは、結構大変なのです。 |
作成ソフトには、いくつもの落とし穴があります。その１は、「ソフト作成者が想定していないタグの使い方は出来ない」ということです。たとえそれが、ｈｔｍｌタグを自分で打ったら出来ることでも、です。ソフトの中で規定された使い方でなければ、それはエラーとして表示されなかったり、勝手に書きなおされてしまったりするのです。 個人的な経験から、例をあげてみましょう。 箇条書きのタグ、というのがあります。例として、果物を列挙してみます。
|
上記のように表現したいと考えました。この場合、タグは次のように書きます。 <li>みかん <li>りんご <li>バナナ さて、この文字を青くしたいと考えました。
|
| こんな具合にしたかったのです。でも、できませんでした。次のようになったのです。
|
みかんの前の「・」から、バナナまでを範囲指定し、青色にせよと指示したのですが、上記のようになってしまいました。仕方がないので、タグを直接打ちこむ画面に切り替えて書き直しました。<li>みかんの前に、<font color=blue>と入れたのです。にもかかわらず、再び作成画面で開きなおすと、元に戻ってしまうのです。タグの解釈を間違っているのではなく、あろうことかタグそのものを書きなおしてくれています。 | つまり、最初の「・」の色を変えるなどというのは、その作成ソフトの作者にとっては想定外、それどころか、「そんな表現はありえない」と禁止までし、誤った使い方と規定して修正までしてくれるのです。いやはや・・・ 詳しく事例を記憶しているわけではありませんが、このような現象は、ホームページ作成ソフトでよく起こります。自分でタグを打ち、かつ、ブラウザでも思った通りに表現できているにもかかわらず、作成ソフトでファイルを開くと、レイアウトが無茶苦茶になったり、勝手に修正してくれたりするのです。 もともと自分で書いたタグが、文法的に間違っている場合もあります。しかし、作成ソフトはあくまでひとつのソフトでしかありませんので、そのソフトの中に色々なことが規定されています。したがって、それ以外の使い方は出来ない、ということになります。また、表組（テーブル）タグというのがあるのですが、表の中に表を作るという「入れ子」状のものが作れます。けれど、これがちょっと複雑になるととたんに対応できなくなってしまうソフトもあります。しかし、この表組タグを入れ子状にして使うのは、デザイン上とても役に立つのです。（使い方としては邪道ですが） このように、ホームページ作成ソフトは、そのソフトで想定した使い方しか出来ない、という欠点があるのです。 |
作成ソフトの使い方でもうひとつ注意しなくてはならないのが、リンクの設定です。 リンクの方法や、絶対パス、相対パス、というのについては既に学んだとおりです。思いだしてくださいね。 さて、作成ソフトの「リンク」は、どのように注意しなくてはならないのでしょうか？ タグの直打ちと異なり、「作成ソフト」ですから、ファイル名を書きこむのではなく、多くの場合、ファイルそのものを指定します。これは、いわゆる「参照」機能を使うことになります。リンク先のファイルをパソコンの画面の中で探し、そのファイルのアイコンをダブルクリックする、と言うような手法を取ります。 すると、リンク先のファイル名として、自分のパソコンの中のファイル名を指定してしまいます。例えば、「Ｃドライブの中のhomepageというディレクトリの中のphotoというディレクトリの中の○○という名前のファイル」という具合でリンク先を指定してしまうのです。すると、自分のパソコンの中でホームページを作っているときは、リンクが設定されている文字や画像をクリックするとリンク先へ飛びますが、いざサーバーにアップロードした際に、リンク先にはファイルがなく、「ファイルが見つかりません」ということになってしまいます。 なぜ、こんなことになるのでしょうか。サーバーにおいて、「Ｃドライブの中のhomepageというディレクトリの中のphotoというディレクトリの中のmihon.htmlという名前のファイル」にリンクしなさい、などといっても、これは存在しないドライブやディレクトリを指定してることになるからです。 自分のパソコンの中のファイルからパソコンの中のファイルへリンクするにはこれでいいんですけれどね。 ちなみに、画像が表示されない、というのも、これが原因になっていることがあります。確認してみましょう。 さて、ではどうすれば良いか。仮に同じディレクトリにリンク元ファイルもリンク先ファイルもあるのなら、単に相対パスでmihon.htmlと書けばオッケーです。もっとも、相対パスでタグを直打ちしても、ご丁寧に書きなおしてくれるソフトまであるようで、これには「まいった」としか言いようがありません。 そのホームページ作成ソフトの機能としてついているＦＴＰを使ってアップロードをすれば、ファイルの中の記述を書きなおしてくれるのが普通ですが、この時に何の加減か、ある条件下や、使う雛型によって、勝手にサーバーのディレクトリを新規作成してくれるおせっかいソフトまで存在するようです。 なぜ、こんなことが起こるのでしょうか。 それは、日に日に作成ソフトが便利に成長しているからです。初心者でも簡単に高度なことが出来るようにと機能が拡張されているからです。しかし、初心者が簡単に高度なことなど出来るわけが無く、ホームページ作成の基本的なこと以前に、そのソフトの使用方法やクセをマスターしなくてはならなくなりますので、かえって大変なのです。初心者は大人しくシンプルにやればいいのであって、自分の成長に合わせて徐々に高度なことをすればいいのだと思います。 しかも、機能が高度化するにつれ、その中身が理解しがたくなってきます。「わけわからんけど、とにかく使っている」という状態です。こんな状態でつまずいたら、もはや初心者には解決する術はありません。逆にいえば、「作成ソフトが用意した方法から一歩も離れず、そのとおりに使いなさい」という傲慢な態度でもあるのです。 では、その対策は？ 注意深く使うしかありません。 |
作成ソフトを上手に使いこなすひとつの方法として、「何もかもソフト任せにしない」というのがあります。そのソフトがどのように動作しようとしているのか先回りして、自分のやりたいことを食い込ませてしまうのです。 そのひとつの方法が、ファイルの作成とネーミング、およびディレクトリの構築です。この方法は、別にホームページ作成ソフトを使う人でなくても、とても役に立ちます。しかも、テクニックの問題ではなく、アイディア勝負をしているので、誰でも簡単に出来ます。 その方法とは・・・ ホームページを作る際に、自分のパソコンの中に、サーバーに構築するのと同じ状態でディレクトリを構成することです。 もう少し詳しく説明しましょう。 とにかくわかりやすいのが第１なので、まず、自分のパソコンのデスクトップに、適当な名前をつけて新しいディレクトリ（フォルダ）を作ります。僕はそのフォルダに「homepage」と名付けています。このとき大切なのは、半角英字で名前をつけることです。 フォルダが用意できたら、ダブルクリックして開いてみましょう。その中にはまだなにも入っていません。ここはこれから、あなたが新しくファイルをアップロードしようとしているサーバーの、あなたのエリアだと考えます。 ここにはファイルを置くことも出来ますし、更に深い階層を作るためにディレクトリを置くことも出来ます。 ここに「index.html」という名前のファイルをおけば、あなたの表紙ページです。さらに、もうひとつ、日記のページとして「diary.html」というファイルを置いたとしましょう。すると、このふたつのファイル相互間は、「相対パス」で移動できます。作成ソフトにおいても、目的のファイルをダブルクリックして指定するのではなく、ファイル名を書きこむという方法でリンクを設定します。 同じディレクトリにあるファイルですから、これをそのままアップロードすれば、もちろんサーバーに送りこまれたふたつのファイル同士でもリンク出来ます。 ディレクトリをさらに作って、「diary」というディレクトリの中に、さらにファイルを置くことも出来ます。２００１年の表紙ページを「2001.html」という名前にし、そこから各月の日記へリンクさせることも出来ます。例えば、１月なら「01.html」２月なら「02.html」などというファイルを配置するとしましょう。その場合のリンク設定は少しだけ複雑です。 既に学んだように、リンクは、 <a href="リンク先ファイル名"> 〜 </a> ※ と、書きます。これは相対パスという方法でしたね。 では、ディレクトリ間を移動する場合はどうでしょうか。 一つしたのディレクトリ、例えば、「index.html」から、「diary」というディレクトリの「2001.html」にリンクする場合は、こうなります。 <a href="diary/2001.html"> 〜 </a> ファイル名だけが入っていたところが、「ディレクトリ名／ファイル名」となるわけです。 逆に、上のディレクトリに戻る場合は、 <a href="../index.html"> 〜 </a> ドットがふたつにスラッシュで、上のディレクトリに戻ることを示します。 たとえ下のディレクトリであっても、「diary」の中の「2001.html」と「01.html」のように同じディレクトリの中にあるファイル同士であれば、上記※の方法でオッケーです。 ついでながら、「diary」と「profile」というふたつのディレクトリがあり、「profile」の中のとあるファイルから、「diary」の中の「2001.html」にリンクをするにはどうすればいいでしょうか。 単に「diary/2001.html」としたのでは、「profile」の更に下の「diary」というディレクトリという意味合いになってしまい、ダメです。いったん上の階層に戻り、それから、「diary」というディレクトリにおりないといけません。ですから、 <a href="../diary/2001.html"> 〜 </a> が、正解です。 ところで、今まで書いてきた「例」では、絶望的なミスをひとつおかしています。それは何かと言うと、ファイル名です。１月の日記を「01.html」としていますが、それはあくまで２００１年の１月です。では、２００２年になったらどうするのでしょう。１月なので「01.html」としてアップロードしてしまえば、先にあった２０００年１月のファイルが上書きされて消えてしまいますし、それ以前に、自分のパソコンでファイルを作るとき、同じディレクトリの中に同じファイル名を複数存在させる事が出来ません。 そこで、こういった先のことも見とおしたファイル名のネーミングや、ディレクトリ構築が必要になるのです。 ファイル名で解決するのなら、２００１年の目次ページを「200100.html」とし、１月を「200101.html」２月を「200102.html」などとするといいでしょう。年と月の間にアンダーバーやハイフンを入れるともっとわかりやすくなります。目次をあえて「200100.html」と、「００」を付加したのかというと、フォルダを開いてアイコンを名前順に整列させたとき、「００」が「０１」よりも先に来てわかりやすいからです。 この他に、ディレクトリ構成で解決する方法もあります。「diary」というディレクトリの中に、さらに年毎のディレクトリを作ればいいのです。「2001」「2002」「2003」とディレクトリが年毎に増えてゆき、その中にはそれぞれ「01.html」というファイルがあるのです。 また、ファイル名は同系列のものなら、番号をつけると便利なのですが、それも注意すべき点があります。 同系列のファイルとして、例えば、ペットのワンちゃんについてのコンテンツがあるとします。日記と言うわけではなく、トピックがあるごとに新しいファイルを増やしていくとしましょう。そこで、作者は最初のページに「dog1.html」と名付けました。次のページは、「dog2.html」です。そして、１０ページ目が「dog10.html」となりました。 ここで問題が発生です。名前順にファイルを整理したとき、最初に来るのは、「dog1.html」ですが、次に来るのが、「dog10.html」となり、「dog2.html」はその後になります。ファイルが２０を越えた場合は、「dog1.html」の次に、「１０」「１１」「１２」と並び、「１９」の次が「２」、そして「２０」となり、２０番台のファイル名が終わった後に、「dog3.html」となります。これは名前順に並べ替えようとしたとき、左側の文字から順にソート対象にするからです。 そこで番号でファイルの整理をする場合は、最初に最大桁数を予想しておかねばなりません。全部で３桁に最終的になるようでしたら、「dog001.html」「dog002.html」〜「dog115.html」「dog116.html」・・・・としていけば、問題無く解決できます。 ホームページ作成ソフトを使う場合は、次の点に注意して下さい。 拡張子が違えば、ファイルも別物として扱われます。ＨＰ作成ソフトは、拡張子を自動的につけてくれます。経験則では「HTM」と大文字でつくことが多かったのですが、僕が使った作成ソフトなんてほんの数例なので、違うソフトでは違うつけ方をするかもしれません。いずれにせよ、「僕はそんな拡張子にしたつもりはない」などと主張しても、それは無駄です。自分で拡張子を入力しなかったら、ソフトが書いてくれたのです。「僕は拡張子をhtml（小文字）にしたいんだ」といういう場合は、自分で拡張子までファイル名入力の際に入力すればいいだけのことです。ジオの場合は、表紙ページの拡張子は必ず「html」です。 また、ファイル名を書かずに保存すれば、「ファイル名を入力するように」促すソフトもあれば、とりあえず仮の名前を勝手に書いてくれるソフトもあります。「user1.html」とかね。で、そのまま作りつづけると、「１」が「２」になり、「３」になり・・・と。意味のあるファイル名を付けとかないと、やがて何がなんだかわから無くなってしまいます。 いずれにしても、ホームページ作成ソフトを使う場合は、ホームページを作るのに本来的には必要無いけれど「便利な」ものを使うんだ、という気持ちで、ソフトそのものの使い方やくせも同時にマスターしていかなくてはなりません。（速攻でＨＰを作るには、それでもｈｔｍｌを直接書くよりも、早くマスター出来るかもしれません） |