Monthly Archives: 4月 2009

実例だから使える「ウェブデザイン見本帳」

0
Filed under Design

webサイトを作るときに、クライアントや制作以外のスタッフの「こんなデザインが欲しい」という期待や要望と、デザイナーの「こういうデザインが良いだろう」という考えをお互いに認識し共有すのはとても大切です。

それが満足に出来ていない場合は、打ち合わせが終わってカンプを作っても、相手は出来上がったカンプを見て初めて「自分の理想との間違い探し」をはじめるので、必然的にデザインの修正変更が増えてしまいます。

そういうお客様、または社内の人間との打ち合わせに役に立つのが、ウェブデザイン見本帳です。

ウェブデザイン見本帳の目次は6つあり、part2からpart6までは「たくさんの要素でにぎやかなページ」「余白を使って心地よいページ」など約110個以上のテーマに別れています。 基本的に実例とその解説が中心ですが、細分化したテーマでも複数の例を載せてくれるが素敵です。

ページの例

この本が優れているのは、よくある「カッコいいけど例が英語のサイト集」や「主にデザイン学習用に作った存在しないサイト集」の本とは違って、実際に存在する日本企業のwebサイトだけを収録しているので、相手に対して説得力があるというところです。

ネットで取り上げられているカッコいいサイトでも、中小企業のコーポレートサイトで直接参考になるのはそう多くありません。 それはクリエイティブなサイトと中小企業のサイトでは求められるものが違うからです。

またデザインの決定権を持つのが、どちらかと言うとネットやデザインに疎い人である場合が多いので全体的に新しい見せ方は敬遠される事が多いです。

なので実用的なデザインが必要な場合は、実際に存在する日本語のwebサイトを集めたこの本は役に立ちます。

もちろん本来はwebデザインを学ぶための本なので、純粋に勉強用に買うのもオススメです。僕はそのつもりで購入しました。この本は純粋なwebデザインについての本なので、ソース等はありません。そこは実際に見に行った方が早いですしね。

webデザインを勉強したい方や、デザインの修正変更の多さに困ってる方は打ち合わせに使ってみてはいかがでしょうか。

ウェブデザイン見本帳 実例で学ぶWebのためのレイアウト基礎

著者/訳者:オブスキュアインク

出版社:MdN( 2008-11-21 )

定価:¥ 2,625

Amazon価格:¥ 2,625

大型本 ( 160 ページ )

ISBN-10 : 4844360167

ISBN-13 : 9784844360162


ロゴ制作の参考になるサイト

0
Filed under Design

現在サイトテーマを作り直すにあたり、サイト名のロゴを作っています。ロゴを作る機会があまり無いので、書いては消して書いては消してを繰り返してます。

そんな自分の為に、ブックマークから最近のロゴ関連のものを引っ張り出してみました。

SMASHING-Beautiful And Creative Logo Designs For Your Inspiration
美しくてクリエイティブな40個のロゴが掲載されてます。

SMASHING-Drawing Inspiration From Creative Logos
こちらも同じくSMASHINGから。48個のロゴが掲載されてます。

1stwebdesigner-Logo Design Trends 2009 – Showcase
2009年のロゴデザインのトレンド。54個

30 Dual Element Logos, Do You See Them All?
二つの要素を持つロゴ30個。

The Top 30 Photoshop Text Effects Tutorials of 2008 – Which is the Best?
2008年のPhotoshopチュートリアルベスト30。チュートリアル系ですが参考になります。

40 plus Colorful logos
カラフルなロゴがいっぱい。

23 Inspiring Blue Logos
青系のロゴが23個。

LogoPond
ロゴを投稿して評価するサイト。量が半端ないです。

Logo Of  The Day
日替わりでロゴを紹介してくれます。RSSリーダーに入れてると毎日楽しみです。

LogoFaves
ロゴを評価するサイト。いっぱいあります。

54 Kick Ass Creative Logos Hand-Picked from Logofaves
上のLogoFavesからチョイスした54個のクリエイティブなロゴ。

LOGOFI
ロゴの投稿サイト。参考になりそうなのが沢山。

http://www.chillink.com/
ロゴの販売サイト。見ることは出来るので参考になる。

よーし、なんかこれだけで自分のロゴを作ったような気がしてきた。
ロゴ作りは明日やろう・・・

wordpressのアップデート失敗・・・か?

0
Filed under wordpress, 日記

wordpress
先日久しぶりにWordpressのアップデートをしました。ずっと2.4のままだったのでそろそろアップデートしないとなーとは前々から思っていたのですが、仕事とゲームに忙しくて・・・。

それでまぁXBOXのテイルズ オブ ディスペリアも一応クリアしたし(まだやってました)、やる事無いからやっとくかーというノリでアップデートしてみました。

念には念を押して、DBのバックアップを取り、プラグインからもバックアップを保存。

とりあえずやる事やったからと、FTPにwordpress2.7.1をぶち込んで放置・・・。

