週刊Webテク通信
2009年3月第2週号 1位は,画像を扱うjQueryのプラグイン14個/気になるネタは,「日テレアプリ」公開,APIの提供もスタート
ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から,Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は,2009年3月9日~3月15日の間に見つけた記事のベスト5です。
1. 14 jQuery Plugins for Working with Imageshttp://sixrevisions.com/resources/14-jquery-plugins-for-working-with-images/
画像を扱うjQueryのプラグインを14個紹介しています。
スライドショー,ギャラリーといった用途に使うものや,写真を部分的に表示するものなど,画像の見せ方を工夫する際の手助けになりそうなものがそろっています。
関連リンクとして載っている同サイト内の別記事「16 Free JavaScript Solutions for Displaying Your Images 」でもフォトギャラリーのソリューションが紹介されていますね。
2. Beautiful Forms - Design, Style, & make it work with PHP & Ajax | Noupehttp://www.noupe.com/php/beautiful-forms.html
フォームをきれいにデザインする方法や,Ajaxを使って機能を追加するフレームワークなど,フォーム作りに役立つ情報をいろいろと紹介しています。フォームのまとめサイトと言っていい充実ぶりです。
フォームの値チェックに関しても,ひとつのコーナーを設け複数のフレームワークを紹介しています。
3. 40 Useful Adobe Illustrator 3D Tutorials and Techniqueshttp://sixrevisions.com/tutorials/40-useful-adobe-illustrator-3d-tutorials-and-techniques/
その昔Adobe Dimensionsという3Dツールがありましたが,今やIllustratorにもPhotoshopにも3D機能が付いています。でも,3D機能を使いこなしている人ってそんなに多くないんじゃないでしょうか。
この記事では,Adobe Illustratorで3D表現をするためのチュートリアルが多数紹介されています。Illustratorでは「3D効果」機能で図形を押しだし・回転させることができるのですが,ほとんどのチュートリアルでこの機能が効果的に使われています。
3D効果を使う部分と,普通に描画するところの使い分けの参考にもなりそうです。
4. 20+ ways to create javascript modal windows and dialog boxes | Design Labelhttp://www.designlabelblog.com/2009/03/20-ways-to-create-javascript-modal.html
モーダルウィンドウやダイアログボックスを表示させるスクリプトを配布しているサイトのリンク集です。
モーダルウィンドウって何? という人は検索すればいくらでも解説が出てくると思いますが,ウェブページ上でのモーダルウィンドウといえばLightboxが有名ですね。ああいった子ウィンドウのことです。
ポップアップウィンドウを開くのはいろいろとよろしくないということで,最近はほとんど使われない傾向にあります。でもポップアップ的な見せ方をしたいケースはあるので,そういうときに役立つのがこういったJavaScriptによるモーダルウィンドウ的な効果です。
ところで,初めてLightboxを見たときは驚きましたよね。今では当たり前になってしまい,クライアントもあまり驚いてくれませんが。
5. CSS Codes : CSS Code Snippets for Web Designers & Developers : Web Design Resources Blog & Graphics Blog with Lists of Web Site Design Toolshttp://www.allwebdesignresources.com/webdesignblogs/graphics/css-codes-css-code-snippets-for
-web-designers-developers/
CSSコードのスニペットを公開しているサイトをいろいろ紹介しています。
検索エンジンでの検索結果の下に表示される概要文のこともスニペットと呼ぶらしいですが,ここでのスニペットはよく使う定型的なコード記述のことです。コピペして使えるお役立ちコードと言った方が分かりやすいかも。
snippetという単語は断片という意味ですが,断片とは呼べないような長いコードの場合や一行だけのものもスニペットと呼んでいるようです。JavaScriptのライブラリもスニペットと呼ぶケースもあって,基準はよく分かりませんね。
この記事では,タダでこれらのスニペットが手に入るのに何で新たにコードを書くの? といった論調なのですが,探してるより自分で書いたり人に聞いた方が速いケースも多い気がします。
以上,メルマガ「デイリーWebテク」で先週紹介した記事から独断と偏見で選んだベスト5でした。
先週の記事を振り返ってみると,見て楽しめるページがいくつかあったので紹介します。
- Operating System Interface Design Between 1981-2009 | Webdesigner Depot
いろんなOSのインターフェイス画面を集めています。昔のMacやWindowsの画面がなつかしいですね。バージョン1,2のWindowsの配色がスゴイ! - モバイルサイトデザイン集のモバイルデザインアーカイブ 公式サイト
優れたデザインのケータイサイトを集めたデザインギャラリーサイトです。 - 70 Best and unique RSS icons collection | Themes Tube
RSSアイコンの膨大なコレクションです。
先週の気になるWebサービス
Xenocode - Run your applications from the web, Active Directory, and flash driveshttp://www.xenocode.com/
以前,好きなブラウザ(IE6,7,8,Firefox,Safari,Chrome)をインストールなしに起動できるプロダクトとして紹介したXenocodeですが,ほかのアプリケーションも起動できるようになっていました。オープンソース画像編集ソフトの定番GimpやAdobe Reader,WinAmpが使えるようになっています。
これ,Webデザイナーがブラウザチェックをするためのプロダクトではなく,いろんなブラウザを起動させるのが目的でもないんですね。
アプリケーション仮想化技術をプレゼンするためのデモとして,フリーのアプリを動かしてみせているということのようです。
ということでWebサービスでもないんでしょうが,気になる存在なので紹介しました。
今週の気になるWebネタ

