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

1. CSS3 in practice, maddesigns (Sven Wolfermann) #css3http://maddesigns.de/css3/css3-in-practice.html

CSS3を基礎的なところからレクチャーしてくれるスライドです。WebDevCon 2011というカンファレンスで使われた資料のようです。

角丸やドロップシャドウなどについて、初歩から詳しいところまでわかりやすく解説してくれます。英語ではありますが、そのまま日本の勉強会に使えそうなわかりやすさです。ブラウザごとのサポート状況や、IE対策に触れられているのもうれしいところです。

border-radius、box-shadowにはベンダープリフィックス（-webkit-や-moz-）は今や不要というのは知りませんでした。ただし、iPhoneとAndroidに適用させるには、box-shadowのプリフィックスは必要とのことです。

なお、シンプルで見やすいこのスライドは、Googleのhtml5slidesというスライドテンプレートを使っています。フルスクリーン表示もできますし、iPadでも横置きでなら問題なく見ることができました。

2. Rapid Prototyping For Any Device With Foundation - Smashing Codinghttp://coding.smashingmagazine.com/2011/10/25/rapid-prototyping-for-any-device-with-foundation/

Foundationというプロトタイプ作成用フレームワークを紹介した記事です。

Foundationの特長は以下の通りです。

• 任意の最大幅で作れる12カラムのパーセントベースの可変グリッド
• ピクセル数によらずグリッドによって可変する画像
• UIやレイアウトのパターンが用意されている
• デバイスに合わせて見た目を変えられる

やはり、タブレットやモバイル端末を強く意識したものとなっています。

3. Webデザイナーならば必ず一度は憧れる、余白が美しいWebデザインまとめ60個 - W3Qhttp://w3q.jp/t/105

余白が美しいWebデザインをまとめて紹介しています。

この記事が掲載されているのは、「⁠Web制作者のためのQ＆Aとまとめサービス」をうたったW3Qというサイトで、最近オープンしたようです。記事もどんどん充実しているようで、今後に期待したいサービスです。

4. 25 jQuery Plugins to help with Responsive Layoutshttp://speckyboy.com/2011/10/24/25-jquery-plugins-to-help-with-responsive-layouts/

レスポンシブWebデザインに役立つjQueryプラグインをまとめています。

画面サイズに合わせて画像やテキストのサイズを調整するもの、画面サイズによって可変するスライドショーなどのjQueryプラグインが紹介されています。

5. 電子書籍を自分で出版してみよう！ | Webクリエイターボックスhttp://www.webcreatorbox.com/webinfo/publish-your-ebook/

電子書籍をいろいろなツールで実際に作ってみたレポート記事です。EPUB中心であっさりした内容ですが、入門編として面白いと思います。

なんとなく作れそうだと思っている人は多いでしょうが、実際にやってみて記事にまとめた行動力がすばらしいですね。

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

• jQuery Mobileのビジュアルデザインが自由に！ Theme Rollerついにリリース ::ハブろぐ
  Webインターフェイスを使ってjQuery Mobileのカラーテーマを作成できるようになりました。
• 25+ jQuery Slider Examples
  jQueryを使ったスライダーを各種紹介。
• 汎用性の高い、jQueryの定番系プラグインのまとめ | コリス
  jQueryの定番プラグインを紹介しています。

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

Webデザインや配色をサポートする新サービス | Croppy（クロッピィ）http://croppy.org/

Croppyは、Webデザイナーのためのパーツ別スクラップブックサービスです。

ブックマークレットを使うことで、見ているWebページの任意の場所を切り抜いてスクラップできることが特長の一つです。切り抜かれた画像を分析して、使われている色が表示されるのも便利そうです。

「ヘッダー」「⁠バナー」「⁠ボタン」などカテゴリに分けられたパーツの画像は、ほかの人がスクラップしたものも見ることができます。

パーツだけが一人歩きしないように、どこのサイトから切り抜かれたかが目立つように表示されるのもいいですね。そのサイトの評判をはてなブックマークやTwitterから表示する機能も気が利いています。

Webデザイナーなど制作者が参考にクリップするという用途はもちろん、発注者が作ってもらいたいサイトのテイストやイメージを伝えるのにも役立ちそうです。