こんにちワンッ！ デザイナー kaneyasu だワンッ！ 広告賞ってたくさんあるけど、どれに応募したらいいの？ という人に向けて、個人で参加できるウェブ広告賞のまとめを書きました！ ・・・でも、難しいんでしょ？ そんなことありません。 クライアントワークじゃなくても応募できるから簡単ッ！ まず一点目はこちら！ 「Yahoo！クリエイティブアワード」 募集期間はだいたい、7～8月。 今年は、8/10までで作品募集していました！ 2010年度の一般参加の部門は、バナー部門とウェブコンテンツ部門と、スマートフォン部門がありました。 みなさん応募しました？ ちなみに、2009年度の受賞作品はこちら 2009年度受賞作品：一般の部：Grand Prix 作品名： Blogopolis http://blogopolis.jp/ 2009年度受賞作品：一般の部：バナー部門 「LIFE ENGINE」

■piku http://www.piku.jp/ ツイッターアカウント ●http://twitter.com/_Pikuchan_ いち早くサービスを開始したサイト。 食品からエステ、音楽ギフト券など幅広い商品の取り扱いが魅力です。 ■KAUPON http://kaupon.jp/tokyo/ ツイッターアカウント ●東京：http://twitter.com/kaupon_tokyo ●大阪：http://twitter.com/kauponosaka 食事の割引クーポンがおおいです。 大阪版もオープンした模様。 ■Qpon http://qpon.jp/ ツイッターアカウント ●http://twitter.com/qpon 食事などが多いです。 ■ミナワリ http://www.minawari.jp/ ツイッターアカウント ●http://twitter.com/minawa

We craft engaging stories, mindful strategy, and creative experiences. We’re paper boats and electronic cityscapes. Whatever the weather, whatever the media, we strive to create compelling experiences that tell unique brand stories. We collaborate with companies that embrace design thinking to deliver products and experiences that are clever and authentic. Turn that note in your pocket into a voic

Effective Tour Pages: Trends and Showcase 下記は各ポイントを意訳したものです。 1 .特長やベネフィットのリスト 2 .ナンバー付きのリスト 3 .動画 4. スクリーンショット 5 .Less is More 6 .サインアップとアクションボタン 7 .ユニークなデザイン 8 .プランや価格へのリンク ツアーページのショーケース 1 .特長やベネフィットのリスト ツアーページの最も重要な役割は、ユーザーになぜその商品あるいはサービスを気にかけるべきか、そしてそれが何をすることができるかを伝えることです。どれくらいユーザーに有用であるかを示す方法として、主な特長やベネフィット、あるいはセールスポイントをリストアップします。 ※ベネフィットとはユーザーがうける恩恵のことです。 Take a tour of Basecamp 上記のサイトではベネフィッ

サムネイル画像をドラッグして、大きい画像の表示領域をその動作に合わせてスクロールさせるスクリプトを紹介します。 jQuery Image Scroller Plugin デモページ このスクリプトは作者がPUMAのサイトを構築する際に使用したスクリプトをjQueryのプラグインとして作り直したとのことです。 PUMAで使用されているのは、下記のページです。 <textarea name="code" class="html" cols="60" rows="5"> <div class="image-scroller"> <img src="images/feature.jpg" alt="" class="feature-image" height="1280" width="960" /> <div class="preview"> <img src="images/preview.j

FAST-RB NITRO™ ELITE足元のクッション性と爆発力が、 ランニングを新たな高みへと昇華させる

Twitterで紹介したら、好評だったのでブログでもご紹介。 CSS3 PlaygroundはCSS3のスタイルシートをブラウザでの表示確認をしながら、スタイルシートを生成できるオンラインサービスです。 CSS3 Playground 現在対応しているのは、下記のスタイルです。 角丸とボックスシャドウ テキストシャドウ CSS3 Transform（回転・変形） ボーダー・背景周り テキスト周り

Photoshopで作成したかのような美しいデザインのボタンを実装するスタイルシートを紹介します。 キャプチャは上から、ノーマル時、ホバー時、クリック時です。 Make CSS3 buttons that are extremely fancy デモページ デモページ（カラーバリエーション） ※更新：カラーバリエーションを増やしました。 ボタンはCSSで実装されているため、ブラウザの文字サイズの拡大に伴いサイズも変更し、カラー変更も簡単におこなえるように設計されています。 ※CSS3非対応のIE7/8などでの見栄えはそれなりになります。 実装はシンプルながらもテクニカルで、先日当サイトで紹介した「Safariで見かける角丸のにじみを解消するスタイルシート」なども利用されています。 HTML ボタンのカラー変更が簡単にできるようにインラインスタイルシートを使用しています（下記キャプチャ参照）

