【月10万稼ぐ】本物のWeb制作3ヶ月独学ロードマップ

【無料】WordPress「自作ポートフォリオサイト」作り方|Webデザイナー監修

本記事は現役Webデザイナーの筆者が実際に経験した自作ポートフォリオサイトの作り方を徹底解説していきます。

当然ですが、Web制作会社に提出しても恥ずかしくないポートフォリオサイトを作れるようにサポートします。この記事を読めばコーディングが全くの初心者でもポートフォリオサイトを作れるようになるので安心して読み進めてください。

 

この記事の信頼性(ゆうけんブログの筆者はこんな人)

  • 現役Webデザイナーが執筆
  • 最高月収7桁超のフリーランス
  • 完全未経験から独学でWeb制作スキルを習得
  • Twitterフォロワー数2,000人超(→@twinzvlog_yk
  • Web制作のメンター経験多数
  • 認定ランサー(ランサーズ最高ランク)

 

学生の方は下の記事がおすすめです。

【学生必見】未経験から「ポートフォリオサイト」作り方|Web制作

 

【自作】ポートフォリオサイトとは|WordPressがおすすめ

ポートフォリオサイトとは簡単にいうと実績を示すための作品集です

自分はこれだけのことができるんだぞ!とアピールする際に使います。
ポートフォリオサイトはクライアントに自分のスキルをアピールするために重要な役割を持っています。例えば、Web制作会社にメール営業する際にも優れたポートフォリオがあれば数倍も返信率や契約率が変わってきます。

逆にいうとポートフォリオサイトを持っていない場合、あなたがどれだけスキルを持っていようが、どれだけ魅力的な人物だろうと『判断材料がない』ことで見向きもされないのでこの機会に必ず作りましょう。

 

【現役Webデザイナー監修】WordPressを使った自作ポートフォリオサイトの作り方|無料テーマでOK

初心者の方でもカンタンに作れるように3ステップで解説していきます。ステップ通りに実行していただければOK!

【この章の流れ】

 

  • 【STEP1】サーバーを契約
  • 【STEP2】好きなWordPressテーマを選ぶ(無料)
  • 【STEP3】テーマをWeb上に公開する

 

【STEP1】まずはレンタルサーバー&ドメインを用意する

ポートフォリオサイトを作る前に「事前準備として」レンタルサーバー&ドメイン(サイト公開に不可欠なサービス)を必ず用意しておきましょう。

Web制作会社やクライアントに、ポートフォリオサイトを確認してもらうためには、ドメインとサーバーを契約してWeb上に公開することが必須となります。
(無料サーバーでも公開可能ですが、大きな広告がついたり、登録が面倒だったりします。。)

 

こちらの記事を読んで今すぐサーバーを用意しましょう!

【徹底解説】ポートフォリオおすすめレンタルサーバーと公開方法|無料/有料比較あり

この記事で紹介している「ConoHa WING」を導入した場合、業界最安値のサーバー費用に加えて独自ドメインも無料で付いてくるので超お得です。それと、操作がものすごく簡単です。

 

【STEP2】好きなWordPressテーマを選ぶ(無料)

ポートフォリオサイトに最適なWordPressテーマを選ぶポイントは3つあります。

  • 画像中心のテーマ
    理由:パッと見たときに、ポートフォリオだと気づきやすい
  • 奇抜ではなく、シンプルなデザイン
    理由:奇抜なサイトデザインだと、肝心のポートフォリオが目立たなくなる
  • カスタマイズが簡単なテーマ
    理由:コーディングができなくても簡単に作れる。膨大な時間を削減できます。

このあたりを意識してください。といっても、これからご紹介するWordPressテーマはすべて上の3つのポイントを考慮しているのでどれを選んでもらってもOKです。

もしも『いや、 WordPressテーマは自作したい』という方がいましたら、

>>【裏ワザ】WordPressテーマを無料で自作をご覧ください。

 

1. Fukasawa

見てわかるとおり、画像中心でわかりやすいですね。そしてなんといっても配置といい、余白といい、色合いといい全てがシンプル。レスポンシブ対応もしっかりとできていて、とても無料とは思えないデザインです。

 

デモサイト  ダウンロード

 

2. Noah

こちらのテーマはわかりやすく画像が『バンっ』と表示されいますね。ナビゲーションメニューも洗練されたオシャレなデザイン。投稿の詳細画面には画像を画面いっぱいに複数表示できるのでサイトデザインのポートフォリオを配置するにはぴったりだと思います。

 

デモサイト  ダウンロード

 

3. Screen

筆者としてはこちらのWordPressテーマが一番おすすめです。大小異なる画像の配置やシンプルなアニメーション、わかりやすいデザインと全てが完璧。『無料でここまで使えるのか』と唸るほどのテーマです。

 

デモサイト  ダウンロード

 

 

さらにデザイン性が高く『あっと言わせる』ようなポートフォリオサイトを作りたい方は『TCDテーマ』を使ってみることをおすすめです。有料テーマですが、効果は圧倒的に高いテーマなので一見の価値はあり。

 

【STEP3】テーマをWeb上に公開する

  1. WordPress管理画面にログイン
  2. 左にあるメニューの『外観→テーマ』を選択
  3. 『新規追加』を選択
  4. 『テーマのアップロード』を選択
  5. 『ファイルを選択』からテーマをアップロード
  6. 『今すぐインストール』を選択

以上でテーマのアップロードが完了です!

あとは画像や文章を追加して自分好みのポートフォリオサイトに仕上げていくだけです。

 

『絶対にリモートワーク!』という方におすすめの求人サイトをご紹介!

クラウドテック
Web制作案件の数
(5.0)
案件の単価
(4.0)
使いやすさ
(5.0)
案件獲得効率
(5.0)
初心者向け
(5.0)
オススメ度
(5.0)
総合評価
(5.0)
この講座のポイント

対象
Webデザイナー・エンジニア・グラフィックデザイナー・PM・マーケター・ライター

 

公式サイト
クラウドテック公式ページ

特徴

  • クラウドソーシング企業大手のクラウドワークスが運営する求人サイト
  • 実務未経験者でもOK
  • 登録社数14万社
  • フリーランス・個人事業主向け案件がケタ違いに多い
  • 報酬額や勤務地・職種など希望が通りやすい
  • Web制作・コーディングの高単価案件が多い
  • リモートワーク案件数は業界トップクラス
  • 最短3日で案件を獲得できる

 

現役Webデザイナーの筆者イチオシの求人サイト!フリーランス向けWeb制作案件なら確実に業界トップクラス。営業かけずに案件に困らなくなる一番の近道です。

ふたご

 

無料で登録してみる >>

 

 

『Web制作会社の直営業』で案件獲得したい方におすすめのやり方【筆者実証済み】

Web制作の仕事のとり方が分からない人に捧ぐ『直営業』の教科書

値段
(5.0)
学習しやすさ
(5.0)
わかりやすさ
(5.0)
熟練度
(4.5)
初心者向け
(5.0)
オススメ度
(5.0)
総合評価
(5.0)
この講座のポイント

値段
2,980円

 

この講座の特徴

この講座ではショーへーさんがフリーランス2年目で月収7桁を達成するまでに蓄積したWeb制作「直営業」ノウハウの全てが詰まっています。読んでみるとわかりますが、そのまま使えて普通に契約取れます。

 

コピペOKの営業メールのテンプレートも記事内に貼ってあり、要点まで詳しく解説してくれています。正直これを読んで実践すれば、メール営業で50件送って返信が1件も来ないなんてことは起こり得ないと断言できます。大丈夫です。普通に返信がきます。

 

また、メールに添付するポートフォリオの作成方法や、概算の見積もり金額の相場等も記載されており、初心者にはかなり嬉しい内容が盛り沢山です。エンドクライアントへの直営業のやり方にも触れているので、「高単価案件が欲しい方」「自由に制作したい方」にとっては喉から手が出るほど有益な情報ですよね!

 

今Web制作営業で苦労している方、全員に読んでもらいたいNo.1の商材です。冗談抜きで案件に困らなくなります。

ちなみに、以前はnoteで販売されていた商材ですが、現在はBrainでのみ販売されています。

 

この講座の内容(目次)

  1. 直営業に必要なスキルレベルと準備物紹介
  2. 直営業で意識するべき3つのポイント【本質】
  3. おすすめの営業先と見つけ方紹介
  4. 相手に響く提案文を書くコツ
  5. 提案文のテンプレ公開+解説
  6. 【第2の選択】エンドクライアントに直営業して『作って楽しい』案件を取ろう
  7. 【追記】直営業の成功率をさらにあげる小技
  8. 【追記】副業で案件を取りたいという方へ
  9. 【追記】キャリアの短さや副業であることをプラスに変えるコツ

 

この講座の特典

  • 直営業用の提案文テンプレート
  • 提案文の添削 1回無料

 

Web制作『直営業』の教科書

 

 

まとめ

転職のため、案件獲得のためと目的は色々あると思いますが、なにはともあれポートフォリオサイトの作成お疲れさまでした。あとはポートフォリオサイトを作った目的を果たすだけですね!

そこでもし、まだ転職エージェントや求人サイトに登録していない方は下の記事をご覧ください。独自のやり方で失敗しないためにも必見です。

【未経験OK】Web制作『初案件獲得』で困らない方法|ウェビスト+クラウドテック