月別アーカイブ: 2014年11月

僕が初めて作った2000年のサイトをみてみる

僕が初めて作ったWEBサイトがハードディスクの中でみつかりました。今から15年前です。

ゲーム会社を辞めて暇になった時にインターネットの仕事をしたいと思って作った僕のホームページです。といっても人見知りな僕は転職活動先でもほとんど人に見せることもなく、メモ帳か何かでHTMLファイルを更新して、FTPでアップロードしてました。

これを今サーバーにおいて見られる状態にしようとしたらけっこう大変で、それがWEBサイトの歴史を感じさせてくれたので半ば黒歴史ではありますが見てみたいと思います。

スクリーンショット 2014-11-13 3.35.10ヤングルWEB

拡張子が.shtml だってSSIが使いたかったんだもん

001
まさかのshtml。拡張子変えずにそのままにしてますがちゃんと見えてますでしょうか。shtmlというのはSSIを使うための拡張子です。SSIって今では多分使う人いないと思います。

このようなコメントをbodyタグの中に記述すればその箇所にinclude.htmlの中身を入れたhtmlをレスポンスします。つまりHTML中にCGI的な処理を入れられるということです。

サーバーにあるプログラムを実行できたり、強力なSSIですが背景枠を1つのファイルにして更新が楽になるように使っていました。その後、DreamWerberにテンプレート機能がついたのでそれを使うようになりました。PHPが使えるならそっちがいいですね。

今でもSSIは使えるのかもしれませんがサーバー設定するのも面倒なのでとりあえず直接HTMLに書くように変えました。

DHTMLによるアニメーション 今は無きLAYERタグ

このサイトの特徴は背景の雲の多重スクロールでした。これを実現するため、DHTMLのLAYERタグを使っています。雲は左ぎりぎりまで流れたらまた元の位置に戻ることで無限ループにしているのですが、そういった動きが見えないよう画面全体をiframeで囲っています。

002

LAYERタグはNetscape6から非対応になりました。今ではDIVにz-indexスタイルシート属性をつければ同じことができます。LAYERタグはやめて、jqueryでleftの位置を操作するように変えました。

iframeはSEO観点から時代遅れと言われる時代もありましたが、とっても便利なので今も全体フレーム以外では良く使われていますね。

大文字小文字の区別なし

サーバーにあげてみると、ローカルでは見えていたものがNotFoundになっているものが多くありました。小文字で指定しているファイルが大文字ファイル名になっていたためです。昔はUnixを知らず大文字小文字を区別しないファイルシステム環境にいたので、気にしなかったのでしょうか。HTMLタグもこの頃は大文字でした。それから属性名は小文字、みたいな意味不明な時期があって、現在では全て小文字でタグを書いています。

InternetExplorerとNetscapeで処理を分ける

このブラウザ判定コードがあちこちで使われていました。MicroSoft Internet ExplorerとNetScape Navigatorで挙動を変えていたのです。

当時は文字コードによる文字化けと、IEとNNが2強ブラウザで互換性がないのが最大の悩みでしたね。

15年の時を経て

まだHTMLの勉強すら始めたばかりでいきなりDHTMLやらJavascriptやら使ってインタラクティブなものを作ろうとしている自分に驚いたりするのですが、それが当時の普通だった気もします。すごいサイト、新しい技術が今に至るまで目まぐるしく生まれましたね。少しでも追いつきたくて、ただ自分を発信したくて、やってたこと、当時やりたくて出来なかったこと、変わらず続けていきたいと思ったのでした。