Gallery
Webデザイン [自分サイト]
青山は1998年ごろからWebサイト作りにハマり、それから今まで「そんなにいらないだろう」という位たくさんの自分専用サイトを作ってきました。全部載せるのはムリなので、その中でも挑戦(?)と思われる主なサイトをいくつかピックアップしてご紹介します。
2008~ 「Omnipot」
リニューアル時にソースコードを全てXHTMLに取替え、汎用性を高めました。 CSSデザイン切替機能や、画像ビューアにおけるAjaxの導入、掲示板のPHP化など、前からやりたいと思っていた事を 全部試してみた感じです。IE6,IE7, Firefox, Safariなどのクロスブラウザ対策も意識して設計しました。 また、遊びでCSSによるスタイル着せ替え機能なども。
現行:http://www.omnipot.jp/
2006~ 「Omnipot」
仕事で本格的にWeb制作をやるようになって、CSSデザインというものをやっと導入するように(遅いよ)。
TABLEレイアウトとはこれを限りに決別し、ビジュアル面は全てCSSで記述するという大胆なリニューアルを行いました。
技の限りを尽くしてリキッドデザイン(横幅可変)を実現し、初めてにしては上出来だったのですが、 やはり後になってから見ると強引な記述が目につきます。 しかも実質的にHTML4.0で、バージョンなんかそっちのけの大胆さがナイス。
2005~ 「Philharmonia」
画廊サイトShortie's Galleryを全面的に作り直したものです。思いっきりTABLEレイアウトのままですが 「背景に幾何学的な模様を敷き詰め、なおかつ画面全体に馴染ませる」というのがひとつのテーマでした。
トップのイラストの透明感を出すため、Photoshopで何回も試行錯誤したのが楽しかったです。マイナーチェンジも2回ほどやりました。 現行サイトです。
現行:http://www.omnipot.jp/gallery/
2004~ 「Omnipot」
バツイチ記念でShortie's Sitesを大改修!この時初めて本格的にTABLEレイアウトを用いたデザインに。 それまで敬遠していたスタイルシートも少し取り入れました。
メニューは重複が多く機能的には無駄が多かったものの、写真がランダムに入れ替わるなどの造りは悪くなかったかな、と思います。 2年くらいの間に5回くらいマイナーチェンジを施しました。
ただ、コンテンツ内部は依然として3重フレーム構造だったため、やはり思想的にはちょっと古いかも。
2002~ 「Shortie's Sites」
1年以上アフリカ旅行に出る直前だったので(当時は結婚していた)、バイリンガル表記のサイトがないとまずいだろう、 という事で急遽作ったものです。文字化け問題を解決するため、文言は全て画像だったりします。
デザインもへったくれもないページですが、これが後にOmnipot(このサイト)の原型となりました。 ひろいもののjavascriptでマウスカーソルの後をバイクが付いてくる、という困った造りではあったのですが、 わずか3ページなのが救いだったというか。
2001~ 「Shortie's Gallery」
この頃CGIにハマるあまり、画廊のトップページをCGIで動的に生成するという暴挙に出ました。 数種類の画面パターンがランダムに表示される仕組みです。
「何もここまでしなくても。。。」と今でこそ思えますが、当時はPerlプログラミングも結構楽しくて、 やっぱり徹夜して作ってた記憶があります。なにしろ CGIにソース吐かせてるので、全然SEO対策にならない間抜けさがミソ。
良い想い出です。笑
2000~ 「Shortie's Gallery」
バイクだけでなくイラストを展示する画廊も作ろう!と勢いで作ったのがShortie's Gallery。 いちおう画廊サイトなのでビジュアル重視とし、index.htmlはあくまで表紙、コンテンツとは完全に分離しました。
タイトルのメタリックな画像、Painterのフィルタで作成。 また、ナローバンド時代としては無謀にも、70KBもある青空の画像を背景に使うなど、かなり罪悪感を感じる造りでした。 (個人的には気に入っていたのですが)
1999~ 「Shortie's Motorcycling」
はじめてフレームを用い、メニューとコンテンツを分けました。 当時の自分としてはかなり画期的なレイアウトで、興奮しながら徹夜して作ったのを覚えています。笑
ここで初めて、スキャナで手描きイラストを取り込む、というビジュアル面での技術革新もありました。
頑張った甲斐あって、その後は殆ど変更を加えていません。このデザインは今でもそのまま下記URLで使ってます。
現行:http://www.geocities.jp/jpnaoko/
1998~ 「ちいさめ」
これが1998年に初めて公開したバイク関係のサイトで、後のShortie's Motorcyclingの原型です。 GeocitiesのHTMLエディタで、慣れないHTMLを一生懸命書いていました。
「ちいさめ」という文字はWordで作成、バイクの画像はマウスでちくちく描画。 それ以外に画像は一切ナシ。
この頃はまだウェブデザインとかレイアウトという概念はなく、ひたすら16進数で色を調合するのが せめてものオシャレだったのです。
2008~ 「Omnipot」リニューアル時にソースコードを全てXHTMLに取替え、汎用性を高めました。 CSSデザイン切替機能や、画像ビューアにおけるAjaxの導入、掲示板のPHP化など、前からやりたいと思っていた事を 全部試してみた感じです。IE6,IE7, Firefox, Safariなどのクロスブラウザ対策も意識して設計しました。 また、遊びでCSSによるスタイル着せ替え機能なども。
現行:http://www.omnipot.jp/
2006~ 「Omnipot」仕事で本格的にWeb制作をやるようになって、CSSデザインというものをやっと導入するように(遅いよ)。
TABLEレイアウトとはこれを限りに決別し、ビジュアル面は全てCSSで記述するという大胆なリニューアルを行いました。
技の限りを尽くしてリキッドデザイン(横幅可変)を実現し、初めてにしては上出来だったのですが、 やはり後になってから見ると強引な記述が目につきます。 しかも実質的にHTML4.0で、バージョンなんかそっちのけの大胆さがナイス。
2005~ 「Philharmonia」画廊サイトShortie's Galleryを全面的に作り直したものです。思いっきりTABLEレイアウトのままですが 「背景に幾何学的な模様を敷き詰め、なおかつ画面全体に馴染ませる」というのがひとつのテーマでした。
トップのイラストの透明感を出すため、Photoshopで何回も試行錯誤したのが楽しかったです。マイナーチェンジも2回ほどやりました。 現行サイトです。
現行:http://www.omnipot.jp/gallery/
2004~ 「Omnipot」バツイチ記念でShortie's Sitesを大改修!この時初めて本格的にTABLEレイアウトを用いたデザインに。 それまで敬遠していたスタイルシートも少し取り入れました。
メニューは重複が多く機能的には無駄が多かったものの、写真がランダムに入れ替わるなどの造りは悪くなかったかな、と思います。 2年くらいの間に5回くらいマイナーチェンジを施しました。
ただ、コンテンツ内部は依然として3重フレーム構造だったため、やはり思想的にはちょっと古いかも。
2002~ 「Shortie's Sites」1年以上アフリカ旅行に出る直前だったので(当時は結婚していた)、バイリンガル表記のサイトがないとまずいだろう、 という事で急遽作ったものです。文字化け問題を解決するため、文言は全て画像だったりします。
デザインもへったくれもないページですが、これが後にOmnipot(このサイト)の原型となりました。 ひろいもののjavascriptでマウスカーソルの後をバイクが付いてくる、という困った造りではあったのですが、 わずか3ページなのが救いだったというか。
2001~ 「Shortie's Gallery」この頃CGIにハマるあまり、画廊のトップページをCGIで動的に生成するという暴挙に出ました。 数種類の画面パターンがランダムに表示される仕組みです。
「何もここまでしなくても。。。」と今でこそ思えますが、当時はPerlプログラミングも結構楽しくて、 やっぱり徹夜して作ってた記憶があります。なにしろ CGIにソース吐かせてるので、全然SEO対策にならない間抜けさがミソ。
良い想い出です。笑
2000~ 「Shortie's Gallery」バイクだけでなくイラストを展示する画廊も作ろう!と勢いで作ったのがShortie's Gallery。 いちおう画廊サイトなのでビジュアル重視とし、index.htmlはあくまで表紙、コンテンツとは完全に分離しました。
タイトルのメタリックな画像、Painterのフィルタで作成。 また、ナローバンド時代としては無謀にも、70KBもある青空の画像を背景に使うなど、かなり罪悪感を感じる造りでした。 (個人的には気に入っていたのですが)
1999~ 「Shortie's Motorcycling」はじめてフレームを用い、メニューとコンテンツを分けました。 当時の自分としてはかなり画期的なレイアウトで、興奮しながら徹夜して作ったのを覚えています。笑
ここで初めて、スキャナで手描きイラストを取り込む、というビジュアル面での技術革新もありました。
頑張った甲斐あって、その後は殆ど変更を加えていません。このデザインは今でもそのまま下記URLで使ってます。
現行:http://www.geocities.jp/jpnaoko/
1998~ 「ちいさめ」これが1998年に初めて公開したバイク関係のサイトで、後のShortie's Motorcyclingの原型です。 GeocitiesのHTMLエディタで、慣れないHTMLを一生懸命書いていました。
「ちいさめ」という文字はWordで作成、バイクの画像はマウスでちくちく描画。 それ以外に画像は一切ナシ。
この頃はまだウェブデザインとかレイアウトという概念はなく、ひたすら16進数で色を調合するのが せめてものオシャレだったのです。
