この記事を読むのに必要な時間は約 7 分です。
Photoshop(フォトショップ)でWEBサイトのデザインを作るとヘッダーやフッターといった共通パーツが出てきます。
トップページ、会社概要、事業内容、採用情報、問い合わせ等、複数のPSDファイルを作成して各PSDにバラバラと共通パーツを入れると変更した際に全てのPSDを変更する必要が出てきます。
…面倒くさいですよね。
ヘッダーはヘッダーだけ入れたPSDを作成、フッターはフッターだけ入れたPSDを作成し、別のPSDに共通パーツ用のPSDを配置すると、共通パーツの大元となるPSDを変更すると全てのPSDの共通パーツが更新されます。
WEBでもよく使う共通部分のインクルードをPhotoshop(フォトショップ)の「リンクを配置」で行い、効率的に作業を進める方法について例を交えながら詳しく解説します。
では早速始めていきましょう!
この記事の目次

もしも共通化せずに10ページ分のPSDをそれぞれ作成し、ヘッダーだけ少し変更を入れると10全てのPSDを手直ししないといけません。
…めんどくさい。

他は何も入れません。
名称は「header.psd」等にしておきます。
同様の手順でフッターなら「footer.psd」、左メニューは「rightmenu.psd」等にしておきます。
PSD内に別のPSD(先のheader.psd)を読み込ませる方法について解説します。

サンプルの名称はcontents.psdにしています。
※全てのPSDは同じフォルダにまとめておきます。




便利!
リンク配置すると左図のようにレイヤーパネルに鎖アイコンが表示されます。

サンプルファイルを参考にすると、さらに理解が深まりますよ!
以上、Photoshop(フォトショップ)で作成したPSDに別のPSDをインクルード(リンクを配置)する方法でした。
WEBのカンプをフォトショで作成する際に役立つ方法の一つです。
ページ数が多いとヘッダーのちょっとした修正でも手間が掛かるので、共通化して無駄な工数を減らしましょう。
その浮いた工数を品質向上に費やすとさらに良い感じになる事間違いなしです!
ではまた!
Photoshop(フォトショップ)を持っていない方は、下記から最安値で購入できます。
オススメはコンプリートプラン
単品よりも圧倒的にお得で便利なCreative Cloudコンプリートプランがオススメです。
アプリ単体を2つ3つ使うと費用がコンプリートプランと同等かそれ以上になります。
制作はPhotoshop、Illustrator、Lightroom、InDesign、Acrobat、etc…複数のアプリを使い分けながら作る事が多いです。
Photoshopで作業をしている際に「Illustratorなら効率的に作れるのに…」、「完成したデザインをPDFで複数ページに冊子形式にしたいなぁ…」という事は頻繁にあります。
なのでデザイナーにとって最低限Photoshop、Illustrator、Acrobatは必要です。
それならいっそ初めからコンプリートプラン
を選択する方が断然便利でお得ですよ。
学生・教職員なら
学生や教職員の方にオススメなのが
65%OFFはデカイですね!
アプリ1本分の価格で全てのAdobe製品が使い放題!
Photoshop単品ならフォトプランが最安
Photoshopを使うならAdobe公式の
フォトプラン
が一番お得です。
Photoshop単体の半分以下の価格で、尚且つLightroomもセットになっているのが嬉しいですね。
※アマゾンや他の通販サイトのフォトプランだと、不要なオンラインストレージが付いて倍くらいの価格です。Photoshop自体の最安はAdobe公式サイトの
フォトプラン
なので気を付けてください。
ゼロから始めるPhotoshopのもくじです。


















