その都度更新

昔のマイホームページ > Top

「ホームページアドレスちょうだい!」

 まだパソコンも持ってない頃、ある人から「○○さん、ホームページアドレスちょうだい」って得意満面に言われて「いやっ、私パソコン持ってないから…」って彼に告げると、「なーんや、早くパソコン買いーな」って言う当然の会話になったことがあった。でもね、密かに彼が”ホームページアドレス”と”メールアドレス”を間違ってることには、パソコン持ってない私でも気づいていたわけ。当時はまだダイヤルアップという接続法のナローバンドの時代。さすがにHPを持つほどのマニアは、少なくとも私の周りではいなかったと思う。

 時は過ぎ私もパソコンを所有することとなり、そろそろADSLが都市部の方で始まる頃、私はODNと言うプロバイダーでISDNを契約する。時間課金の従量制から定額制のフレッツISDNに変更したころ、まだインターネットのサーフィン方法もままならない私には、ODNのHPスペースが気になって仕方がなかった。無料で5MBのホームページスペースが利用できるというもの。http://www1.odn.ne.jp/***** という自分だけのアドレスが持てるんですよ。5MBといやあんた、フロッピー3枚分以上もあるじゃないですか。

 この自分だけのアドレスが使いたくてホームページビルダーを買い、細々とマイホームページをはじめたのが、この”PETAGON'S PC”に至るきっかけです。

私なりのHP作成指針

 せっかく公開したホームページ、アクセスがなけりゃ面白くない。でもアクセスしてもらっても面白くなきゃだめ。結局アクセスを稼ぐには、いかに有意義なコンテンツと内容か、頻繁に更新しているか、配色・配置・文章の読みやすさなどを考慮しアクセシビリティに気を使ってるかが重要になります。

 でも見てのとおり、有意義なコンテンツは私には発信出来そうも無く、アクセス向上の為の研究心も消えうせ、いつしかデザインだけに凝りだすようになりました。他には無いデザイン、当然デザインに使用するパーツは自作のみを使用するという暗黙のオキテみたいなものを自分に課しながら現在に至ります。今では読みやすさには気を使ってるつもりなのですが、スタイルシートでフォントサイズを指定している以上、アクセシビリティの観点からは残念ながら外れております。

過去のHPデザイン

 ホームページをはじめた当初は右も左もわからず、目的さえもってなかったものですから今から思うとさぞかし恥かしいページだったんだろうなと。昔のHPでたまたまキャッシュされてたページのキャプチャー画像を並べて当時のうんちくを書いていこうと思います。

2000年 フォレストジャンプという名のHPデビュー

初代HP なんぼさがしても当時のファイルが見つからないのです。たしかこんな感じのトップページだったようなそうでもないような…。だから?(はてな)

 改めてホームページビルダーの”どこでもモード”という機能を使ってそれらしく配置してみたんですけど、思い出せない。でも左フレーム様式で、ビルダーについてたアイコンを使って並べてた記憶があります。

 この”どこでもモード”で作ったページをネットスケープで見ると、配置が微妙にずれていたりして、知り合いに指摘されたことを覚えています。正直次のデザインへ移行したと同時にすべてのデータは削除したと思います。ほんとに恥かしいページだったけど、今となってはもう一度見てみたいものです。

 コンテンツは【パソコン・トイガン・映画・写真】だったと思う。

2000~2003年 いろんな技法が楽しかった頃

2000~2003年 たしかこのデザインが一番息が永かったのかもしれません。上下のフレーム様式で、初めてインラインフレームなるものを取り入れたものでした。フレーム上部のタブ式ボタンは、オンカーソルでボタンがいかにも押されてるかのように見せるスクリプトを使っています。HPB(ホームページビルダー)に標準に付いている機能と、【とほほのWWW入門】などの解説ページから取り入れた機能などを満載して楽しんでました。また、隠しページなんか作ったりもしていたっけ…。

 それにテーブルによるデザインに凝りだしたのもこの頃だったと思います。テーブルとは表組みのことで、数行数列の表組みの中に写真や画像・テキストを盛り込んで、バックグランドカラーを各セルに指定したりすると、意外に思い通りのものが出来てしまうんです。

 コンテンツは【パソコン・トイガン・コラム】でした。

”LCARS MANIA”を勉強

MAYBE LCARS テーブルにこりだしたのは【LCARSMANIA.COM】のデザイン論を読んでからでした。当然デザインだけではなく、アクセシビリティの観点からもかなり影響を受けたサイトでした。自分にはそんなすばらしいページなんて無理なのはわかってたけど、せっかく学んだテーブルでLCARS(エルカース)がどうしても作ってみたくて、ホームとは別にジオシティーズにアップしてたHPがこの【MAYBE LCARS】でした。

 内容は単純にスタートレックの各シリーズを紹介しただけのものでした。でもあの大好きなスタートレックに出てくるコンピュータ画面が自分の手でそれらしく作れることが嬉しくて、まあ自己満足だけのサイトでもありましたね。

2003~2004年 サイトネームを”PETAGON”に改名

