2010年6月第1週号　1位は、Appleが公開したHTML5によるSafariのテクノロジーデモ、気になるネタは、iPad登場で「MAGASTORE」に異変

ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2010年5月31日～6月6日の間に見つけた記事のベスト5です。

HTML5とCSS3、JavaScriptの組み合わせで、リッチでインタラクティブなサイトが作れるというデモを集めたページです。Appleがデベロッパー向けサイトで公開していて、現状デモはSafariでしか動作しないようです。

将来はHTML5をベースに、“⁠Flashなしで⁠”こういう動作が実現できるんだという、未来の技術のような印象を持つ人も多いでしょう。しかし、iPadやiPhoneにターゲットを絞れば、今すぐにでもこういったページが作れるんだという受け止め方もできます。

ムービー再生中に大きさを変えたり、斜めに回転したりマスクをかけたりするデモや、タイポグラフィを自由にいじれるツール、見せ方を変えられる写真ギャラリー、QuickTime VRを思い起こさせるパノラマや物体を回転させるデモなど、14種類のデモが公開されています。

どのデモもすぐに起動し、ストレスなく見ることができました（環境によるでしょうが⁠）⁠。ほとんどのデモが、iPhone/iPad上でも見られるようです。

それぞれのデモには、関連する技術の解説ページへのリンクが用意されています。

このデモページは「Safari Technology Demos」というタイトルですが、「⁠HTML5 and web standards」という見出しが踊る、AppleによるHTML5特集サイトで公開されているため、Safariでしか見られないことへの批判や皮肉も多いようです。

異なるバージョン／OSのブラウザや、種類の違うブラウザでの表示チェックのためのツール／サービスを比較した記事です。

Adobe BrowserLabやMicrosoft Expression Web SuperPreviewなど、8種類のツールやWebサービスが解説されています。

Fireworks CS4のTipsをまとめた記事です。Fireworksの記事はPhotoshopやIllustratorに比べ少ないですし、特に日本ではあまり見かけないので貴重な記事と言えるでしょう。

このブログでは、その後もFireworks関連の記事が続けて公開されています。CS5版の記事も期待したいですね。

jQueryとCSSでアニメーションを作るチュートリアルです。

パーツごとにレイヤーに分けて動かす、いわゆるスプライトアニメーションを、FlashではなくJavaScriptとCSSで実現したものですね。

SpritelyというjQuery のプラグインを利用しています。手間はかかりそうですが、このプラグインを使えば簡単な設定でアニメーションが作れそうです。

古めかしいテイストのデザインを使ったサイトのショーケースです。

そのほか先週の記事から、気になるニュース記事を2つ紹介します。

先週の気になるWebサービス

CSS3で追加されたborder-imageプロパティを簡単に設定できるジェネレーターです。

border-imageを使うと、枠になる画像を1つ用意すれば、4つの角と4つの辺、背景画像の9つに分割してボーダー画像として扱うことができます。4つの辺は単純に繰り返すだけでなく、伸縮させる設定もあります。

このジェネレーターを使えば、画像を分割する位置の指定や、繰り返しの方法、ボーダーの太さを簡単に設定することができます。記述方法のリファレンスとしてこのページを覚えておいてもいいでしょう。

電通とヤッパによる電子雑誌配信サービス「MAGASTORE」で、iPadからの購入が売り上げの8割を占める状態になったそうです。

iPadを発売早々に買った人は、いろんな電子書籍を試してみたいという研究熱心な人が多いと思います。新しいゲーム機が発売になったときのゲームソフトのように、先行者利益が得られている状態なんでしょう。こういう電子書籍があるんだと、人に見せるために買っている人もいそうです。

iBooks、Kindle for iPad、MAGASTOREなど複数の「本屋」からいろんな本を試しに買っている人が結構いるんじゃないでしょうか。ビューンや雑誌の独自アプリなどもありますし、散財している人が多そうです。

iPadをこれから買う人は、ついつい買ってしまうアプリや電子書籍の金額も予算に入れておいた方がいいのかもしれません。わたしはコストコで安く売っているiTunesカードをたくさん購入しました。

iTunesカードはコンビニなどで定期的にキャンペーンで割引販売しているそうです（サークルKサンクスで現在キャンペーン中らしい⁠）⁠。そういうときにまとめ買いするのもいいですね。