how-to-create-a-portfolio-site-using-wix-min (3)

Wixでポートフォリオサイトを作る方法!10の作業ステップ


Wixを使用してポートフォリオサイトを作るには、どのような手順で始めればいいでしょうか。

Wixアカウントを設定し、質問に回答をしながらセットアップを進めます。そのあと、デザインを決め、ポートフォリオを追加した後に、問い合わせフォームを用意し、SNSで発信します。

Wixは無料で始められるため、手軽にポートフォリオサイトを作れます。そこで、Wixでポートフォリオサイトを作る手順を詳しくご紹介します。

本記事では、Wixを利用してポートフォリオサイトを作る方法を説明します。

 

Wixを使用したポートフォリオサイトの作り方!10の作業ステップ

how-to-create-a-portfolio-site-using-wix-min (4)

Wixを使用したポートフォリオサイトを作るときは、次の10の作業ステップを踏みます。

  1.  Wixの概要を理解する
  2.  ポートフォリオサイトに盛り込む情報を洗い出す
  3.  Wixでのアカウントを設定する
  4.  ホームページをセットアップする
  5.  ポートフォリオを追加する
  6.  サイトをデザインする
  7.  連絡先ページを作る
  8.  画面をカスタマイズする
  9.  SNSで発信をする
  10.  料金プランを選ぶ

それぞれを詳細に説明します。

 

1. Wixの概要

wix-top-min

Wixは直感的な操作で、かんたんにウェブサイトが作れるツールです。Wixがポートフォリオサイトにおすすめな理由は3点あります。

  •  プログラミングの知識がなくても、簡単にサイトを作れる
  •  無料プランで始められる 
  •  ポートフォリオに特化したテンプレートがあり、作品を掲載しやすい

特に、ポートフォリオに関するテンプレート50種類あります。テンプレートを活用することで、ゼロからデザインを始めるよりも、かんたんにサイトを作れます。

wix-templates-min

Wixのポートフォリオ向けのテンプレートを見る

 

2. ポートフォリオサイトに盛り込む情報

portofolio-information-min

ポートフォリオサイトは、個人のスキル経験成果を展示し、お客様にアピールすることです。そのため、つぎの5つの情報を盛り込みます。

◆ ポートフォリオサイトに盛り込む情報

項目 詳細な内容
プロフィール 名前職業専門分野、特技、経験
ポートフォリオ(作品集) 代表作、最近の作品、画像や動画、プロジェクト
スキルセット 使用可能なツール、技術、言語などの特技
経歴 教育背景、職歴プロジェクト、成果、賞
連絡先情報 メールアドレス、電話番号、問い合わせフォームSNSのアカウント

なお、作品を掲載するときは、作品を小さなサムネイルとして表示し、クリックすると拡大表示されるスタイルがあります。

wix-portofolio-information-1-min

ほかにも、サイズが異なる作品隙間なく配置する方法もあります。

wix-portofolio-information-2-min

また、作品をジャンルタイプ別に分類して展示する方法もあります。

portofolio-genre-min

 

3. Wixのアカウントの設定

Wix-account-setting

それでは、Wixを利用してポートフォリオサイトを作る手順を紹介します。

(手順1) Wixにアクセスします

wix-top-min

Wix

(手順2) 「無料ではじめる」を選びます。

wix-top-start-min

(手順3) メールアドレスパスワードを登録します。

wix-top-start-user-registration-min

 

4. ホームページの作成

Wixでのユーザー登録が終えたら「誰のためにウェブサイトを作成しますか?」と質問されるので
自分自身、私のビジネス、または友人」を選びます。

wix-start-1-min

AI があなたのアイデアを形にします」と表示されるので、「チャットを開始」を選びます。

wix-start-2-min

まず、サイトの名前を教えてください」でサイトの名前を回答します。

wix-start-3-min

どのようなビジネスをされていますか?」でビジネスの概要を回答します。その後、いくつかの質問に回答します。

wix-start-4-min

準備が完了しましたと表示されるので、「ダッシュボードを開く」を選びます。

wix-start-5-min

 

5. ポートフォリオの追加

ポートフォリオとなる作品を追加します。画像やテキスト、動画を使って、プロジェクトの詳細を説明します。

ダッシュボードが表示されるので、「ポートフォリオ」(左側の赤枠)を選びます。

wix-dashboard-1-min

プロジェクトを追加」(赤枠)を選びます。

wix-dashboard-2-min

プロジェクト名」を登録します。

wix-dashboard-3-min

プロジェクトの詳細を追加」を登録します。

wix-dashboard-4-min

プロジェクトタイプ」「日付」「場所」を登録します。

wix-dashboard-5-min (1)

プロジェクトの画像写真動画を追加します。

wix-dashboard-6-min (1)

 

6. サイトのデザイン

wix-websites-design

ポートフォリオサイトのデザインを決めるにあたって、検討したいポイントは3つあります。

◆ ポートフォリオサイトのデザインの要素

デザイン要素 検討したいポイント
色彩
  • ブランドイメージに合う色を選ぶ
  • 色彩理論(補色、類似色、トライアド配色など)を用いてパレットを作る
フォント
  • 可読性を重視し、視覚的な魅力読みやすさを両立させる
  • 使用するフォントの種類を限定し、一貫性を保つ
