Web Creative Category Archive | SCREAMO CREATIVE

Safari 4 betaがアップルより公開され、約2週間が経過した。恐らくSnow Leopardのリリースと同時に正式版を公開するはずの次世代Safariだが、様々な機能追加・強化を行われており、なかなかバランスのとれたモダンなブラウザに仕上がっている。公開日よりプライベートMacに導入して試用していた感想を伝えよう。

疑似クラスを多用し、シンプルなCSSマークアップを行いたい。そう思っている人は少なくないはず。しかし、ブラウザシェアの大半を占めているInternet Explorer6、7でサポートしている疑似クラスが少ないため、first-childやlast-childなどを利用することが出来ない。そこで登場するのが「offspringjs」というJavaScript。これを利用することにより、IE6やIE7などの非モダンブラウザでも、自動的に疑似クラス風（？）のクラス付けを行い、マークアップの手助けをしてくれる。

とあるサイトでクールなUIを実現するために、iTunesのCoverFlow風のイメージギャラリーを表示させることにした。様々なJavaScriptを試してみたところ、どれも表示が微妙だったり、実行速度が遅かったりと、実用に耐えられるものがない。しかし、一つだけまともなスクリプトを発見した。

検索エンジンでキーワード検索して、サイトを訪れようとした際に、「404 Error」や「ページが見つかりません」等のメッセージが出て、目当てのページに移動できなかったことはないだろうか。大抵のユーザーは、そんなページが表示されたら、とっととおさらばして、別の情報を求めてサイトを出て行ってしまう事だろう。もし自分のサイトをリニューアルして、ページを移動、もしくは削除した場合に、上記と同様のケースは十分あり得るだろう。それを防ぐためにはエラーページをカスタマイズして、出来るだけユーザーを引き留める必要がある。もしMovable Typeでサイトを構築しているのなら、「ウェブページ」を活用して、エラーページを作ってみよう。

以前に書いた「jQuery対応のLightboxライクなメディアビューア - Shadowbox.js」に、「IE6でうまく表示しない」とコメントを頂いた。そういえば、IE6でまともに検証していなかったな･･･と思い、VMWareを起動させて確認してみると、オーバーレイ担当のDivが変な位置で表示される。ページを開きスクロールしない状態では問題ないが、スクロールしてからエフェクトがかかるリンクをクリックすると、明らかにずれて表示する･･･。これはなんとかしなければ！と思い、四苦八苦しながらなんとか修正できたので、その方法をお伝えしよう。多少邪道だけれども･･･。