ありがたい事に配信開始から５ヶ月の2010年新年早々にフォロワーが1000人を突破いたしました。フォロワーの皆さん本当にありがとうございます。そしてこれからもよろしくお願いします。

さてTwitter的に言えばフォロワーが1000人というは特に多いわけでもないのですが、なんとなくキリが良いのでまとめてみようと思います。まずは初回というか、まとめ一発目なので経緯を。(実際にやってみた感想は次回)

そもそも何故Twitterでweb制作系のサイトやブログを紹介し始めたかというと、実は僕はとても自堕落な人間でして、自分でも本当にビックリするほどに。でも何かを作ったり誰かの役に立ちたいという気持ちは人並みにもっていまして、毎日のように怠け者の自分と相反する欲求を抱えて悶々としてました。

天性もなく勤勉でもない者がクリエイティブな活動をするほど不幸な事はありません。

本来ならば自分の守備範囲（webデザイナー）の話題を噛み砕いて紹介する事が一番なのですが、ここは当代きっての怠け者のこの私。あいにく人様に見て頂くほどのテクニックも知識も持っておりません。

そんな中「何か人様に見て頂いて恥ずかしくないモノは」と考えると「そういえば(僕は)結構多くのweb制作系のサイトを見ているんじゃないだろうか」と思ったわけです。

以前から日課としてRSSを1日500前後ほど読んで、そして後々参考になりそうなブログ記事をはてなブックマークで保存して歩くという行為を繰り返していました。ヘビーブックマーカーからしてみればRSSの消化が1日500前後というのは特に多くなく、普通の人からしたら暇人と思われる程の中途半端な数字ではありますが。

これをはてブとは違う形で吐き出す事で、誰かの役にたてないだろうか。もっと言えば「存在しなくても困らないが、存在してればそれに超したことは無い」という小さな存在感を示せないだろうかと思ったのです。

そんな中、ちょうど僕はその頃Twitterにはまっていまして「それなら僕のはてブをTwitterの人たちに見てもらおうか」と思ったのです。

とてもお粗末ではありますが、こうしてtwitterでのweb制作系ブログの紹介が始まりました。

長くなったので続きは Twitterで６ヶ月間web制作情報を配信してみた まとめ編 として分割します。

関連する投稿

• 美しい日本語フォントAXISの商用利用できる試用版
• 無料で商用利用可能なメールフォームやCGI
• 横幅960pxのグリッドレイアウト
• 携帯サイトを作る前に読むべき本
• 今風のグラデーションを使ったボタンを作る方法 – 基礎

Web ページを製作者が期待した通り描画するためにダウンロードされるべき、Web フォントを指定するための @ 規則を提供します。作成者が自身のフォントを提供できるようになるため、@font-face はユーザのコンピュータにインストールしているフォントの数に依存する必要性を排除します。mozilla developer center @font-face – MDC

という事になります。従来ならデザインされたフォントを使った見出しなどは画像で作っていたのですが、これによってテキストで表現出来るようになります。

しかし新しいブラウザでしか表示できなかったり、フォントの権利問題などによりなかなか使用しにくいものでした。

今回試したtypekitは権利周りがクリアなフォントを簡単に@font-faceとして使用できるというサービスです。

プランは無料のものから用意されており、気軽に使用出来るようになっています。(無料版はサイト右下にtypekitのバナーが出現)

ちなみに無料のTrialだと69種類(現在)の欧文フォントの中から２種類のフォントが利用できます。日本語のブログだと欧文フォントは２種類で十分な場合も多いのではないでしょうか。(残念ながら日本語フォントはありません)

設定も簡単で、typekit側が用意したJavaScriptのコード２行をheadに書き込んで、後はtypekit editerから反映させたいセレクタを指定するだけ。今回はブログタイトル(h1)とサイドバーの見出し(h3)に指定してみました。本当に10分くらいで作業が終了。

使用前

使用後