他の人が作成したワイヤーフレームがちょっと見たいなあ、という人向けのウェブサイトのワイヤーフレームをコレクションしているサイトを紹介します。 Wireframe Showcase サイトでは現在20余りのワイヤーフレームがあり、それぞれ3ページぐらいコレクションされています。 その中から、興味深かったものをいくつかご紹介。

Firefox, IE, Chrome, Safari, Operaの各種ブラウザのアイコンを紹介します。 High-res browser icons 上記からダウンロードできるのはPNGフォーマットで、サイズは256, 128, 64, 32, 16が揃っています。 また、コメント欄には大きいサイズ512のものやAIフォーマットのものもありました。 フォーマット：PNG、サイズ：512 Firefox Chrome Safari フォーマット：AI ダウンロードするには登録（無料）が必要です。 Firefox IE8 Chrome Safari Opera

さっき見つけたので、まだちょっとしか聴いてないのですが、プライベートだけでなく仕事中のBGMにかなりよさそうです。 shuffler 登録されている音楽のジャンルは100以上あり、曲がシャッフルされて流れてきます。 ジャンルを選択するには、各サムネイル画像をクリックしてください。 ジャンルは多岐に渡っています。 ambient female vocalists soul classic rock house jazz acoustic techno reggae ska african noise など、多数です。

CSS3 Media Queries 下記は各ポイントを意訳したものです。 はじめに CSS2のMedia typesではscreen, printなどのように特定のメディア用のスタイルシートを設定することができました。CSS3ではクエリを加えることで、さらに効率的にスタイルシートを使用できます。 Media Queriesはユーザーの状態を調べ、それにあった特定のスタイルシートを適用することができます。例えば、大きいディスプレイ用と小さいモバイル用にそれぞれ異なるスタイルシートを指定することができます。 Media Queriesの使い方 まずは、デモページをみてください。 ブラウザのサイズを変更すると、スタイルが変更されます。

CSS3って角丸とかシャドウとかグラデーションでしょ、という人に知っておいてほしいCSS3の大切なテクニックを紹介します。 3 Advanced CSS3 Techniques You Should Learn デモページ（※キャプチャはChrome） [ad#ad-2] 1. Advanced Selectors CSS3で最も重要といってもよい特徴の一つが「Advanced Selectors」です。簡単に説明すると、特定のHTMLエレメントに対してIDを使用しないで、スタイルを適用できるものです。 リスト要素で配置した下記のデモを見てください。 背景色を奇数番目はブルーに、更に5番目はレッドにしています。

あなたが作成したページがGoogleなどの検索エンジンになぜインデックスされないのか、なぜランキングされないのか、ペナルティを課せられていないか、重複コンテンツの問題はないかを確認できる方法を紹介します。 10-Minute Missing Page Audit [ad#ad-2] 下記は各ポイントを意訳したものです。 各見出しの左は時間の目安です。 [0:00-0:30]インデックスの確認（ドメイン） サイトがGoogleにインデックスされているか確認します。フォームに「site:」コマンドを使用して、検索してください。 コマンドを使用する時はルートのドメイン名（site:example.com）を入力してください。 [0:30-1:00]インデックスの確認（ページ） 次に、ページがインデックスされているか確認します。前述の結果、Googleがそのサイトの存在を知っていると想定し、問題の

HTML5のチートシートはデザインも優れたものが多くリリースされていますが、またかっこいいものがありました。 Periodic Table of the Elements 追記： 上部にURLを入力すると、そのページで使用している要素をハイライトしてくれます。 デザインがいいだけでなく、チートシートとしても便利です。 各要素をクリックすると、W3Cをはじめとする詳細ページのリンクが表示されます。

HTMLの各要素のデフォルトのスタイルをリセットするだけでなく、見出しやパラグラフ、リスト、フォームなどの新しいスタイルの再構築も想定されたスタイルシートのフレームワークを紹介します。

先日、Twitterの公式サイトから「ツイートボタン」がリリースされましたが、それより少し高機能なWordPressのプラグインを紹介します。 ※2010年8月現在、当サイトでも利用中。 WP Tweet Button 公式のツイートボタンと比較すると、下記の点で高機能となっています。 ボタンの表示は、自動、手動、ショートコードに対応。 テーマファイルの修正無しで配置が可能です。 自動の配置場所は、天・地・天地。 表示するページの選択が可能。 各記事、フロントページ、RSS Feedへの表示をそれぞれ選択できます。 管理画面でスタイルシートが変更可能。 ボタンを内包しているdiv要素とリンクの二つが変更できます。 追記：bit.ly, tinyurl.comなどの短縮サービスに対応。 追記：Twitter Friendly Linksをサポート。 ボタンの言語は、日本語にも対応（公式と同じ