2010年6月第3週号　1位は、ユーザビリティやユーザーエクスペリエンスの落とし穴と回避方法、気になるネタは、CSSだけで描いたTwitterのクジラのイラスト

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

ユーザビリティやユーザーエクスペリエンスに関する落とし穴とその回避方法をまとめた記事です。

「悪いウェブサイトは不機嫌そうなセールスマンのようなもの」というヤコブ・ニールセン（ユーザビリティ研究で有名なお方）の言葉を引き合いに出し、良いセールスマンとなるためのサイトの改善ポイントを解説しています。

以下の項目に分けて説明しています。

矢印以下に解決策の一部をまとめています。詳しくは元の記事を参照してください。

有名なブログのデザインを分析して比較した記事です。

カラムの幅やCSSでの文字の指定の仕方、画像の扱い方などを調査しています。

文字は純粋な黒ではなくグレーを使うというのは定番ですが、大きな見出しほどグレーを薄くしているというSmashing Magazineの例は参考になりますね。

画像を扱ったjQueryプラグインとテクニックを集めたリンク集です。

覚えておくと、画像の見せ方のバリエーションが広がるでしょう。

パンくずリストによるナビゲーションのススメと実例紹介。

AppleのサイトやDeliciousにあるような、ナビゲーションメニューとして使われているパンくずリストの記事です。

パンくずリストを使うメリットや、使った方がいいケースなどについて解説してあります。

Webサイトで使われているすばらしいイラストのショーケースです。この手のショーケースでよく見かける定番のサイトが結構ありますね。

「昭和の日　オフィシャルサイト」という日本のサイトも紹介されていました。

そのほか先週の記事から、iPad関連の記事を2つ紹介します。

ウェブや青空文庫をiBooksで読む！ - ZONOSTYLE
Calibreというアプリを使って、HTMLからiBooks用のepubファイルを作る方法を紹介しています。
iPadでHTML5でWebアプリを作ってみました。（⁠Yahoo! JAPAN Tech Blog）
iPad向けのUIに関する考察や技術的なテクニックなど、役に立つ情報が満載です。

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

ブラウザ上でJavaScript／HTML5／CSSを書き、共有するサービスです。

面白法人KAYACが提供しています。ActionScriptを投稿／共有できるwonderflというサイトもあるのですが、それのJavaScript版といった位置づけのもののようですね。

自分の書いたコードにアドバイスを求めたりできる、質問＆回答（Q＆A）機能もあります。

共有されたJavaScript／CSSのコードは、ライブラリとしてこのサイトから呼び出すことができます。

投稿数が増えてくると、どんどん便利になりそうなサービスですね。

Twitterのメンテナンスや混み合っているときに表示されるクジラのイラストを、CSS3だけで描いた人がいました。

以前も、CSS3だけで描いたOperaロゴやドラえもんが話題になりましたね。IEでの見た目のキャプチャーがオチというのも共通しています。

こういったことに心血を注ぐ人は嫌いじゃないんですが、これを喜ぶのもごく一部の人ですよね。ふつうの人には「なんのこっちゃ」という理解不能な話題でしょう。

ネットで話題の動画やテレビで話題になったり、iPadマジシャンがテレビに登場したりしていますが、こういった技術的なネタがテレビの話題になるようなことはないんだろうなと思った次第です。