Webデザイナー必見！ポートフォリオサイトの作り方とポイント

まずは内容を考えよう

ポートフォリオサイトを作る際は、まず掲載する作品数や構成要素、掲載する項目と内容について考えましょう。いきなりサイトを作り始めるのではなく、掲載する内容を固めておくことで、スムーズにポートフォリオサイトを制作できます。制作実績が多い場合は、見る側の負担にならない量を考え、いくつか抜粋して載せるとよいでしょう。

また、ポートフォリオサイトを制作する前に、他の方のポートフォリオサイトをチェックしてみてください。レイアウトやカラーリング、構成要素などで気に入ったものがあれば、自分のポートフォリオサイトを考える際に参考にするとよいでしょう。

作品だけ載せても、相手には伝わらない

ポートフォリオサイトに、これまでに制作したWebサイトのタイトルとスクリーンショットだけを掲載しても、自身の能力をアピールするためには材料不足です。どのようなサイトを／どのくらいの期間で／どのようなデザインで制作できるかが伝われば、閲覧者も評価がしやすくなります。ポートフォリオサイトには、以下のような項目を掲載しましょう。

• 自分のプロフィール、スキルシート
• サイト名、サイトのURL、サイトのスクリーンショット
• 制作期間、自分が制作した箇所（デザイン、コーディング）、使用ソフト
• サイトのコンセプトやアピールポイントを簡潔にまとめた文章

採用担当者が知りたいことをイメージして、記載する情報を考えることがポイントです。ポートフォリオサイトを通じて、相手が求めている情報を伝えま しょう。採用担当者は同時期に大量のポートフォリオサイトをチェックします。長すぎる文章は最後まで読まれない可能性が高いため、要点は簡潔にまとめてください。伝えたい情報を見やすく、分かりやすくまとめる力も採用担当者は評価します。

また、ポートフォリオサイトに掲載する過去実績は、さまざまなジャンルのサイトを掲載することが大切です。企業のコーポレートサイトから一般消費者向けのライトな内容のサイトまで、案件の幅が広いことをアピールしましょう。

ポートフォリオサイトのレイアウトを考える

掲載する内容がまとまったら、ポートフォリオサイトのレイアウトを考えます。他人のポートフォリオサイトを見て勉強したり、自分の考えたデザインを知人に見てもらったりすれば、自分1人で考えるよりも良いデザインが浮かぶかもしれません。レイアウトを考える際は、見た目の美しさや機能性にこだわるだけではなく、相手にとって見やすいレイアウトを意識することがポイントです。

ポートフォリオサイトのレイアウトを決めた後は、コーディングを行います。その後、ポートフォリオサイトが完成したら、OSやブラウザの環境によっ て表示が崩れることはないか、記載内容に間違いがないかなどを必ずチェックしてください。問題がなければ、サーバーにアップロードしてポートフォリオサイトの完成です。

閲覧者を限定したい場合は、認証を掛けましょう。ベーシック認証という設定を行うことで、アクセスにIDとパスワードの入力が必要なWebサイトにすることが可能です。

また、ポートフォリオはWebだけではなく、プリントアウトして冊子にまとめておくことも重要です。紙のポートフォリオを持っていれば、面接の場で面接官に見てもらいながら自分のスキルをアピールすることができます。

おわりに

今回は、Webデザイナー必見のポートフォリオサイトの作り方の一例とポイントをご紹介しました。ここでは内容やレイアウトを決めてからコーディングしていますが、人によってはレイアウトを作ってから中身を決めていく方がスムーズに進むこともあるかもしれません。自分に合った進め方で、ポートフォリオサイトを制作しましょう。

Webサイトの必須スキルと最新技術

作品制作講座

Webサイトの企画からデザイン、コーディングまで、既定のWebサイトを制作しながら、実践で使えるスキルを学びます。