BBX
 

いまさらですがcssで描かれた「澪」のレベルに驚愕しました。

仕事をサボりつつ、あちこちをwebブラウジングしていた際に見つけました。
最初はこの絵が何を意味するのか、理解出来ませんでした。
mio1

「百聞は一見にしかず」と言う事で、下記のリンクをご覧下さい。

けいおん!の秋山澪ちゃんです。

どうです?多分、皆さんもただの「絵」にしか見えませんよね。
「こいつ、何を言ってるんだ?あたま大丈夫か?30秒で弁当買ってこいよ!」そんな感じですよね。
それぐらいクオリティーが高い作品です。

タネ明かしをしますと、この「けいおん!の秋山澪ちゃん」は
html+CSSのコードのみで描かれた作品という事です。

ホームページを作成した事がある方は、多少理解できるかと思いますが。
一切の画像を使用せずに、html+CSSのみでここまで作り上げるとは・・・
ハッキリ言って神レベルを通り越して、き○がいレベル(いい意味で)です。

仕組みが理解出来ても、挑戦しようとはとても思えませんww
しかも、目がウルッテるし、髪もなびいてるとか、
どれだけめんどくさい事か、頭が下がる思いです。
ちなみにこのページのソースを見てみると、当然ですがcssだらけです。
その数もたしかに多いのですが、逆にこの数で作成できるの?ってことに驚愕です。

さて、この作品がhtmlという事は当然ブラウザによって描画が変わってしまうわけですが、
webデザイナーなら当然、気になる所ではあります。

私も気になり確認したところ、デフォルトブラウザでもある「Firefox」だと、
「Firefox9、Firefox10」ではきれいに表示されました。
ただ、「Firefox10」だと目のうるるの動きが変です。

「Chrome10」と「Chrome16」では、まったくの問題なく表示されます、完璧です。

最後はwebデザイナー泣かせでもある「Internet Explorer」で確認してみます。
結果はやはりというか、期待を裏切らないですね「IE7」「IE8」とも「澪」が崩れまくりですww
でも、ある意味これがただの「絵」ではない証拠になりますね。
IE様にはじめて感謝した瞬間ですw

mio2
この崩れ具合をcssハックとかで修正するかと思うと・・・気が狂いそうだぜ!

上の様に崩れてしまう情弱な「IE」ユーザーの皆様はさっさと他のブラウザに移行してください・・・
と言いたいところですが、安心してください。
私が確認したところ「IE9」ではなんとか表示されていますので、迅速にバージョンUPをお勧めしますよ。