たった数分でこんなにも見出しの印象が変わりました。しばらくこのまま使ってみようと思います。

参考
typekit
TypeKit で広がる Web デザインの可能性 | WWW WATCH
詳しく解説してくれています。

関連する投稿

• 美しい日本語フォントAXISの商用利用できる試用版
• 無料で商用利用可能なメールフォームやCGI
• 横幅960pxのグリッドレイアウト
• 携帯サイトを作る前に読むべき本
• 今風のグラデーションを使ったボタンを作る方法 – 基礎

しばらくはネタリストに溜まったままのWebデザイン系ブログ記事のまとめや、日記が多くなると思いますがよろしくお願いします。

今回は海外のミニマルなwebデザインのまとめです。まずミニマルとは。

ミニマリズムとは美術・建築などの造形芸術分野において、1960年代のアメリカに登場し主流を占めた傾向、またその創作理論であり、最小限（Minimal)主義（ism）から誕生し、必要最小限を目指す手法である。
ミニマル – Wikipedia

必要最小限のデザインということで、シンプルなイメージとタイポグラフィのバランスが大切になってきます。

タイポグラフィが大切といえば、先日モジックスZeroジャンキーさんがまとめられた”ウェブデザインの95％はタイポグラフィ”というエントリーも参考になるかもしれません。

＜インフォメーションデザインとは、タイプフェースの善し悪しを論じることではありません。タイポグラフィの善し悪しの話なのです＞。

＜優れたウェブデザイナーであれば、テキストを単なるコンテンツとしてだけではなく、ユーザーインターフェイスとして扱うことを知っているはずです＞。

ウェブデザインの95％はタイポグラフィ – Zopeジャンキー日記

詳しくは引用元を読んでいただくとして、このような考え方こそが素晴らしいミニマルデザインのサイトを作る近道なのかもしれないですね。

40 Killer Minimalist Blog Designs

40人のミニマリストのブログデザイン

100+ Clean, Simple and Minimalist Website Designs
100+のシンプルかつミニマルウェブサイトのデザイン

60+ Beautiful Websites Showcasing Minimalist Design
60以上のミニマルデザインの美しいウェブサイトです

Webdesign Trend Hunting – 27 Bright Websites Using Popping Colors | Inspired Magazine
ポップな色を使った27のウェブサイトです。明るい色を使ったミニマルなサイト集

35 Marvelously Minimal Websites | Design Shack
35の驚くほどミニマルなウェブサイト

minimalsites | minimal design website gallery
ミニマルなデザインのウェブサイトを集めたウェブサイト。

10 Super-Simple Web Designs | Web Design Blog
とてもシンプルな10のウェブサイト

20 Light Minimalistic Website Designs
20のライトなミニマルなウェブサイト

70 Typographic, Clean And Minimalist Color Scheme Web Designs
70のクリーンでミニマルなカラースキーム(色彩設計)のウェブサイト

35 Beautiful Minimal Websites – Part 6 | Vandelay Design Blog
35の美しいミニマルなウェブサイト

40 Beautiful Examples of Minimalism in Web Design
40のミニマリズムなウェブデザインの美しい例

40 Stylish, Minimal and Clean Free Wordpress Themes : Speckyboy Design Magazine
40のスタイリッシュでミニマルでクリーンなWordpressのフリーTheme

20 Examples Of Dark & Minimalist Website Designs With Great Typography | Spyre Studios
20のダークでミニマムな素晴らしいタイポグラフィのウェブサイト。

50 Minimal Sites | Web Designer Wall
50のミニマルなウェブサイト。

35+ Websites with Minimal Color Schemes | Vandelay Design Blog
35以上のミニマルなカラースキームのウェブサイト

関連する投稿

• 美しい日本語フォントAXISの商用利用できる試用版
• 無料で商用利用可能なメールフォームやCGI
• 横幅960pxのグリッドレイアウト
• 携帯サイトを作る前に読むべき本
• 今風のグラデーションを使ったボタンを作る方法 – 基礎