「日テレアプリ」公開,APIの提供もスタート:MarkeZine(マーケジン)http://markezine.jp/article/detail/6845
日本テレビが「日テレアプリ」というコーナーをオープンして,ブログパーツやガジェットの提供を始めました。また,Web APIも公開しています。テレビとネットは仲が悪いとされていますが,この日テレの取り組みには他局も注目してるんじゃないでしょうか。
APIは,日テレ系の番組を出演者で検索するもの,日テレ系のニュースをフリーワードで検索できるものの2つ。注目はやはり出演者検索ですよね。ほかの局も同様のAPIを提供してくれれば,マッシュアップして好きなタレントの番組表が作れそうです。ありがちな発想ですが。
ブログパーツやRSSは個々の番組サイトからも入手できるんでしょうが,こうやって一箇所にまとまっていると便利ですね。
週刊Webテク通信
- 2009年3月第3週号 1位は,パンくずリストのまとめ/気になるネタは,iPhone OS 3.0発表
- 2009年3月第2週号 1位は,画像を扱うjQueryのプラグイン14個/気になるネタは,「日テレアプリ」公開,APIの提供もスタート
- 2009年3月第1週号 1位は,CSSハックしてはいけない5つの理由/気になるネタは,AsusのキーボードPC は価格4-6万円で5月か6月発売!
- 2009年2月第4週号 1位は,CSSでの縦方向のセンタリング/気になるネタは,アップル,Safari 4を発表
- 2011年12月第4週号 1位は,ノーマライズの考え方を取り入れたリセットCSS,気になるネタは,Google+メジャー・アップデートへ―スライダーによるストリーム管理など新機能多数
- 2011年11月第1週号 1位は,jQueryでつくる,動きのあるWebページ,気になるネタは,アドビ,iOSとMacで利用できる写真用クラウドサービス「Carousel」提供開始
- 2011年10月第1週号 1位は,レスポンシブWebデザインのショーケース,気になるネタは,アマゾン,タブレット「Kindle Fire」を発表
- 2011年9月第2週号 1位は,第一印象で目を引くWebデザインについて,気になるネタは,Google+のポリシーでの通称名とはハンドルネームではない
- 2011年7月第5週号 1位は,フッタデザインのトレンド,テクニックとショーケース,気になるネタは,佐賀県武雄市,市のページをFacebookに完全移行へ

