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

1.17 Best Javascript Image Gallerieshttp://valums.com/javascript-image-galleries/

JavaScriptを使ったイメージギャラリーを17個紹介しています。Macのカバーフロー風のものや、その亜流もありますね。JavaScriptで制御しているとはいえ、ちゃんと画像ごとに個別のURLを持つようになっているものもあります。

jQuery、Mootools、PrototypeとJavaScriptライブラリごとに紹介されています。やはりjQueryベースのものが多いですが、凝った動きのものではMootolsも健闘しているようです。

たくさんの画像を並べて見せるもののほかに、スライドショー表示だけのものや、サムネイルから拡大画像をモーダルウィンドウで開くLightBox系のものもいくつか紹介されています。jQueryで動くLightBox系のThickbox、Fancyboxは、動画や別ページなど画像以外のものを別ウィンドウ感覚で表示するのにも使えて便利です。

2．50 Excellent Icon Design Tutorialshttp://sixrevisions.com/graphics-design/50-excellent-icon-design-tutorials/

アイコンデザインのチュートリアルを多数紹介しています。

アイコンといっても大きなサイズでディテールまで描き込んだ、Mac OS Xのアイコン風のものがほとんどです。なので、アイコンデザインというより、ベクターイラストのチュートリアル集といったほうがいい気がしますね。ドット絵アイコンのチュートリアルも一つだけありますが。

使われているツールはほとんどPhotoshopかIllustratorです。英語を読むのが面倒でも、スクリーンショットを追って行けばなんとかなるかもしれません。動画のチュートリアルがあるものは、言葉は分からなくても大丈夫でしょう。

画像を作るためのチュートリアル以外に、アイコンデザインに関するノウハウやTipsの記事も紹介されています。

3．真似からはじめるウェブデザインhttp://www.designwalker.com/2009/02/clone-webdesign.html

凝った背景画像のサイトを、そういった画像を作成するためのチュートリアルとともに紹介しています。また、有名サイトを真似て作られたWordPressのテーマ（テンプレート）の紹介も。これらにインスピレーションを受けつつ、真似しながらデザイン力を上げていこうという切り口の記事です。

元ネタは「Website Backgrounds: 70+ Impressive Trends, How To’s & Best Practices | Noupe」と「15 Great Examples of Cloned WordPress Themes - WPZOOM」です。どちらも眺めているだけでも面白いく、参考にもなりそうですね。

4．The Ultimate Collection Of Free Photoshop Patterns | Developer's Toolbox | Smashing Magazinehttp://www.smashingmagazine.com/2009/02/12/the-ultimate-collection-of-free-photoshop-patterns/

フリーのPhotoshop用パターン画像配布ページの膨大なリンク集。タイトルをそのまま訳すと「究極のコレクション」です。変に凝ったものはあまりなくて、シンプルで実用的なものを中心に紹介されています。

Photoshopのブラシ、パターン、シェイプの素材リンク集はいろんなところで紹介されていますが、いざというときに探し始めるとなかなかいいのが見つからなかったりするので、日頃からチェックしておきたいですね。

フリーにもいろいろあるので、使用する際はそれぞれのライセンス形態について確認しておきましょう。

5．ウェブサービス開発で使えるWYSIWYGエディターまとめ- IDEA*IDEA ～ 百式管理人のライフハックブログ ～http://www.ideaxidea.com/archives/2009/02/rich_editors.html

JavaScriptで入力フォームをリッチテキストエディタに変える、いわゆるWYSIWYGエディタをまとめて紹介しています。

TinyMCE、FCKEditorがこの分野ではメジャーなものですが、ほかにもいろいろありますね。CMSで使われるケースが多いと思いますが、簡易HTMLエディタとしても使えるかもしれません。

TinyMCEには、Movable Type上で使えるようにしたプラグインTinyMCE-MTPluginというのもあって、こちらも便利そうです。

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

先週のほかの記事としては、デザインの参考やインスピレーションの元になりそうなショーケースが目に付いたので、ピックアップして紹介します。

• 50 Insanely Good Vector-based Web Designs - VECTORTUTS
  ベクターベースのスゴいデザインのWebサイトのショーケース。
• 30 Stylish Examples of Doodles in Web Design | Blog.SpoonGraphics
  いたずら書きっぽいデザインのWebサイトのショーケース。
• 30 More Portfolio Sites for Your Design Inspiration
  ポートフォーリオサイトのショーケース。

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

Lovely Charts | Free online diagramming applicationhttp://www.lovelycharts.com/

豊富な種類のチャート図を作れるWebサービスです。サイトマップやワイヤーフレーム作成に役立ちそうです。しかし、残念ながら今のところ日本語の入力はできないようです。

「親しみやすいデザインのサイトマップやチャートが作成できるオンラインサービス -Lovely Charts | コリス」では、Lovely Chartsで作れる各種チャート画像のサンプルが紹介されています。

さくさく動きますし、かなり完成度は高いようですね。作成したチャートはJPEGかPNGで保存できます。

無料で使えるツールですが、有料のプレミア会員になるとバージョン管理やコラボレーション機能が使えるようです。ほかのユーザーとチャートを共有してコメントを付け合ったりできるようなので、サイトマップやワイヤーフレームのやりとりにも便利そうです。日本語が通るようになるのを期待しましょう。