まじっくまうす？何それって人はこれを
アップル – Magic Mouse

こんな感じです。マルチタッチ対応って所が新しい所です。

とりあえず梱包されてる箱を開けてみた。スポンジでしっかり保護されてます。

箱から出してV550と並べてみました。全長はV550より長いですが、とても薄いです。実は先週末に某電気店でペタペタ触ってきたので薄々は感づいていたんですが、薄すぎてちょっと使いづらいです。何より単三電池２個で動いているので、見た目よりも重量感があります。重心が低いこともあって、マウスを指先でつまんで動かす人はいっそう重たく感じるかもしれません。しかしここら辺は慣れの部分だと思いますし、しばらく使えば問題ないでしょう。

一番厚い所で一円玉と同じくらいの厚さです。

なにより、スクロールがスルスル動いて気持ちいいです。本来ならホイールをコリコリと回してスクロールするのですが、MagicMouseだとマウスを人差し指で撫でるだけでススーっと動いてくれます。スクロールの動き方は好みによって慣性の有無を選ぶ事ができるのですが、慣性をつけると面白いようにヌルヌル動きます。

ただ、マウスで出来る操作がそう多くない事や、中央ボタン(MightyMouseだとスクロールボール？)が無いというのはかなり大きいです。Exposeやアプリの切り替えなど、便利な機能がマウスから使う事が出来ないのでMightyMouseや他社の多機能マウスを使用している人は少々不便に感じるかもしれません。

さすがにマルチタッチトラックパッドと同機能でとは言いませんが、せめて二本指上下の動きを感知して好きな機能を割り振れるようになればなぁと思います。

現状の感想としては「普段使いならあり」という感じでしょうか。仕事となると沢山のソフトを起動させたまま切り替えて使う事の方が多いですし、多ボタンマウスやMacBookなどのマルチトラックパッドのような使い心地を求める人には今の所むいてないのではないでしょうか。

とまぁ、ごちゃごちゃ言いましたが個人的には結構好きです。もしかしたら今後感想が変わるかもしれないので、そのときは力一杯褒めたいと思います。

ちなみに裏側はこんな感じ。裏側だけを見た人が「なにこれカメラ？」と言ってました。

カバーを外すと電池がこんにちは。こうやって見ることで、やっと単三電池が二本はいってる事を実感しました。カバーは結構ペランペラン。

関連する投稿

• マウスに早速エアパッドソールを貼ってみた。
• Mac Book Proが届きました

まず裏返します。今回はソールの交換なので裏側の黒い部分をまずは剥がします。僕も初めてのときは結構勇気がいりました。しかし今回は二回目なので迷い無く。

メリメリメリッっと。

本来は故意に剥がすような場所じゃないので結構剥がしにくいです。ピンセットなど薄くてヘラの代わりになるものを使うと剥がしやすくなります。

剥がし終わったらエアパッドソールをペタペタペタと貼ってしまえば完了です。

貼り終わった後のマウスは冗談抜きによく滑ります。ノーマルのソールの約三倍(※当社比)くらい滑ります。すっごい滑るよ！の世界です。さっきまでは「このマウス重いなぁ」と思っていたのが「あー滑りすぎて確実にクリックできねぇ」レベルまで変化します。

当然ながら(マウスを動かすのが)重い状態から滑るように軽くなるので、使い心地に慣れるまではちょっと違和感がありますがすぐ慣れます(ソースは俺)。

きっとネットやPCが好きな僕みたいな者は、人生で一番長く握っていたモノが彼女の手ではなくマウスになるわけですし、少しでも軽い方が疲労も溜まりにくいんじゃないかなーと勝手に思いながら慣れていこうと思います。

いやーそれにしてもよく滑る。

[補足]Appleの純正マウスやlogicoolの一部マウスには専用のソールも発売されていますので、もしお買い求めの場合はそれを選んでみるのも良いかもです。

