2012年3月第2週号 1位は、これからの未来を見据えたWeb制作について、気になるネタは、アドビの新ツール「Shadow」は、モバイル用Webアプリ開発者必須のツール

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

これからの未来を見据えたWeb制作についての、スライドとセミナー動画を公開しています。

以下のようなことが説明されています。

それほど目新しいことが述べられているわけではありませんが、これからのWeb制作に必要な考え方が、うまくまとめられていると感じました。

ボタンデザインにおける原則やルールについて解説しています。

プレゼンテーションなどに使えるスライドを、HTML5/CSS3で作成するためのフレームワークを6種類紹介しています。

「html5 Slides」はGoogleが提供するフレームワークで、結構有名なものです。

「Impress.js」は、拡大／縮小や回転を使った、動きにインパクトのあるスライドを作れます。スライドのページが切り替わるときに立体的な動きをする「Reveal.js」も面白いですね。

CSS3のジェネレーターを各種紹介しています。

CSS3の新機能を網羅したものもあれば、グラデーション／シャドウ／角丸など特定の効果に特化したものもあります。

クリーンでミニマルなWebサイトのギャラリーです。

アイコンやイラストを中心に構成したものや、大きな写真を効果的に使ったものなど、シンプルながら印象に残るサイトが豊富に紹介されています。

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

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

今回は、レスポンシブWebデザインの表示確認用Webサービスを紹介している記事を取り上げます。

この記事のメインの話題としては、表示確認のURLを生成できるサービスを2つ取り上げています。ほかにも、以前取り上げたツールとして5個のリンクが紹介されているので、あわせて7つのサービスが紹介されていることになりますね。

「Responsinator」は、複数デバイスの表示チェック結果が、まとめて1ページで見られるのが便利そうです。各デバイスを模したそれぞれの画面の中は、ちゃんとスクロールして表示を確認できます。

アドビシステムズのAdobe Labsで「Adobe Shadow」というツールが公開されました。iOS／Androidデバイスでの動作／表示チェックを手助けするものです。

同じネットワーク上のパソコンとiOS／Android端末とを接続することができ、パソコンのブラウザで表示しているページを各デバイスにも表示することができます。各端末にパソコン側から自動的にURLが送られ、それぞれの端末でURLを入力したりリンクをクリックする手間が省けるわけです。

また、Chrome上でデベロッパーツールのようなウィンドウを開き、ページのソースを変更して各デバイスに反映させることも可能です。

エミュレーターも便利ですが、やはり実機でのテストが必要なケースも多いわけで、これは目の付け所が良いツールだと思いました。

iOS／Androidには無料の専用アプリが提供されています。パソコン側はMac／Windows用のShadowアプリケーションと、Chromeの拡張機能が必要です。