Webデザイナーとして「もっと仕事を獲得したい」「自分の強みを伝えたい」と感じているなら、ポートフォリオサイトが強力な武器となります。サイト作成には多種多様なサービスがありますが、WordPressを活用すれば、ゼロからサイト構築しなくても見栄えの良いポートフォリオを作成可能です。
本記事では、WordPressでのポートフォリオの作り方について、テーマ選びからページ構成、仕事につながるコツまでをWebデザイナー向けに徹底解説します。初めてポートフォリオを作る方も、既にあるサイトをブラッシュアップしたい方も、ぜひ参考にしてください。
WordPressがWebデザイナーのポートフォリオ作成におすすめの理由
WordPressは、デザインや構成を自分好みにカスタマイズしやすく、効率的に自分の個性やスキルを表現できます。テーマやプラグインを活用すればノーコードでも高度なサイトを設計でき、実績紹介ページやお問い合わせフォームも簡単に設置可能です。
またSEOにも配慮されており、適切に設定すれば自分の作品を検索エンジンで見つけてもらいやすいという特徴も。営業ツールとなるポートフォリオサイト経由で仕事を獲得できるのは、Webデザイナーにとって大きなメリットとなるでしょう。
WordPressは無料で始められるだけでなく、ネット上の情報が豊富なため、初心者でも安心して導入できるのが魅力です。ポートフォリオの作成で、ドメインやサーバー管理といったWordPressスキルを身につけておけば、将来的なクライアントワークにも役立ちます。
女性向けキャリアスクールSHElikes（シーライクス）では、プロのアドバイスを受けながらポートフォリオを作成できます。Webデザイナー向けの転職サポートも充実しているので、興味のある方は以下の記事でチェックしてみてください。
Webデザイナーに重要！WordPressポートフォリオサイト作成のポイント
WebデザイナーがWordPressでポートフォリオを作成する際は、いくつかのポイントを押さえることが重要です。
本章では、ポートフォリオ作成時に注意したいポイントを詳しく見ていきましょう。
表示速度の改善
ポートフォリオサイトの表示速度は、Webデザイナーとして仕事のチャンスに直結する重要な要素です。表示が遅いと訪問者にストレスを与えるだけでなく、SEO面や信頼性・ブランディングにも影響を及ぼす可能性があります。
表示速度が遅くなる原因としては「画像サイズが大きすぎる」「プラグインを多用しすぎている」などが挙げられます。画像圧縮プラグインを活用したり軽量なテーマを選定したりして、速度改善の対策を講じましょう。
セキュリティ対策
WordPressのサイトでは、不正アクセスや改ざんを防ぐためのセキュリティ対策が欠かせません。特に実績や個人情報を扱うポートフォリオサイトでは、安全性の確保が信頼構築につながります。
WordPress本体はもちろん、テーマやプラグインは常に最新バージョンに更新しておきましょう。ログイン試行制限も設定し、不正ログインを防ぐことが重要です。
またパスワードは複雑で長めのものを採用し、二段階認証を導入することでセキュリティを強化できます。万が一のトラブルに備えてバックアップ体制も整えておけば、安心してサイトを運営できるでしょう。
著作権・守秘義務
ポートフォリオに作品を掲載する際は、著作権や守秘義務に配慮する必要があります。無断でクライアントのロゴや内容を掲載すると、法的トラブルに発展するリスクがあるため、不特定多数の人が閲覧できるインターネット上のポートフォリオ公開には注意が必要です。
また画像の無断使用やコピーライト表記の管理にも注意し、サイト訪問者に信頼される内容にしましょう。掲載不可の場合は、守秘義務に関わる部分は伏せたうえで制作過程や使用技術などを文章で補足し、自分のスキルを伝えるのも有効です。
導線設計
WordPressでポートフォリオを作成するなら、サイト訪問者が迷わず目的の情報にたどり着けるよう導線設計も意識しましょう。訪問者は必ずしもすべてのページを見るとは限らず、見たい情報にすぐアクセスできるかどうかが離脱率を左右します。
具体的には、トップページから「実績」「プロフィール」といった主要コンテンツへのリンクを明確に配置するのがポイント。親カテゴリーと子カテゴリーを適切に分け、ユーザーが興味のある作品やページを段階的に絞り込めるようにするとよいでしょう。
また、スマホなどの小さな画面でも操作しやすいよう、レスポンシブ対応を行うことも大切です。導線設計が優れたサイトはユーザーの離脱を防げるだけでなく、問い合わせや依頼へとつながりやすくなります。
更新しやすい構成
WordPressのポートフォリオを更新しやすい設計にしておけば、常に最新の情報を発信できます。具体的には、カスタム投稿タイプやテンプレート機能を活用して、実績ページを簡単に追加・修正できるよう設計するのがおすすめです。
カテゴリーやタグによって作品を整えておけば、管理や更新もスムーズになるでしょう。更新頻度が高いサイトは、検索エンジンから評価されやすく、SEO面でも有利になります。
ポートフォリオの価値を維持するためにも、簡単にコンテンツの差し替えや追記ができる構成を意識してみてください。
WordPressでのポートフォリオの作り方！おすすめテーマも紹介
WordPressでポートフォリオを作る際は、以下のようなステップを踏む必要があります。
本章では、WordPressでのポートフォリオの作り方を詳しく解説します。おすすめのテーマも紹介するので、ぜひチェックしてみてください。
1.ドメイン・サーバー用意
WordPressでポートフォリオを作成するには、まずドメインとサーバーの用意が必要です。信頼性の高いレンタルサーバーを選び、ドメインを取得しましょう。独自ドメインを取得すれば、自分専用のURLを持つことができます。
サーバーを契約したらネームサーバー設定を行い、ドメインとサーバーの紐付けを完了させてください。WordPress本体のインストールは、多くのサーバーで簡単インストール機能が用意されているため、初心者でも迷わず進められます。
2.初期設定
WordPressのインストール後、管理画面へログインし、初期設定を行いましょう。以下の項目は、サイトの安定運用と公開準備のために重要です。
- サイトタイトルとキャッチフレーズ
- メールアドレス（管理用通知先）
- タイムゾーン
- パーマリンク設定
- SSL化（https:// 対応）
- 検索エンジンでの表示設定の確認（インデックス許可or非表示設定）
- コメントやピンバックの許可・非許可
- SNSや外部サービス連携用のユーザー名・プロフィール
- サイトアイコン（ファビコン）の登録
- デフォルトカテゴリーやタグの整理
- メディア設定（画像サイズや整理方法など）
- プライバシーポリシーページの設定または雛形作成
サーバー・ドメイン・WordPressの連携が適切に完了すれば、コンテンツの作成に集中できます。快適なサイト運用のためにも、これらの設定を忘れずに行いましょう。
3.WordPressのテーマ選定
WordPressのテーマは、サイトの見た目や機能性を大きく左右します。Webデザイナーのポートフォリオサイトの場合、デザイン性が高く、作品や実績を魅力的に見せられるテーマを選びましょう。
また、レスポンシブ対応やカスタマイズのしやすさも必須条件です。カスタマイズ性が高いテーマなら、自分だけの色合いやフォントを設定しやすく、ブランドイメージの確立に役立ちます。
無料テーマの中にも優秀なものはありますが、サポートの充実度や機能性を求めるなら有料テーマがおすすめです。
おすすめのテーマ
Webデザイナーの場合は、自分の感性やスキルを視覚的にアピールできるよう、ビジュアル重視のテーマを選ぶのがポイントです。Webデザイナー向けに、おすすめのテーマをまとめました。
- Fukasawa：画像メインのレイアウトで、シンプルかつ洗練されたデザイン
- LIQUID PORTFOLIO：無限スクロールに対応。ポートフォリオに特化したテーマで、短時間で構築可能
- Graphy：無駄を省いたミニマルなデザインが特徴。コンテンツが際立つ
- Noto：ポスターのようなレイアウトでデザイン性が高い
- Astra：軽量で高速なテーマのため、サイトパフォーマンスを重視したい人におすすめ
有料・無料ともにさまざまなテーマがあるので、比較検討のうえ目的に合ったものを選びましょう。
4.必要なプラグインの導入
ポートフォリオサイトの機能性や操作性を高めるには、プラグインの導入が欠かせません。WordPressでは、テーマだけでなくプラグインによって必要な機能を拡張できます。
プラグインには、セキュリティ対策や表示速度改善など用途に応じてさまざまな種類があるので、以下でチェックしてみましょう。
| 用途・機能 | おすすめのプラグイン例 |
|---|---|
| セキュリティ対策 | ・SiteGuard WP Plugin ・Akismet ・All In One WP Security & Firewall |
| 問い合わせフォームの設置 | ・Contact Form 7 ・WPForms |
| 表示速度の改善 | ・EWWW Image Optimizer |
| SEO対策 | ・Yoast SEO ・All in One SEO |
| ポートフォリオ専用の表示強化 | ・Portfolio Post Type |
ただし、プラグインを導入しすぎると表示速度が遅くなるため、本当に必要なものを厳選することが大切です。また、テーマとプラグインには相性もあるため、相性問題・互換性に関する情報を公式サイトやレビューで確認しておきましょう。
5.ページ構築
WordPressの土台を整えたら、実際にページを構築していきましょう。ポートフォリオの構成は「トップ」「実績紹介」「About（プロフィール）」「お問い合わせ」の4ページが軸になります。
| ページ | ポイント |
|---|---|
| トップページ | ・第一印象を決定づけるページ ・自分の強みや代表作が一目でわかるように作るのがポイント ・写真やキャッチコピーも効果的に配置し、興味を持ってもらう工夫が必要 |
| 実績紹介ページ | ・単に作品を並べるだけはNG ・プロジェクトごとの成果や担当範囲、こだわりのポイントを詳しく説明 |
| About（プロフィール）ページ | ・「どのような人物か」「何が得意か」を端的に伝えることが重要 ・訪問者に親近感や信頼感を抱かせるように記述 |
| お問い合わせページ | ・ストレスなく連絡できる導線を整備 ・プライバシーに配慮した文言があると安心 |
ポートフォリオのページを整えておけば、Webデザイナーとしての魅力を最大限に伝えられるでしょう。
WebデザイナーがWordPressポートフォリオで仕事を獲得するためのコツ
WordPressのポートフォリオで仕事を獲得するには、「この人に依頼したい」と思わせる仕掛けをサイト内に盛り込むことが大切です。
- トップページは「強み」と「実績」が伝わる構成に
- 実績ページは「成果」にフォーカスして書く
- Aboutページで「人柄・得意分野」を丁寧に伝える
- 問い合わせ導線を明確に、かつ安心感を持たせる
- ポートフォリオ単体以外の流入経路を作る
- 定期的にサイトを更新する
ここからは、WebデザイナーがWordPressポートフォリオで仕事を獲得するためのコツを解説します。
トップページは「強み」と「実績」が伝わる構成に
トップページは訪問者が最初に目にするため、自分の強みと実績が分かりやすく伝わる設計にすることが大切です。
たとえば冒頭には、キャッチコピーと共に専門分野を明示するのがポイント。その下に代表的な実績をビジュアル付きで配置すれば、強みが直感的に伝わります。スクロールせずとも魅力が伝わるよう、ファーストビューの設計には特に力を入れましょう。
またページの見た目は、自分のデザインセンスをアピールできる場所でもあります。シンプルながらも洗練されたデザインを意識し、ナビゲーションは分かりやすく配置してください。
実績ページは「成果」にフォーカスして書く
実績ページでは、単に作品を並べるのではなく「どのような成果を出したか」を伝える必要があります。以下のような項目を記載し、Webデザイナーとしての実力を明確に示すのがポイントです。
- 制作したサイト
- デザインの目的
- 手がけた範囲
- 解決した課題
- 改善したポイント
成果を記載するときは「LP制作でCV率○％向上」「レスポンシブ対応でスマホからの離脱率が○％改善」など、数字を交えて具体的に書きましょう。
成果と合わせて、プロジェクトの背景や使用したツールなども記載すると、訪問者が仕事の進め方をイメージしやすくなります。
Aboutページで「人柄・得意分野」を丁寧に伝える
Aboutページは、自分の人柄や仕事への姿勢をクライアントに知ってもらう大切な場所です。初めて仕事を依頼する相手にとっては、スキル以上に「信頼できる人物か」「コミュニケーションが円滑にとれるか」が気になるポイントとなります。
だからこそAboutページでは、自分の経歴や得意分野に加え、人柄が伝わる内容を盛り込みましょう。
- 仕事に対する姿勢や価値観
- 自分の強みや得意分野
- 経歴紹介
- 業務内容
- 使用可能ツール
写真や趣味といったパーソナルな情報も織り交ぜると、親しみを持たれやすくなります。加えて「どんな案件を歓迎しているのか」を明記しておけば、案件のミスマッチも防げるでしょう。
問い合わせ導線を明確に、かつ安心感を持たせる
せっかくポートフォリオを作成しても、問い合わせ方法がわかりづらいと仕事獲得につながりません。問い合わせへの動線は目立つ場所に配置し、どこからでも簡単にアクセスできるようにするのがポイントです。
ページ各所にCTAを設け、「お問い合わせはこちら」など誘導文を記載するのもおすすめです。問い合わせフォームの入力項目は、氏名・メールアドレス・お問い合わせ内容程度に絞るとハードルが下がります。
また、安心感を与えるために、プライバシーポリシーや個人情報の取り扱いについて明示することも大切です。さらに「2営業日以内に返信します」のように返信の目安を示しておけば、訪問者も連絡しやすくなるでしょう。
ポートフォリオ単体以外の流入経路を作る
仕事獲得のチャンスを広げたいなら、ポートフォリオ単体以外の流入経路を作るのがおすすめです。SNSで制作実績を発信したり、ブログでデザインに関するノウハウを共有したりすることで、SNS・検索エンジン経由でのサイト訪問を促進できます。
また、noteやWantedlyといった外部プラットフォームに実績を投稿し、そこからポートフォリオサイトに誘導するのも効果的です。
さらに、フリーランスエージェントやクラウドソーシングのプロフィール欄にポートフォリオのURLを記載しておけば、直接営業をせずともサイト訪問のきっかけになります。
定期的にサイトを更新する
ポートフォリオサイトは「作って終わり」ではなく、定期的な更新が求められます。新たな実績が増えたときやスキルセットが変わったときは、こまめに手を加えていきましょう。
更新が止まっているサイトは、「現在も稼働しているのか？」「連絡しても返ってこなさそう」といった不安を与えるので注意が必要です。逆に、最新の実績や活動状況が反映されているサイトは、検索エンジンの評価が向上するため、仕事につながりやすくなります。
特にフリーランスの場合は、自分のポートフォリオが名刺代わりになるため「常に動いている」印象を与えることが重要です。
SHElikes受講生・卒業生のWordPressポートフォリオ作品例
WordPressでは仕事獲得につながるポートフォリオを作成できますが、初心者の場合はイメージが湧きづらいことも多いでしょう。
そこでここからは、女性向けキャリアスクールSHElikes（シーライクス）の受講生・卒業生が作成したWordPressポートフォリオの作品例を紹介します。どちらも、Webデザイナーとしてのスキルを魅力的に伝えるポートフォリオなので、ぜひチェックしてみてください。
まゆこさん｜Webデザイナー
まゆこさんのポートフォリオは、仕事に対する姿勢やコンセプトが明確に表現されているのが特徴です。トップページは、洗練されたデザインとわかりやすいコピーで印象的な導入となっており、ブランディングにも細やかな配慮がなされています。
また制作実績ページでは、企業HPやバナーなど多彩なジャンルの案件をビジュアル中心に整理。サービス内容は「Website」「Banner」「Graphic」の3領域に分かれており、アピールポイントが明確です。
制作の流れも丁寧に記載されているので、初めての依頼でも安心感があるでしょう。
まゆこさんのポートフォリオはこちら
みやびんさん｜Webデザイナー
みやびんさんのポートフォリオは、トップページでコンセプトが打ち出されており、依頼主の目的や感情に寄り添う姿勢が伝わります。
全体的にシンプルかつ洗練されたデザインとなっており、余白や色彩にもこだわりを感じられる設計です。実績ページでは各制作物がサムネイルとともに分かりやすく提示されているため、デザイン力の幅広さを直感的に伝えられています。
また、プロフィールには経歴だけでなく趣味や将来像も記載されており、親しみやすく誠実な印象です。問い合わせ導線も明確で「24時間以内に返信」と記載するなど、安心感を与える配慮も見られます。
みやびんさんのポートフォリオはこちら
WordPressで「選ばれる」ポートフォリオを作り、Webデザイナーとしての一歩を踏み出そう
WordPressは、Webデザイナーとしてのスキルや実績を示すために最適なプラットフォームです。テーマやプラグインをうまく活用すれば、個性的かつ機能的なポートフォリオサイトを構築できます。
仕事の獲得につながるポートフォリオを作成したいなら、女性向けキャリアスクールSHElikes（シーライクス）もおすすめです。SHElikesでは全45種類以上の職種スキルが定額・学び放題のうえ、プロからポートフォリオ作成の極意を学べるレッスンも用意されています。
実践的な課題やコンペも充実しているので、ポートフォリオに掲載する実績を増やしたいという方にぴったりです。スキルを磨きつつ魅力的なポートフォリオを作成したい方は、ぜひ無料体験レッスンにお越しください。