関連する投稿

• Magic Mouseが届いたからちょっと使ってみた
• Mac Book Proが届きました

(左からV550, VX Revolution(以下VX R), MX 620)

今回買ったのは一番左のV550です。

これに決めた理由はMac Book用のマウスということで、レシーバーが小さいマウスが欲しかったからです。レシーバーを装着すると。

こんな感じでちょこんと頭が出る程度なので、あまり気になりません。

ちなみに一番上の写真に写ってるマウスのレシーバーを比べると

(左からV550, VX R, MX 620のレシーバー )
という感じになり大きさは一目瞭然だと思います。Logicoolのマウスだらけなのは、MicroGearの使い心地が大好きだからです。

“新開発ホイール： MicroGear™プレシジョンスクロールホイール

MicroGearプレシジョンスクロールホイールは、2つのモードによって、容易なナビゲーションを可能にします。新開発のフリースピンモードを使用することで、長文の文書でも思ったとおりにすばやく移動することができます。
〜省略〜
スクロールした短い移動単位ごとに馴染みのあるフィードバックが得られるため、ユーザーは、リスト、スライド、個別のイメージなどを精確にナビゲートできます。
Logicool製品紹介より引用”

V550を使ってみての第一印象は「見た目感じより重い！」でした。よく調べもせずに小さいマウスなのでVX Rとおなじ単三電池1本かと思っていたら、実は二本使用だったので予想より重かったです。

またVX Rのような手のひらにフィットするように作られたマウスに手がなれているせいか、手のひらとマウスの間の空間が気になります。しかしまぁこれは慣れでしょうね。

ちなみに上の写真の左に写ってるMX620は握り心地自体は良いんですが、いかんせん僕の手には大きいのと単三電池2本というところで大きくて重くイマイチな感じでした。またVX Rは持ち運び時にレシーバーをマウス内に収納する事ができるのですが、VX Rより大きいボディのVN620でそれが出来ないというのもマイナスポイントです。

ちなみに僕はマウスを指先でつまみ手首を支点にして操作する人なので、手のひら全体で操作する人と比べるとマウスの重さが最大のネックとなります。

しかしうちのMX620は、ノーマルのソールを外してエアーパッドプロについてきたエアパッドソールを付けてからはネックだった重さ問題もいくぶん軽減しました。

↑の写真の白いやつ。これを付けると、マウスがまるで机の上を滑るような感じになって手首への負担が減るのでオススメです。

ちなみに一番上の写真に写ってるマウスパッドがエアーパッドプロなのですが、ソール単体でも十分な効果が得られます。（ソールは消耗します。一回張れば1〜2年持ちますが）

ちなみに僕のオススメはVX Rです。ボディは小ぶりで手にフィットし(まぁここは人それぞれですね)、MicroGearはもちろんZoomも合わせると8ボタンと多機能で、なんと単三電池1本なので重さが気になりません。ちょっとレシーバーが大きいですけどね。

とりあえずV550もクリップ&ゴー システムなる便利なもの(マウスをひっかけるドックを新品のMac Bookに貼る勇気が無いので僕は使ってませんが)もありますし、レシーバーが小さいという点だけでもノート用マウスとしては満足です。

関連する投稿

• 関連する投稿はありません。

なぜ今ごろまたMacが欲しくなったかというと、きっとiPhoneを買ったからでしょうね。iPhoneを使ってると何故か無性に欲しくなってしまい、今月初めにMac Book Proの新しいラインナップの発表に背中を押され、気がついたら電気屋さんで注文してしまいました。

13インチの2.53Ghzを買いました。思ってたより箱が小さくてビックリです。僕の中でMacはOS X 10.1.8で止まったままなので色々覚えることが多くて大変ですが、また１から勉強していこうと思います。

ちなみにキーボードはUSにしました。

KeyRemap4MacBookで設定を変えれば困ることはなさそうです。

これからはMacネタも何か書けたらいいなぁと思います。

