Part:1 ポートフォリオサイトの作り方-制作工程

2021年6月16日2025年4月2日

ポートフォリオサイトとは、自分をアピールするためのプロフィールや、今まで作成した制作実績や課題などを掲載したWEBサイトのことです。就活やフリーランスで活動する場合は必須のアイテムといえます。

「WEBサイトの作成ができます！」と言っても、相手はあなたが、どういったサイトを作れるのか？デザイン力があるのか？あなたの実力を測ることができません。
また「制作実績はありますか？」と言われた時に、待たせることなくデザインを掲載したウェブサイトのURLを相手に送ってすぐにその場で、制作実績を見せることができるようになります。

Webサイトのポートフォリオの制作行程

掲載する内容を決める（Worksワークスの準備）
デザインカンプの作成
HTMLのマークアップ（レスポンシブサイト用のコーディング）
CSSを使ったデザイン指定（レスポンシブサイト用のコーディング）
JavaScript を使った動的な表現
サーバーにアップロード（公開）

魅力的なポートフォリオを作るために

ポートフォリオとは、本来「紙ばさみ」や「書類入れ」を指す言葉ですが、クリエイターにとっては 「自分の作品をまとめて、相手に見てもらうツール」 です。かつては、デザイナーやアーティストが作品を持ち歩いて営業をしていましたが、現在では ポートフォリオサイト を作成し、オンラインで作品を発信するのが一般的です。

ポートフォリオサイトの役割は 「作品を見せる」ことだけではありません。閲覧した人があなたのスキルや魅力を理解し、「この人に依頼したい！」と思えるように構成することが重要です。そのために、最低限 以下の4つの要素 を含めましょう。

プロフィール（自分が何者なのかを伝える）
作品（実績やスキルを示す）
スキル紹介（できることを明確にアピール）
連絡手段（問い合わせやオファーを受け取れるように）

何を掲載する？作品作りのポイント

作品は 多いほどアピールになります が、ただ数を並べるのではなく 質を意識 することが大切です。

実務の作品
　過去に制作したデザインカンプやコーディングしたサイト、マーケティングの戦略資料などを掲載しましょう。ただし、 クライアントワークの場合は事前に許可を得る ことを忘れずに。
オリジナル作品（練習・自主制作）
　もしまだ実績がない場合は、 就活や営業のために新たに作成したもの を掲載するのも有効です。例えば、架空のWebサイト、バナー、ロゴなどを制作し、ポートフォリオに加えましょう。