週刊Webテク通信

2011年2月第4週号　1位は，大きく目立つボタンのショーケース，気になるネタは，ニンテンドーDSi用のBASICが登場

Webテク, Webデザイン, Web広告, Facebook, スマートフォン, ニンテンドーDSi, BASIC

この記事を読むのに必要な時間：およそ 2 分

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

1. Showcase of Big, Bold and Beautiful Call to Action Buttons | Web Designer Aidhttp://webdesigneraid.com/showcase-of-big-bold-and-beautiful-call-to-action-buttons/

大きく目立つボタンのショーケースです。

ユーザーの次のアクションをうながすボタン（Call to Action Buttons）を作る上で，サイズを大きくすると目立つというのは当たり前ですが有効なことです。

ここで紹介されているボタン類を単体で見るだけでなく，ページ内での配置された位置や配色を確認することで，より参考になるでしょう。

全体の傾向を見てみると，相変わらず緑のボタンが多いようですね。

図1　大きく目立つすばらしいボタンのショーケース

図1　大きく目立つすばらしいボタンのショーケース

2. The Art of the Facebook Page Design | Webdesigner Depothttp://www.webdesignerdepot.com/2011/02/the-art-of-the-facebook-page-design/

Facebookページのデザインを大量に紹介しています。

タブが上にある古いレイアウトでキャプチャー画像は統一されていますが，すでに左にメニューがある新レイアウトに移行しているページもあります。ざっと見たところ，ここで紹介されているFacebookページの半分くらいが新しいレイアウトに変更しているようです。

海外の事例ですが，有名企業がどこも立派なFacebookページを開設しているという資料にもなりますね。左のアイコン画像の使い方もみどころです。

新旧レイアウトの違いなどについては，「⁠デザインで訴えかけるFacebookページ - SINAPlog」でも解説されていました。

図2　米企業のFacebookページデザインいろいろ

図2　米企業のFacebookページデザインいろいろ

3. スマフォサイト作りの前に知っておくべきデザインギャラリー等リソースまとめ:phpspot開発日誌http://phpspot.org/blog/archives/2011/02/post_540.html

国内外のスマートフォン向けサイトのデザインギャラリーを多数紹介しています。

アプリのユーザーインターフェイスの紹介サイト，アプリアイコンのギャラリーサイトなども紹介されていました。

図3　スマートフォン向けサイトのデザインギャラリーなど

図3　スマートフォン向けサイトのデザインギャラリーなど

4. Impressive Typography Sites - Noupe Design Bloghttp://www.noupe.com/fonts/impressive-typography-sites.html

タイポグラフィが印象的なサイトを集めたギャラリーです。各サイトについて，ちょっとした解説文もあります。

図4　タイポグラフィが印象的なサイトギャラリー

図4　タイポグラフィが印象的なサイトギャラリー

5. 30 Creative And Unique Personal Portfolio Websiteshttp://stylishwebdesigner.com/30-creative-and-unique-personal-portfolio-websites/

デザイナーによるポートフォリオサイトのデザインギャラリーです。

誰もがユニークでベストなものにしたいと思って作るポートフォリオなので，細部まで気を遣ったデザインのものが多いですね。

図5　クリエイティブでユニークなポートフォリオサイト30個

図5　クリエイティブでユニークなポートフォリオサイト30個

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

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

3D Ribbon Generator - CSS3d.nethttp://www.css3d.net/ribbon-generator/

海外のサイトでよく見かける，立体的なリボンを作るジェネレーターです。このジェネレーターのページ自体でも多用されています。

設定項目が多くて分かりにくいので，まず「Examples」にあるサンプルからイメージに近いものを選んで，それをベースにカスタマイズしていくといいでしょう。

リボンは，画像を全く使わずにCSSだけで実現しています。Internet Explorerは7以上に対応しているようです。

図6　立体的なリボンを作るジェネレーター

図6　立体的なリボンを作るジェネレーター

今週の気になるWebネタ

プチコンhttp://smileboom.com/special/petitcom/index_a40.html

世間ではニンテンドー3DSが話題ですが，ニンテンドーDSi用のBASICの話題です。

この「プチコン」はニンテンドーDSi上でBASICを動かすためのソフトで，DSiウェアとして3月9日から配信されるそうです。

ターゲットはやはりBASICをなつかしく思う，あの日のマイコン少年たちのようです。「⁠プチコン」のページは，そんな人が見るとツボにはまりそうなネタが多くて楽しめます。

BASICとしても，行番号制ではなかったり，比較演算子がJavaScriptやPHPと同じになっていたりと，現代風に進化しているようです。

ちなみにわたしもマイコン少年のはしくれで，BASICで作ったゲームのプログラムが雑誌に載ったこともあります。あのころは，雑誌に掲載されたプログラムを自分で打ち込んで動かしていたんです。プログラムを保存するのはカセットテープ。隔世の感がありますな。

Webテク, Webデザイン, Web広告, Facebook, スマートフォン, ニンテンドーDSi, BASIC

著者プロフィール

アシカガコウジ

フリーのWebデザイナー＆ライター。ポッドキャスト「アシカガCAST」でデジタル活用のヒントを発信中。シャープMZ-80Bからのパソコンユーザーで，Macintosh IIciからのMacユーザーでApple好き。Webテク情報やツール（ソフトウェア）の案内，デジタル活用情報をまとめた「アシカガノオト」をNotionで公開しています。

http://bit.ly/ashikaganote