そしてそのままiPhoneをいじること5分ほど・・・。

あっ、プラグインを全OFFにしてない!

しかもテーマをdefaultに戻してない!

結果的になんか調子がおかしいです。またテーマもいじる必要があるので、新しいテーマを作るまでSandboxを使わせてもらおうかと思います。

前よりこっちの方が断然良いよねってのは言わない方向で。

iPhoneを買いました

0
Filed under iphone, 日記
iphone

もう2週間くらい前になるんですがiPhoneを買ってきました。関東では一括で1万円前後のような話をチラホラ見ますが、地方というか僕の住んでいる地域では19800円が一番安かったです。そのかわりなのか車で充電できるFMトランスミッターやケースなどのアクセサリ類を色々もらいました。

6月に新しいiPhoneの発表が・・・などの話もあるみたいですが、試しに実機を触るだけのつもりがそのまま契約しちゃいました。先日発表があったOS3も使えるようでし、まぁいいかなぁと。
「サイトを作るなら環境は古い方が良い」なんて強がってもみましたが、安くなったから買ったのはバレバレですけどね。

それで最近iPhone用のwebサイトを作ってみたりして遊んでいます。特定の機種や環境に絞ってサイトを作った経験がないので楽しいです。

結構HTMLの書き方が違うのでまだまだですが、safariの独自仕様やHTML5の勉強にもなりそうなんでボチボチ続けていこうと思います。

それにしてもサイトの見た目はなんとなく作れるんだけど、肝心の中身は何を作ればいいものか。こういうときに何らかのwebサービスが作れると良いんですけどね。”はてな”で見た「デザイナとHTMLコーダーはネットの一番楽しい所を味わえない」みたいな意見もやっぱ一理あるなと思ったり。

まぁ僕の場合は作る技術が無いどころか、作りたいモノも思いつかないんでもっと問題外ですが。まぁアイデアが空から降りてくるまで、サイト作りの基礎知識は身につけておこうと思います。

今日入れたFirefoxアドオンのメモ

0
Filed under ブラウザ・アドオン

近頃、ゲーム用PCが不調でパーツを取り替えた。それに伴い、ちょうど良いタイミングなのでOSをクリーンインストールしてみた。

とりあえずゲーム用PCにはAdobe系のソフトが入ってないので、これで仕事をする事はない。しかしサイト確認用としては使うかもしれないので、Firefoxには仕事で使ってる、または使えそうなアドオンを入れてみた。基本的にサイト制作と情報収集に便利そうなものが中心です。

というわけで今日は本当にメモです。

Evernote Web Clipper
ブラウザ上で選択したテキストや画像をEvernoteにクリップしてくれる。

Firebug
ブラウザで開いてるページのCSSやHTML・JavaScriptを編集・デバック・モニタすることが出来る。

FireMobileSimilator
携帯端末のブラウザをシミュレートしてくれる。

ColorZila
ブラウザ上の色を拾えるカラーピッカー。

dragdropupload
ドラッグ&ドロップでファイルのアップロードができる。

Dust-Me Selectors
使ってないCSSセレクタを表示してくれる。

Html Validator
HTMLのバリデートをしてくれる。修正もしてくれるみたい…使いこなせてない。orz

Make Link
右クリックメニューでURLとページタイトルのコピーが一度に出来る。「このサイト見てください」ってときに便利。

MeasureIt
webサイト上で色んなものをpxで計る事ができる。

Pearl Crescent Page Saver Basic
webサイトのスクリーンショットが撮れる。違うのを使ってたんだけど、Flashも撮れるようなのでこっちに変更。

Search Status
PageRankやAlexaのランクを表示してくれる。他にも色々あるみたい。

SeoQuake
検索エンジンなどから、検索順位やその他のデータを読みこんで表示してくれる。

Snap Links Plus
右クリックを押しながら範囲選択することで、複数のリンクを新しいタブで開く。

Web Developer
サイト制作に役立つ機能満載。画像の表示を消したり、CSSを切ったり、ブロック要素を枠で囲んでくれたり多機能で書ききれない。最近では主にアクセシビリティチェックに飛ばす為に使ってるだけな気もする。
[追記] Web Developer1.16にハレルとかSEOとか

SBMカウンタ
開いてるページのはてなブックマーク・Delicious・Livedoorクリップ等の数字とコメントを表示してくれる。

Greasemonkey
便利な機能を追加してくれる。

以下Greasemonkeyのユーザースクリプト

Google Image Relinker with Mouseover
Googleイメージ検索で検索結果をマウスオーバーで見せてくれる。

G+?B
Google検索の検索結果でサイトのはてブ数を教えてくれる。

Google Analytics with SBM
Google Analyticsの参照サイトなどで、リンク元のはてブ数を教えてくれる。

AutoPagerize
Google検索など、複数ページがある場合自動で読み込んで表示してくれる。

他に何かオススメばあれば教えてください。