2009年5月第1週号　1位は、jQuery＆Ajaxのレッスンベスト9／気になるネタは、マクドナルドのサイト、ドロンボー一味に乗っ取られる

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

jQuery＆Ajaxのレッスンベスト9ということですが、Twitterで使われているインターフェイスを実現することを意識した内容となっています。

この手のもので寄せ集めのリンク集は多いですが、このページに載っているリストは全てこの「9lessons」オリジナルの記事です。サイトタイトルから全部の記事が9つのレッスンを紹介してるのかと思いましたが、そういうわけではないようですね。

Twitterを使っている人にはおなじみの、入力したテキストがすぐにタイムラインに追加されるアクションや、「⁠more」ボタンで次の何件かが表示される動きなどを実現するチュートリアルが紹介されています。

ただのビジュアル上の変化だけでなく、ページ遷移なしにコンテンツを読み込む作業も含めての内容となっています。PHPやMySQLを使っているので、実装にはそれらの知識も必要となるでしょう。

ブログ記事（Blog Post）のフッターデザインのショーケースです。

ブログのページ全体のフッターではなく、ブログ記事のフッターというのがポイントで、記事とコメントエリアとの間に入れる要素についての考察とサンプル集になっています。

ブログ記事が終わった後の読者への道しるべということで、ソーシャルブックマークやソーシャルニュースへの投稿、他の記事への誘導を入れるのに適した場所とのことです。

いろんなブログ記事フッターを調査した結果としては、以下の項目がよく入れられているそうです。

このリストは、自分のブログ記事フッターに入れる項目のチェックリストとしても使えそうですね。

JavaScriptライブラリを使って、コンテンツの表示／非表示を切り替える方法を10種類紹介しています。

いわゆるアコーディオンのような画面の領域を節約したいというものだけでなく、暗く表示されている領域がロールオーバーで明るくなるものや、スクロールして画面に表示されてから画像を読み込ませる遅延ロードを実現するものも紹介されています。

ユーザーがどこをクリックしたか、どこまでスクロールしたか、などのユーザー動向を解析できるツールを多数紹介しています。クリックした場所や頻度を温度分布図のように表示する、ヒートマップを作成するのが定番のようです。

無料のもの、制限付きで無料のものも結構あります。ただし、無料のものは海外製のものが多く、無料かつ日本語対応のものはClickHeatというツールだけのようです。

ポートフォリオサイトのデザインショーケースです。クリエイターの作品集サイトは自由なデザインが試せる場所なので、実験的なものやオリジナリティの高いサイトが多いですね。

複数の作品を見せるのに、スライダーやLightbox風効果を使ったものが目立ちます。FlashよりもAjaxを使うのが主流のようですね。

以上、メルマガ「デイリーWebテク」で先週紹介した記事から独断と偏見で選んだベスト5でした。

そのほか先週の記事から、便利そうなWebサービスを紹介します。

複数RSSまとめ＆タブ化ジェネレーター
複数のRSSフィードをひとつにまとめ、自分のサイトで公開できるWebサービスです。まとめたフィードのセットは5種類まで作れ、タブで切り替えて表示できます。
Repper -> create your own patterns!
自分でアップロードした画像を元に、継ぎ目のない繰り返しパターンを作成できます。位置やサイズを変更して、偶然できる画像を楽しむもののようです。
ウェブ上であらゆるファイルを変換できるサイト「Convert.Files」が超便利*二十歳街道まっしぐら
対応フォーマットが非常に多いファイル変換サービスの紹介記事です。

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

ミーティングや会議、飲み会などの集まりで、みんなの「都合のよい日」を調べたいときに便利な共有カレンダーです。

無料で使え、ユーザー登録も不要というお手軽さがよさそうです。ケータイ対応じゃないのが残念なところですね。

作ったカレンダーは個別のURLが設定され、パスワードによるアクセス制限をかけることもできます。不要になったカレンダーは簡単に削除できるようですが、3ヶ月で自動で消えるというのもいいですね。

ハッピーセットのおまけが「ヤッターマン・シール」ということで、マクドナルドのサイトにヤッターマンのキャラクターたちが登場しています。

ドロンボー一味がマクドナルドのサイトをジャックして、それを「ヤッターマンがいる限り、マックに悪は栄えない」とヤッターマンが阻止しようとするという設定が面白いですね。

ヤッターマンやヤッターマンのメカは何も活躍せずに、ユーザーがドロンボー一味を見つけてクリックしたらおしまいという単純な内容なんですが、子供たちは喜びそうです。

ここで唐突ですが、説明しよう。イラストは、ヤッターマン→ツィッターマンだけでなく、マクドナルド→マック→アップル→アップルのツィッター買収のうわさ話にも掛けたネタなのだ。おそまつだったでコロン。