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

1. CSS3 Gradient Buttonshttp://www.webdesignerwall.com/tutorials/css3-gradient-buttons/

CSS3によるグラデーションボタンのフレームワークを紹介しています。

CSS3のテクニック紹介としても参考になるのですが、このソースをそのまま使ってボタン作りに利用することもできます。

角丸の半径2種類、大きさ3種類、色9種類をそれぞれ組み合わせて設定可能です。もちろんCSSファイルをいじってカスタマイズしてもいいでしょう。

設定の仕方は、a要素などのclassに⁠”button blue⁠”や"button orange small"のように指定するだけと簡単です。

このボタンの特徴は以下のように紹介されていました。

• 画像やJavaScriptを使っていない
• グラデーションはSafari、Chrome、Firefox 3.6、そしてIEにも対応している
• 文字サイズの変更に合わせて、ボタンの大きさや角丸の半径などが可変する
• hover、activeの際にボタンが変化する
• a要素だけでなく、どんなHTMLの要素にも適用できる
• CSS3に対応していないブラウザでも、ただの四角いボタンとして動作する

CSS3によるボタンのデザインに興味のある方は「12 Excellent CSS3 Button and Menu Techniques | Tutorials」というリンク集も役に立つと思います。

2. Different Stylesheets for Differently Sized Browser Windows | CSS-Trickshttp://css-tricks.com/resolution-specific-stylesheets/

ブラウザのウィンドウサイズに合わせて、複数のCSSファイルを切り替えるテクニックを紹介しています。

CSSを読み込ませる際のmedia属性に「min-width」と「max-width」を使って、ウィンドウサイズの違いで別のCSSを指定することができるんですね。

「device-width」を使うと、ブラウザのウィンドウサイズではなく、そのマシンの画面サイズによって読み込ませるCSSを変更できるとのことです。

この設定はInternet Explorerには対応していないため、jQueryを使ってJavaScriptで同様のことを実現する方法も紹介されています。

3. 30 Pure CSS Alternatives to Javascript - Speckyboy Design Magazinehttp://speckyboy.com/2010/04/26/30-pure-css-alternatives-to-javascript/

JavaScriptを使わずにCSSだけでこれだけできるぞというテクニックを集めたリンク集です。やはりCSS3を使ったものが多いですね。

「Improve Your CSS Skills With Pure CSS UI Components | W3Avenue」というCSSだけで実現するUIコンポーネントのリンク集も併せてご覧ください。

4. 40 Amazing Resources for Design Freebies | Design Shackhttp://designshack.co.uk/articles/inspiration/40-amazing-resources-for-design-freebies

フォント、テクスチャー、テンプレートなど、デザインに役立つフリー素材を配布しているサイトを大量に紹介しています。

「31 Free Clean Icon Sets For Minimal Web Design | Graphic and Web Design Blog」という、シンプルなアイコンセットを多数紹介しているリンク集もありました。

5. 49 Fantastic Iphone Inspired for your Inspiration | TutToasterhttp://www.tuttoaster.com/49-fantastic-iphone-inspired-for-your-inspiration/

iPhoneアプリ紹介サイトのデザインショーケースです。

iPhoneアプリのサイトには洗練されたサイトが多い気がしますね。やはりiPhoneアプリ自体、デザインが重要ということも影響しているのでしょう。

そのほか先週の記事から、気になるニュース記事を3つ紹介します。

• Adobe、iPhone向けFlashを断念　Androidにシフトへ - ITmedia News
  iPhone OS SDKの利用規約変更を受け、FlashアプリをiPhoneアプリに変換するツールの開発を終了するとのことです。
• ドミノ・ピザ、iPhoneアプリ経由の売上高が41日間で3000万円超：NETMarketing Online(日経ネットマーケティング)
  花見会場からの注文など、屋外からの利用が相次いだそうです。
• 読売新聞とデジタルガレージら、Twitterを使った「大手小町アフターファイ部」:ニュース - CNET Japan
  ツイッターと連動した女性向けの企画です。

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

Twitgether - Social Twitter Client - Gmail Gadget, Facebook App...http://twittergadget.appspot.com/

Twitgetherは、GmailやiGoogle、Facebook、MySpaceなどの上で使えるTwitterクライアントです。

たとえばGmailにTwitgetherのガジェットを追加すると、Gmailの画面上にTwitgetherのウィンドウを開くことができます。

そのウィンドウ上で、タイムラインを読んだり、ツイートやリツイートなどを行ったりと、ほとんどの作業ができてしまいます。

GmailへTwitgetherを追加する方法はサイトにも説明されていますが、「⁠普段使っているGmailを簡単にフル機能のtwitterクライアントにしてしまう方法」という記事に日本語で紹介されていました。

まずはこのクライアントの使い勝手を試してみたいという場合には、Twitgetherのサイト上ですぐに利用することもできますよ。