2012年10月第4週号 1位は、レスポンシブなナビゲーションメニューをうまく実現するためのテクニック、気になるネタは、ヤフーがカカオジャパンに資本参加--「カカオトーク」を共同展開

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

レスポンシブなナビゲーションメニューを、うまく実現するためのテクニックを紹介した記事です。

以下の10個のテクニックについて、実際のサイトの例を挙げて解説しています。

Bootstrapのリファレンスやお役立ちサイトなどをまとめています。

日本語のテンプレート配布サイトや初心者向けレクチャー記事もあるので、英語が苦手な人でも参考にできそうです。

レスポンシブWebデザインの、手書きのスケッチをするための用紙を配布しています。

パソコン向けとモバイル向けのスケッチが一枚でできるように工夫されたものなど、複数の用紙が用意されています。。

メニューなどが画面の外に隠れていて、必要なときに表示される「off-canvas」のレイアウトのための用紙もあります。

Facebookページ用の画像制作に必要な、各種要素のサイズをまとめています。

カバー画像、アイコン画像や、タイムラインに表示される画像、Facebook広告など、様々な画像サイズが掲載されています。

動きのあるWebデザインをまとめたギャラリーです。

アニメーション効果のあるスライドショーや、視差スクロールなどを効果的に使ったサイトが紹介されています。

そのほか、最近の記事の中から、気になる記事を紹介します。

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

Solidifyは、画像を元にクリッカブルなプロトタイプを作り、ユーザーテストをするためのサービスです。スマートフォンやタブレット向けのプロトタイプも作れます。

サイトのスケッチやワイヤーフレーム、モックアップなどを画像として取り込み、クリックする場所の決めて、ページ遷移の設定をします。ユーザーテストのときに、どういう操作をしてほしいかをテキストで表示させることもできます。

ユーザーテストの結果を解析できるのがポイントで、ユーザーごとのページ滞在時間やページ遷移を見られるようになっています。ユーザーのマウスの動きを再現させることも可能です。

Basicアカウントで月19ドル、Plusアカウントは月49ドルで、30日間はフリートライアルができます。ユーザーテストに力を入れるプロジェクトには、かなり有用なツールではないでしょうか。

ヤフーがカカオトークをカカオジャパンと共同展開していくそうです。LINEのライバルだけど差を付けられた感のあるサービスといった印象のカカオトークですが、ヤフーユーザーに積極的にPRすれば利用者も増えそうです。あるいは、新たなサービスが生まれるのかもしれません。

最近のヤフーは新体制での「爆速」経営がうまくいってるのか、他社との提携や連携が目立ちます。Yahoo! JAPANトップページで、Facebookの新着情報が見られたり、nanapiの記事が掲載されるようになったそうです。

また、イラストネタで触れているもう一つの話題は、キングジムがマウス兼用のハンディスキャナを発売したというニュースです。

たしかに、新聞などサイズの大きい原稿から必要なところだけをスキャンするのに便利そうです。大きな範囲もスキャンできそうですが、うまくマウスでなぞっていくのが結構大変かもしれません。