ヴォルフロッシュ 13周年
このサイトももう13周年らしいです。
13周年とは言ってますが、前身サイトから数えてなので、"ヴォルフロッシュ"という名前とドメインになってからは丸10周年になります。
まぁ別にだからというわけでもないのですが、最近Macのデータを整理してたら過去のサイトのスクリーンショットが出てきたので、面白半分に晒してみたいと思います。ヴォルフロの10年間の系譜です。前身サイトは今回無視します（スクリーンショットがないから。
さて、作者の私以外にはどうでも良い話でしょうが、当サイトはヴォルフロにしてからサイトにバージョンを付けており、デザイン変更などの折りにそのナンバリングをすすめてまいりました。現在は昨年の6月に行ったリニューアル以来v4となっています。つまりこれまでに3バージョン存在することになります。それらを1バージョンずつ当時のTOPページのスクリーンショットと共に振り返ってみましょう、というが本投稿になります。
v1 (2002-2003)
まずは、にしてこれが今回の一番の画像なのですが、これが2002年9月、最初のヴォルフロッシュのトップページです。10年前！
な、なつかしい...。なにが懐かしいってこれがOS9で撮ったスクリーンショットであることです。それにしてはボタンとかツールバーが若干Aqua風ですが、これはOS9時に新しいOSXに憧れてそういうテーマを使っていたからです。証拠に、フォントが、ビットマップ、アンチエイリアスなし。Osakaですね。ビットマップフォントはやっぱOsakaだよね。ブラウザはInternet Explorerですねこれ。あの頃はわりと革新的なブラウザだったんだよ。Windows版IEより良いなんて言われててね。XHTMLの解釈力も当時抜群で。
と、このままOS9の思い出話に突入してしまいそうなので、この頃のサイトのことを。まだこの頃はフレーム組んでます。上下のメニューやらタイトルやらは固定で、中身だけが遷移していくスタイルでした。当時はそういうサイトが多かった。
当時のDTDはXHTML 1.0 Frameset+Transitional。Transitionalだったのはフレーム用のtarget="_blank"を使うためだけだったので、この時点で立派でStricterでした。このv1でヴォルフロに名前変えて心機一転したときに本格的にStrict HTML+CSSなコーディングを導入したのです。ねこめしにっきや闇黒日記が賑やかし頃で、StrictかつCSSでデザインされたサイトは物好きが実験的に手を出してるだけでプロが作る商業サイトはほぼ100%テーブルレイアウトだった時代です。ただ、私自身はそういうコーディングをしていましたが、出入りはしていなかったのでいわゆる "CSS界隈" と呼ばれる人間ではありませんでした。
とにかくビットマップOsakaが今見るといい味出してて、こういうビットマップのカリカリしたフォントには、ドット打ちしたカリカリした枠が似合うんだな。
フレーム切ってるんだけど、フレーム分けの線は左右ちょっと空けて空間的に繋がりを持たせてる、とか当時それなりに凝ってた記憶がある。
デザイン的にはこの頃からこのアイゾメヤドクガエルさん1色。配色は白ベースに黒とターコイズブルー、サイト全体を角の丸い枠で囲む、など基本的にはこの頃のデザインコードを現在まで使っているので、ずいぶん長生きなデザインだなぁと思います。強いて言うならサイトのロゴは1度変えてます。
あーそうそう、あとこの頃はkanaiというハンドルネームを使っておりました。
v2 (2003-2006)
ところがそんなフレームサイトもやはりすぐに嫌気がさし、せっかくどどんと公開したv1から1年で早速リニューアルをします。まー時間もあったんだな。
当時スクリーンショットを撮っていなかったのでこれは後から撮ったヤツですが、v2中はずっとこのデザインでした。
このリニューアル時は私は既にOS Xに移行してます。OS Xになってからの心境の変化もあったのかもしれない。メニューのバーとかちょっとAquaっぽいもんな。今見るとダサいけど。
DTDは晴れてXHTML 1.0 Strictになります。このv2までは全部HTMLべた書きしてました。
リキッドレイアウトです。ヴォルフロはv1から現在に至るまで一環してリキッドレイアウトです、が、この当時ページ全体をぐるりと枠で囲った上でCSSでリキッドレイアウトとかなかったんだよ。最先端だよ。当時のCSSでコーディングされたサイトというのは蘊蓄ばかりでロクな見た目のがなく、だったら私がコーディングが完璧な上で洒落乙なのを作ってやる、と気負っていたのです。
v3 (2006-2011)
そしてv3。v2の3年後です。今とデザインがかなり近い。今よりはまだ配置がぬるいですが。背景を何となく3色に割ってるのとかこの頃からですね。
v3からPHPを使いだして、ヘッダやフッタの共通項をPHPで自動生成させることを覚える。そしてこの2006年のv3リニューアルから数ヶ月遅れて2006年年末から、現在まで続くこの謎の自作ブログがPHPで組まれます。
見た目的にはあんま書くことないねー。ベクター狂いになったのもこの頃からです。
v4 (2011-)
で、現在に至る、と。
まぁ別に今のスクリーンショットは載せることもないのですが、また将来過去を振り返ったとき用に。
技術的にはHTML5+CSS3になって、プログラム系はPHP5のオブジェクト指向、jQueryだのSNS連携だのAjaxのガッツリ導入がこのv4からになります。とにかくHTML5とCSS3の本格到来でコーディングが楽になり、気軽に色々手の込んだことができるようになりました。
コーディング的に以前よりはそんなに革新的じゃないんだよね。CSSもStrictも広まっちゃったしな。「誰もやってないことをやるぜ」という気合いがあまり見られない。いやでもサイトのパーツがほとんどSVGだったりRetina対応だったり、そういうのはまだそこそこ。
むしろ独自CMS+ブログというガラパゴス化が着実に進み、どこ向いてるんだかわかんないサイトになってます。
総括
なんだか完全に自分しか楽しくないまとめですが、いやでも過去のを晒すのはそれなりに恥ずかしい。
初期からこのサイトを知ってる方は、もしかしたら過去のスクリーンショットをなつかしいと思って頂けるかも。逆に最近このサイトを知った方は、「10年前から変わってねぇじゃんwww」だろうな。
いつもは「今日で○周年らしいです。どーもどーも。」くらいであんま触れてないのですが、今年はガッツリ振り返ってみました。というかこうやって振り返ったのは初です。
そしてこのサイトは14年目に突入します。