画像とビジュアル
  • 代表作を選ぶ
  • 画像サイズを管理し、ウェブサイトのロード時間を短縮
    • 大きな画像(例:フルスクリーン):幅は1920ピクセル
    • 通常の画像:幅は最大で1200ピクセル(デスクトップ画面)
    • サムネイル:幅は300〜500ピクセル。クリックすると拡大表示

上記を押さえつつ、Wixのデザインを設定します。まず、ダッシュボードが表示されるので、「サイトをデザイン」を選びます。

wix-design-1-min

テーマを選びます。

wix-design-2-min

トップページデザインをお選びください」と表示されるので、好みのデザインを選びます。

wix-design-3-min

サイトにページを追加しましょう」と表示されるので、「お知らせ」や「お問い合わせ」を追加します。

wix-design-4-min

おめでとうございます。サイトは公開され、稼働しています」と表示されるので、「ライブサイトを表示」を選びます。

wix-design-5-min

作成されたWebサイトを確認し、内容を確認します。

wix-design-6-min

 

7. 連絡先ページの作成

ダッシュボードで「設定」を選びます。(左側の赤枠)

wix-portofolio-setting1-min

ビジネス情報」を選びます(赤枠)

wix-portofolio-setting2-min

所在地」や「連絡先」を登録します。

wix-portofolio-setting3-min

問い合わせフォームを作るため、「コミュニケーション」→「フォーム・回答内容」を選び、「フォーム作成」を選びます。

wix-form-make-min

次に、「エディターフォーム」を選びます。

wix-form-make-editor-form-min

Wixフォーム&ペイメントという画面が表示されるので、「サイトに追加」を選びます。

wix-form-app-form-start1-min

フォームテンプレートを選択画面で「お問い合わせ」を選びます。

wix-form-app-form-start2-min

お問い合わせフォームの内容を決めて「公開」を押すことで、問い合わせ画面ができます。

wix-form-app-form-start3-min

 

8. 画面のカスタマイズ

customization-of-wix

画面のデザインを細かくカスタマイズしたい場合には、次のような手順で直せます。

Wixのダッシュボードから「サイト設定」→「サイト編集」を選びます。

wix-customization-start1-min

エディター画面が表示されます。

wix-customization-start2-min

カスタマイズしたいページがある場合には、左側のメニューから「サイトメニュー」→「変更したいページ」を選びます。

wix-customization-start3-min

文言を変更したい場合にはクリックすることで、文字の編集ができます。

wix-customization-start4-min

レイアウトを変えたい場合には、画像をクリックし、「レイアウト」を選びます。

wix-customization-start5-min

 

9. SNSの発信

次に、SNSを活用して情報を発信する方法を紹介します。発信する情報の例をまとめました。

◆ SNSで発信する内容の例

発信内容の例 詳細内容
最新の作品やプロジェクト 新しいデザインアートワーク、プロジェクトの進捗
プロセス 制作過程や使用した技術、作業風景やスタジオの様子
イベントやニュース 展示会受賞、新しいサービスの開始
専門知識 専門知識を共有するチュートリアル

では、WixでSNSの発信をするための設定をします。ダッシュボードで「マーケティング・SEO」から「SNSマーケティング」を選びます。

wix-portofolio-sns-setting1-min

新しい投稿を作成」を選びます。

wix-portofolio-sns-setting2-min

利用しているSNSを選びます。

wix-sns-setting3-min

連携アプリを認証」を選びます。(Xでの連携の場合)

wix-sns-setting4-min

連携がされると、接続済みと表示されます。

wix-sns-setting5-min

次へ」ボタンを押します。

wix-sns-setting6-min

X(Twitter)に表示される画面がプレビューされるので、問題がなければ投稿します。

wix-sns-setting7-min

 

10. Wixの料金プラン

Wixの料金プランについてご紹介します。Wixは無料で作れますが、独自ドメインを持てない点と、Wixのロゴが表示されたままとなります。

◆ Wixのロゴが表示される画面イメージ

wix-free-plan-min

独自ドメインを持ちたい場合やWixのロゴを非表示にしたい場合は、有料プランを選びます。基本的には、ポートフォリオサイトとしてはパーソナルプランで十分だと思います。

◆ Wixの料金プラン

項目 パーソナル スモールビジネス ビジネス ビジネスプライム
料金 1,200円 2,100円 2,600円 12,000円
データ容量 2GB 50 GB 100 GB 無制限
ネットショップ ×

Wixの料金プランを見る

 

まとめ

本記事では、Wixを利用してポートフォリオサイトを作る手順を紹介しました。おさらいをすると、次のようなステップになります。

  1.  Wixの概要を理解する
  2.  ポートフォリオサイトに盛り込む情報を洗い出す
  3.  Wixでのアカウントを設定する
  4.  ホームページをセットアップする
  5.  ポートフォリオを追加する
  6.  サイトをデザインする
  7.  連絡先ページを作る
  8.  画面をカスタマイズする
  9.  SNSで発信をする
  10.  料金プランを選ぶ

なお、他のポートフォリオサイト作成ツールに興味がある場合には、別記事をご覧ください。

【参考記事】・ 無料でポートフォリオサイトを作る!おすすめのツール8選(機能比較)
      ・ 動画のポートフォリオサイト作成ツールの比較!おすすめ8選(無料あり)

500mailsのFacebookやX(旧、Twitter)では、起業・副業に役立つ情報を配信しています。 是非「いいね!」をして最新情報をチェックしてください

Writer/編集者: 松田康


コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です