↑（画像クリックで拡大）

こんな感じに仕上がります♫もちろん、そのままでも良いのですが、自然な感じをカモし出す為にチョッと一工夫すると見え方も違ったモノになりますよね。

フェイドアウト処理もこんなに簡単!!

フェイドアウト処理をする前の画像はこんな感じ。

↑（画像クリックで拡大）

全然綺麗ですし問題は何もありません。しかし、ヘッダー画像として作成する場合チョッとした工夫でも感じや見え方・印象が随分と変わってきます。画像は別タブで開きますので見比べてみて下さい。

今回もPixlrを使ってみました。新しい画像を開く場合は、「透明（透過）」を選択すると後々の処理が簡単です。

今回は、分かりやすい様に背景を白（グラデーション）にしてあります。実際に作成する場合は、あなたのサイトのイメージにあわせたカラーを選択して下さい。（カラーパレットで簡単に設定出来ます）

そして、背景を塗りつぶす場合には、それと同じ色を使います。また、サイトの背景色と同化させる場合には、その色のカラーコードを取得して下さい。

この辺りが難しい分からないって方は、スルーして背景色をPixlr上で選択すればOKです。

さて、では実際の処理に入ります。「新しい画像（ヘッダー画像のサイズに設定）」を開き「背景に使いたい写真等」を開きます。そして、「カラーパレット」で好きな色を選択して下さい。

↑（画像クリックで拡大）

お好きな色を選択したら、そのままメインのレイヤーを塗りつぶしてOK!!グラデーションにする場合は、フェイドアウト処理する画像の大きさとグラデーションがかかる場所に気をつける必要があります。

ですから初めは、塗りつぶしで練習してからグラデーションに移った方が良いかもしれません。

塗りつぶしたら、ヘッダー画像に使いたい画像のサイズを調整してコピーして貼り付けて下さい。

↑（画像クリックで拡大）

実際のフェイドアウト処理

移動ツールでお好きな場所に移動して頂いてOKです。最後に端をボカしてフェイドアウト処理します。コレは、ブラシツールを仕様します。

↑（画像クリックで拡大）

色々なブラシ（形状）があります。また、大きさやその他様々な設定が可能です。今回はフェイドアウト処理だけなので、そのままの設定で仕様していきます。（試しに色々とイジってみて下さい。）

メインレイヤーにマウスカーソルを移動すると、丸印が現れると思います。そこで一度クリックしてみて下さい。何かが吹きつけられた様な感じになると思います。（編集の取り消しで消せますので安心して下さい。）

確認できましたら、実際のフェイドアウト処理をしていきます。処理自体はメインレイヤー上（見かけ上）で行いますが、実際に処理を施すのは画像が載っているレイヤーです。（ココが注意したところ!!）

↑（画像クリックで拡大）

上図の右中央（赤丸部分）、レイヤー0が背景（白塗りつぶし）です。そして、レイヤー1が処理をしたい画像が載っているレイヤーです。青くなっているレイヤーが、今選択しているレイヤーとなります。
（※ちなみに、レイヤー①のチェックを外してみて下さい。メインレイヤーから画像が消えたと思います。この様に、いくらでもやり直しが出来ます。）

後々画像を少し動かしたいって時に、レイヤー0で処理してしまっていると画像だけが動いてフェイドアウト処理が下に残ったままになってしまうのです。ですから、処理する際には、必ず処理したい画像のレイヤーを選択してから行う様にしましょう。

また、レイヤー上にマウスを載せてスクロールさせると、画像の拡大縮小をしてくれます。今回の様に細部を処理する場合にはとても助かるんですね。

拡大・縮小をしながら、写真の端にブラシを吹きつけていくだけの作業となります。この時、もう少し大きなブラシで簡単に処理したい場合は、先ほどのブラシをクリックしてブラシサイズを「70」や「100」にして吹きつけてみると良いでしょう。

上から下まで吹き付けたら、元のサイズに戻して見てみましょう。

↑（画像クリックで拡大）

なかなか良く仕上がっています（笑　この状態ですと、写真（処理した画像）をレイヤー上で動かしても処理と一緒に動く事がお分かり頂けると思います。

下地の背景と写真（画像）とを自然に一体化させるフェイドアウト処理でした。

【違いをもう一度】

処理前

↑（画像クリックで拡大）

処理後

↑（画像クリックで拡大）