週刊Webテク通信

2010年9月第1週号1位は、お菓子のようなCSS3によるボタン、気になるネタは、Apple、「iTunes 10」発表 - 目玉はソーシャルネットワーク「Ping」

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

1. BonBon Buttons - Sweet CSS3 buttonshttp://lab.simurai.com/css/buttons/

お菓子のような、かわいいボタンをCSS3で実現したフレームワークです。魅力的な見た目で、自由度が高く、最小限のマークアップで実現できるものを目指して作られました。

使っている画像は1点だけで、あとはすべてCSSでデザインされています。ざらざらした質感を出すための、ノイズのテクスチャーの透過PNGファイルが唯一の画像です。色やハイライト部分、ドロップシャドウやアニメーションはすべてCSSで実現しています。アイコン類は記号フォントをWebフォントとして使っているようです。

HTML5やCSS3の新機能を随所に利用しているため、IEおよび古いバージョンのブラウザでは、狙い通りの表示にはなりません。もちろんどんなブラウザでもリンクテキストとしては動作するので、大きな問題はないでしょう。

図1 キャンディのようなかわいいCSS3ボタン
図1 キャンディのようなかわいいCSS3ボタン

2. Illustrator Template Toolbox for Web, Mobile and App Developers :Speckyboy Design Magazinehttp://speckyboy.com/2010/09/01/illustrator-template-toolbox-for-web-mobile-and-app-developers/

Webサイトやモバイルサイト、アプリケーションを開発するときに役立つ、Illustrator素材を多数紹介しています。

ワイヤーフレームに使えるテンプレートやUI素材、ボタンデザインのベースになる素材、各種モバイル端末のインターフェイスなど、いろいろありますね。

iPhoneやiPadなどを操作するときのジェスチャーを説明するための手のイラスト集が目にとまりました。これは便利そうです。

図2 Web制作に役立つIllustrator素材いろいろ
図2 Web制作に役立つIllustrator素材いろいろ

3. 見出しデザイン.comhttp://midashi-design.com/

いろいろなサイトの見出しを集めたギャラリーです。囲み線、斜線、点線などのカテゴリに分類されています。

見出しのデザインに注目した場合、全部画像なのかテキストと画像の組み合わせなのかも気になるので、そのへんも分かるといいなと思いました。

SafariやChromeで見ると、一覧画像が揺れて表示されますね。

図3 見出しデザインのギャラリーサイト
図3 見出しデザインのギャラリーサイト

4. クライアントに頼まれやすい機能を補えるWordPressプラグインいろいろ - かちびと.nethttp://kachibito.net/wordpress/plugins-for-commercial.html

WordPressでシステムを構築した際に、クライアントに要求されることの多い内容を解決するプラグインを紹介しています。

管理画面を使いやすくするもの、投票システムやコンタクトフォームを簡単に実装するものなど、知っておくといつか役立ちそうなものばかりです。

図4 クライアントからの要望に応えるWordPressプラグインいろいろ
図4 クライアントからの要望に応えるWordPressプラグインいろいろ

5. Flickr Groups for Logo and Web Design Inspirationhttp://www.1stwebdesigner.com/inspiration/flickr-groups-logo-web-design-inspiration/

ロゴを集めたもの、Webデザインを集めたものなど、デザインのインスピレーションになりそうなFlickrのグループを各種紹介しています。

Flickrユーザーなら、気になる画像をお気に入りに入れておくこともできますね。Flickrをこういう用途に使ってもいいのかしらという気もするのですが、どうなんでしょう。

図5 ロゴやWebデザインの参考になるFlickrグループ
図5 ロゴやWebデザインの参考になるFlickrグループ

そのほか先週の記事から、気になるニュース記事を小ネタもまじえて紹介します。

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

Greplinhttps://www.greplin.com/

「Greplin」は、Gmailやソーシャルサービスなど、クラウドでの自分のデータをまとめて検索できるようにするサービスです。Googleデスクトップ検索やMacのSpotlightのクラウド版といったところでしょうか。

Gmail、Facebook、Twitter、Dropbox、Googleカレンダー、Goolgeドキュメント、Evernote(プロ版で対応)などに対応しています。

有料のプロ版では、使えるサービスが増えるほか、インデックスされる容量が増える/セキュリティが強化される/PDF、ワードファイル、エクセルファイルの中身を検索できるなど、魅力的な機能が追加されるようです。

日本語の検索は期待できないと思いますが、まずは使ってためしてみたいですね。

さあ試してみるぞと思いユーザー登録をして、Twitter、Gmailなどを登録したのですが(OAuthなどのAPI経由での認証⁠⁠、よく見ると「準備ができたらメールするね」といった内容のメッセージが…。まだベータ版なので、使えるユーザーが限定されているようです。

図6 クラウドのデータを一括検索できるサービス
図6 クラウドのデータを一括検索できるサービス

おすすめ記事

記事・ニュース一覧