2003~2004年 このデザインに変えたのは、ウェブサイトをODNから現在のイオに変更したときです。サイト名を変えて心機一転のつもりで作りました。でも相変わらずJAVAスクリプトやフレーム構成は盛り込んでいました。一見、一枚ものに見せかけて実は上中下に分けたフレーム表示です。最近ではフレーム表示されてるサイトも少なくなってきたみたいですけど、サイト管理は楽な技法だと思います。

 コンテンツは【パソコン・トイガン・コラム】パソコン日記の中で光ディスクメディアの検証に関する内容が増えた時期でした。DVD-Rの焼き質が納得できず、CD-R実験室の掲示板でHPのリンクとともに質問をしたとたん誰かにその内容を2chにコピペされ、集中的にアクセス数が上がったのにはびっくりしましたね。親切な方がうちの掲示板にアドバイスを書き込んでくれたこともありました。

2004年 自宅サーバー用ウェブサイト

自宅サーバー用HP このサイトは今も自宅サーバーで稼働中です。自宅サーバーの目的はほとんど”FTPサーバー”を利用することだったので”HTTPサーバー”は二の次でした。しかし無料のDDNSを使わせてもらってる以上、HTTPを無理矢理でも公開しなければならず、とりあえず作ったのがこのサイトです。ソースはかなり古いんですが、このデザインは今でもお気に入りです。だけどあまりアドレスを知られたくないためおとなしく公開中です。検索ロボット対策(ロボットに無視させるソース)も仕掛けてるためかどうか、グーグルボットもたまに来るけど、未だにこのサイトの名前では検索にかかることはありません。

 コンテンツは【初心者向けHTML作成の解説】初歩的な内容からCSSのさわりまでです。今後の更新はおそらく無期限停止かも、です。

2004~2006年 サイトネームを”PETAGON'S PC”に改名

2004~2006年 このサイトは今現在(2008年)に至るまでの基盤となったサイトですね。リンクページを無くしトップページへリンクを配置し、このとき初めて今のブログの基盤となる【プチコラム】を公開しました。トップページ内でのコラムなので行数に限りがあり、文章をまとめるのに苦労しました。この頃からCSS(カスケーディング・スタイル・シート)を導入し始めました。雄一アップデートの窓がインラインフレームではなく、CSSによるものでした。でも基本的にデザインの基盤はまだテーブルに頼ってます。ソースを見ると激しいタグの嵐です。

 コンテンツはプチコラムを含め【パソコン・トイガン・コラム】でした。途中、サイトの肥満化の解消とコンテンツの方向性を軌道修正するため、トイガンのページを削除しました。その後パソコンのコンテンツの中で光ディスクについての内容を削除。

削除したコンテンツ

ASG 削除したとはいえリンクだけ外してしばらくはサイト上に残していました。意外とこのトイガンのページへ検索サイトからの訪問者が多かったためです。名前を”PETAGON'S ASG”として asg ディレクトリに残したのです。

 実生活においてもこのトイガン達の行き場に困ってます。サバゲーをすることも無くなった今となっては家のスペースを取るだけのものなんですが、かといって処分するなど考えられません。困ったものです。

 

光ディスクのページ こちらは光ディスク検証のページ。CD-R の焼き質から始まり DVD±R DL まで、いろんなメディアを焼いてはエラー測定をしていました。検証にはまりだしたのは、とある動画データが数ヶ月で再生出来なくなったことからでした。 ドライブが悪いのかメディアが糞なのか(失礼)それともシステムがいけてないのか、悩んだ時期でしたね。このコンテンツも次のサイトデザイン更新時まで drive というディレクトリに置いてました。

 もう今は検証なんてすることもなくなったけど、大事なデータを書き込んだときには一応エラー測定しております。どのメディアが良いか悪いかはCD-R実験室を見りゃわかることですし(笑)。

2006~2008年 メタボなHPを減量

2006~2008年 このデザインはトップページにリンクしていたサイト【Link Fly】からいただいたテンプレートをPETAGON風にアレンジして作りました。テーブルを使わず、すべてCSSで各パーツを配置するので、テンプレートとはいっても納得するまでそうとう悩んだデザインです。とくに padding (要素内の間隔)や margin(要素間の間隔) 、 width(要素の幅) など何度も何度もやり直して完成させました。はたして完成といえるかどうか疑問でしたが、きりが無いので適当なところで無理やり納得しましたね。この頃、”関西ドットコムblog(後のeoblog)”でプチコラムという名前でブログをはじめていたので、トップページのプチコラムはなくしました。

 コンテンツは前回から引き続き【パソコン・コラム】だけでしたが、あえてあまり残しても意味の無い内容の話はスッパリ消してしまいました。このデザイン以降サイト更新は滞ってしまいました。更新したくないわけではないのですが、ブログの更新が楽すぎてついつい…

((((((^_^;)

2008~2009年 ブログとデザインを統一したノートタイプ

2008~2009年 スタイルシートと画像を駆使して、なんとかノート風に出来ないかと試してみたデザインです。なかなか思い通りにいがず、一時は諦めようかとも思いました。

 何が困難だったかというと、ノートの特徴でもある横線の中に文字をうまく配置することです。段落を改行するとずれたり、見出しを入れるとずれたり、画像を入れるとハチャメチャになったりと。

 あらゆることを想定して文字のずれを最小限に留めてつくりました。さすがにブログのバックグラウンドまでは難しかったので諦めましたが、見た目には統一できたかなと自己満足してましたけど…。

 なんせ飽き性なもので1年ほどでこのデザインも辞めましたが、苦労した分意外に気にいってるので自宅サーバーのWEB上に使ってます。

今後もデザインを変更するたび、このページは追記する予定です。

で…、アドレスを聞いてきた彼に教えたかどうか?
もちろん教えましたよ。
メールアドレス を … :*:・( ̄∀ ̄)・:*:

 

リンク