関連する投稿

• マウスに早速エアパッドソールを貼ってみた。
• Magic Mouseが届いたからちょっと使ってみた
• iPhoneを買いました

30 Inspiring Web Design Layouts from deviantART

40以上の美しいポートフォリオ

Web Designer Help » Over 40 Beautiful Portfolios

人気のあるwebデザインのトレンド

A Showcase of Popular Web Design Trends | My Ink Blog

50以上のオフィス用品を使った美しいwebデザイン

50+ Beautiful Website Designs Using Office Stationery | Showcases | instantShift

25の教育機関に相応しいwebサイト

25 of the Best Websites for Educational Institutions | Vandelay Design Blog

30の自然からインスパイアされた美しいwebデザイン

30 Beautiful Web Designs Inspired by Nature

webデザインにおいてのミニマリズムの美しい例40

40 Beautiful Examples of Minimalism in Web Design

50の素晴らしいwebサイト

50 great websites designs for your inspiration | Design daily news

35の教会のwebサイト

35 Amazingly Well-Designed Church Websites | Spyre Studios

40の素晴らしいNPOのwebサイト

40 of the Best Websites of Non-Profit Organizations | Vandelay Design Blog

とりあえず今日はここまで。
ちなみに日本のサイトのお勧め実例集はこちらです。
実例だから使える「ウェブデザイン見本帳」 | Commit Lab

関連する投稿

• 美しい日本語フォントAXISの商用利用できる試用版
• 無料で商用利用可能なメールフォームやCGI
• 横幅960pxのグリッドレイアウト
• 携帯サイトを作る前に読むべき本
• 今風のグラデーションを使ったボタンを作る方法 – 基礎

特にオフ会的なノリや趣味の繋がりの場の場合では、自己紹介がてらに名刺のような物があった方が都合が良いのですが、会社の名刺はちょっといやらしいかなと思ったりして結局渡せなかったり。逆に自営業やフリーの人は業務の名刺をガンガン出すべきとは思いますけどね。

そんなわけで、いつか自分の名刺を作る日の為に参考になりそうなサイトを集めてみました。クオリティが高すぎて名刺とは思えないものばかりです。

やはりデザイン関連の仕事をしている以上、相手方に渡したときにインパクトを与えられる遊び心のある名刺を持ちたいなと思います。皆さんも名刺を作るときには参考にされてはいかがでしょうか。

2009年4月のクリエイティブな名刺30

30 new business cards – Best of april 2009 – FrancescoMugnai.com

2009年5月のクリエイティブな名刺25

25 new business cards – Best of may 2009 – FrancescoMugnai.com

大胆な色使いの名刺15

15 Boldly Colored Business Cards | Web Design Ledger

50人のグラフィックデザイナーの名刺

50 Creative Business Cards of 50 Graphic Designers | The Design Cubicle

60+の美しくクリエイティブな名刺のデザイン

60+ Most Beautiful and Creative Business Cards Design | Naldz Graphics

クリエイティブな名刺100

100 (Really) Creative Business Cards | Webdesigner Depot

関連する投稿

• 美しい日本語フォントAXISの商用利用できる試用版
• PSDで配布中のプロダクトやアイコン等のまとめが凄い

その一部抜粋です。

xbox360

iMac

iPhone-3G

抜粋元
110 Ultimate Round-Up of Free Photoshop PSD Files and Resources | Showcases | instantShift

どれも写真かと思うほどの出来栄えです。僕も彼らに少しでも近づけるように彼らのPSDファイルで勉強しようと思います。

関連する投稿

• 美しい日本語フォントAXISの商用利用できる試用版
• 今風のグラデーションを使ったボタンを作る方法 – 基礎
• [フリー素材] iTunes(というより缶バッチ？)テイストの国旗素材2 – 商用利用可
• [webデザイン]カンプ用　IEベースの詰め合わせPSD
• 無料で商用利用可能なメールフォームやCGI