ウェブデザインの基本原則からPhotoshopの実践的なテクニックまでが学べる無料のeBook -Pixel Perfect Precision

思わず、これ無料なの？！というくらいの充実した内容、そして美しいレイアウトで構成されたウェブデザインのテクニックが学べるeBookを紹介します。

ウェブデザイナーをはじめ、ディレクター・アートディレクターなどウェブデザインに携わる全ての人に役立つと思います。

The ustwo™ Pixel Perfect Precision Handbook 2

Pixel Perfect Precisionはデスクトップ用のPDFやiPadなどのiBook用のフォーマットで配布されています。

iBookにも対応

内容は、簡単に言うとノンデザイナーズブック（Amazonで見る）のウェブに特化した感じで、完璧な精度のピクセルにどのようにデザインするかがテーマになっています。

ページ数は全部で165ページ、配置の基本原則、可読性を考慮したテキスト、カラーマネジメントなどをはじめ、ファイルの効率的な管理方法、Photoshopでのウェブに最適な初期設定、レイヤー管理、Illustratorのウェブで使える実践的なテクニックなど、満載の内容になっています。
テキストは英語ですが、各ページキャプチャ付きなので、デザインの知識が多少あれば充分に理解できると思います。

全ページ、オススメですが、その中からいくつか紹介します。
ページ内のサンプルは基本的に、左がダメな例、右が良い例です。

第1章 Pixel Perfect Principlesでは、パーフェクトなピクセルを作成するための基本原則。
P-5: 完璧な精度のピクセルでデザインするためには、まずエッジが大切。

P-6: 配置の基本原則、エレメントの配置だけでなくスペースにも配慮。

P-11: カラーと形状がマッチしてないとダメ。

第2章 Pixel Perfect Detailsでは、ボタンやリンクなど具体的な事例を元に解説。
P-18: カラーモデル。

P-22: ボタンにテキストを配置する際に注意する点。

P-23: オブジェクトに対してテキストを配置する際の注意点。

第3章 Accessibilityでは、情報にアクセスしやすいコンテンツやナビゲーション、タッチデバイスを配慮したデザイン、色のみでなく代替となる要素で情報を伝えるなど。
P-65: アクセシビリティを考慮したカラー設計。

P-68: Photoshopでアクセシビリティのチェック。

第4章 Photoshopでは、ウェブ制作におけるPhotoshopの作業効率をアップするさまざまなチップスを紹介。
P-73: Photoshopのウェブ制作用の設定方法。

P-74: 書き出しの時の注意点。

P-77: シェイプレイヤーの効率的な使い方。
この章（Photoshop Pixel Precision）は、すぐに役立つ実践的な使い方がかなり充実しています。

P-115: Photoshopでレイヤー管理する時に気をつけたい名前の付け方。

P-127: ファイルサイズの軽減方法。
この章（Photoshop Organisation）もすぐに使えるテクニック満載で、中級者向け。

P-137: ロゴのバリエーションを簡単につくる方法。
この章（Photoshop Tips）ではちょっと面白いPhotoshopの使い方がいろいろ。

P-139: ドットを使った簡単に作成できるパターンの作り方。

P-140: Kulerを使ってカラースキームを設計。

P-155: Illustratorも少しだけ掲載があります。