当サイトは記事内に広告を含む場合があります

【初心者必見】Adobe Portfolioでサイトを作ろう!使い方を画像付きで解説します

【初心者必見】Adobe Portfolioでサイトを作ろう!使い方を画像付きで解説します

Adobe Portfolioなら、簡単にセンスが良いポートフォリオサイトを開設できます。

オンラインで仕事で探す時代になっているので、自分のサイトを持つのが一般的になっている傾向に。

Webデザイナーなら立ち上げられますが、デザイナーやイラストレーター、写真家など専門知識がない人は難しいです。

けれど、AdobeCCを契約している人なら、Adobe Portfolioを無料で利用できます。

本記事では、サイトの立ち上げまで解説をしていきます。

スポンサーリンク

Adobe Portfolioとは

Adobe Portfolioとは

Adobe Portfolioは、プランに付属するサービスの1つ。

  • 初心者でも簡単開設
  • Adobe Creative Cloudプランで無料

テンプレートでカスタマイズできるので、短時間クオリティが高いサイトが作れる優れもの。

HTML/CSSの知識がないクリエイターや就職活動に集中したい新卒におすすめですね。

初心者でも簡単開設

Adobe Portfolioは、デザイン初心者でも簡単にサイトが作れます。

  • テンプレートが数種類
  • 色や書体でカスタマイズ
  • 画像を挿入していく

たとえば、就職活動で紙のポートフォリオの他に、データ提出が必要になることもありますよね。

その場合、元データをPDFで提出するのも良いですが、サイトのURLを貼り付けた方がスマートです。

リド
リド

簡易的なサイトでも、ビジネスでも、活用できます!

Adobe Creative Cloudプランで無料

AdobeCCを持っている人なら、完全無料追加料金なし。

  • テンプレート
  • ドメイン
  • サーバー

など含まれているので、何も用意しなくてもサイト開設ができるからです。

デザイナー・イラストレーター・写真家など、専門知識がなくても制作から運営まで可能。

全てプランに組み込まれているので、Adobeアカウントと連携して一括で管理ができます。

Adobe Portfolioの9つのポイント

Adobe Portfolioの9つのポイント

簡単にサイトが作れるサービスはありますが、Adobe Portfolioは一味違います。

  • テンプレートで簡単
  • 5サイト公開
  • ページ無制限
  • レスポンシブ対応
  • 独自ドメインの設定
  • サイト分析
  • サイト保護ができる
  • 各種SEO対策
  • Behanceと連携可能

完全無料でサイト運営に必要なポイントを押さえています。

では、詳しく紹介していきます。

全18種類のテンプレートで簡単カスタマイズ

Adobe Portfolioはクオリティが高いテンプレートが揃っています。

複数ページ作れる:12種類
1枚だけで作る:6種類

たとえば、サイト型のページを用途別に複数作り、1枚サイトでまとめて他サイトへ遷移させることも。

テンプレート変更も簡単で、カスタマイズしてもボタン一つで変えることができます。

リド
リド

クリエイターが公開しているので、テーマを参考に作ることも!

5サイト運営できる

無料最大5サイトを開設できます。

用途別にサイトを作れるので、特定のお客様にアプローチができます。

イラスト・写真・デザインなど一緒に紹介しても良いですが、別名義で活動したいなど事情に応じて作れます。

リド
リド

Adobe Portfolioなら都合に合わせて、ポートフォリオ作れる魅力がありますね。

ページ数が無制限

完全無料でページを増やせてWebサイトとして厚みを持たせることができます。

たとえば、作品をジャンル別に紹介したり、自分の仕事の特徴などコンテンツを書いても良いと思います。

しかし、情報量を多くしても見られるのは一部のページだけなので注意してください。

リド
リド

増やしすぎないで、特化した情報に絞りましょう。

レスポンシブありでWeb・スマホ対応しています

テンプレートはレスポンシブ対応になっているので、どのデバイスからみてもデザインが崩れません

通常はデバイス毎に画像を変えるなど、コーディングで細かく設定します。けれど、Adobe Portfolioなら、その必要は一切なし。

リド
リド

デザインが崩れることなく、綺麗なポートフォリオサイトが作れます!

独自ドメインの設定が可能

Adobe Portfolioは自分で好きなドメインに設定できます。

  • 独自ドメインを購入する
  • 持っているドメインに設定する
  • サブドメインで設定する

しかし、お名前ドッドコムなどで購入しないといけません。

簡易的なポートフォリオならいらないですね。

サブドメインの方法なら、継続の使用料もかからないので、こっちをおすすめします。

サブドメインの方法
ここの部分を設定する.myportfolio.com
例:lido.myportfolio.com

画面上で好きな文字に変更するだけの簡単使用です。

計5回も設定をやり直せるので、やむ終えず変更することもできます。

サイト分析が可能

Adobe PortfolioはGoogleアナリティクス設定ができます。

PV数や流入元、直帰率や離脱率などを見ながら、修正や改善をして運営していけます。

SEO対策

Adobe Portfolioは各種SEO対策もできます。

検索で集客するなら、SEO対策でサイトを上位表示させなければいけません。

  • メタ記述
    → スニペットでサイトのクリック率を上げる
  • メタキーワード
    → KWや検索クエリを設定
  • インデックスの有無
    → 検索エンジンに登録する
  • サイト更新を送信
    → 検索エンジンに報告する
  • カスタムメタタグ
    → Google Search ConsoleやPinterestと同期

などなど、基本的なSEO対策必要な設定を行うことができます。

サイト保護の設定ができる

サイト保護でセキュリティー対策ができます。やり方は以下の通りです。

  • 画像保護 → 右クリックの無効化
  • 地域設定→ 国を指定
  • パスワード保護 → サイト全体 or 一部記事

たとえば、案件の中には公にできない作品もあります。

その場合、実績として証明したいと思うので、パスワード保護すれば、担当者だけに公開することができます。

リド
リド

案件の著作権自分の作品の保護は、クリエイターにとって気をつけたいですね。

Behanceと連携可能

Behanceは世界中のクリエイターの作品が見れるSNSです。

Adobe Portfolioでは簡単に連携ができるので、世界中から集客ができるようになっています。

自分の作品が評価されたり、テクニックを学んだり、求人紹介もあります。海外の人から仕事の依頼が来るチャンスも。

最新の技術を学んだり、たくさんの作品を見ることで勉強になることもありますね。

リド
リド

Behanceと連携することで作品で世界と繋がれるチャンスです!

Adobe Portfolioの注意点

Adobe Portfolioの注意点

Adobe Portfolioの注意点は3つあります。

  • 機能が多くて扱いづらい
  • 使い方の記事が少ない
  • デザインの差別化は難しい

機能が多くて扱いづらい

テンプレートの設定が細かいため 初心者は時間がかかります。

専門用語カスタマイズの幅が多いので、慣れないうちはやりづらいかもしれません。

デザイン経験がある私でも、手間どりながら設定をしました。が、大枠のデザインが決まれば問題はありません。

使い方の記事が少ない

Adobe Portfolioのマニュアルや記事が少ないですね。

マニュアルが出回っていないので、試しながらカスタマイズしていかなければいけません

しかし、トップページから外国人クリエイターのサイトを見ることができるので、参考にしながら進めていきましょう。

リド
リド

本記事でも簡単に解説しています!

デザインの差別化は難しい

テンプレート依存になるので、デザイン性を高めて差別化は難しいです。

デザインも作品を魅せるために、シンプルなテンプレートしかありません。

サイト自体にデザイン性を加えて、個性を出すことはできないですね。

デザインのアイディアを出せる下記のサービスがあります。一緒に使うとデザインにいかせるかも。

Adobe Portfolioの基本の操作方法

Adobe Portfolioの基本の操作方法

今回、自分でもサイトを解説してみました。初見で立ち上げたので、基本のポイントすべて押さえています。

作品のキャプチャーテキストの準備は別で必要ですが、だいたい1時間でサイトの基盤ができるかと思います。

始め方

まず、Adobeアカウントに入って、Adobe Portfolioのトップページいきます。

Adobeportfolioの始め方
フルポートフォリオとは
複数ページからなるテンプレート
ようこそページとは
1枚ページ=ランディングページのテンプレート
Adobeportfolioでページを選択する

今回はフルポートフォリオから「Sawdust」のテンプレートを選びました。
「このテーマを使用」を押すと、カスタマイズ画面にいきます。

Adobeportfolioでテンプレートを選ぶ

ページの作り方

編集画面はこんなにもシンプルです。

Adobeportfolioでページを作る

ロゴの部分を押すと、右側のツールでテキストや色の変更、画像の追加ができます。

ページ編集で色や画像の追加ができます

私はテキストを入れてみました。

テキストロゴを入れた

次に作品のページを入れていきます。「ページの追加」を押すと、「ページ」「Lightroom Album」の2つから選べますが、通常は「ページ」で良いです。

Adobeportfolioにページを追加する

「ページ名」と「保存先」を設定します。

ページ名とは
そのカテゴリの名前や作品名でも良いです
保存先とは
親ページの設定ですね。大枠のカテゴリ名でも良いですね。
Adobeportfolioで新しいページを保存する

ページを作成すると、ページ内のデザインをしていきます。
ツールバーが出てくるので、用途に合わせて作品ページをデザインしていきましょう。

Adobeportfolioでページ内をデザインしていく

画像を挿入したあとに、追加でコンテンツを入れることもできます。

追加でコンテンツを入れる

これを繰り返すことで、ページの情報量を持たせられます。

Adobeportfolioのページを作り込んでいく

トップページに戻ると、ページの追加カテゴリの追加など編集をしていきます。

ページやカテゴリを追加して編集をしていく

サイト設定をしてみよう

まず、右側の「設定」マークからサイトの各種設定をします。

adobeportfolioの設定をしていく

「ドメイン名」の設定をします。

ドメインを買うor持っている人は
ドメイン接続から設定できます。
サブドメインなら
完全無料で好きな文字をつけられます。

好きな文字列で決めて「適用」すると、設定が完了です。

Adobeportfolioのドメインを追加していく

「分析」の設定はGoogleアナリティクスと同期させます。

AdobeportfolioにGoogleアナリティクスと同期させる

「検索の最適化」SEO対策です。検索エンジンに認識してもらえるよう、やっておいて損はありません。

AdobeportfolioのSEO対策をする

「お気入りのアイコン」では、ファビコン設定をします。

タブを開いた時に、ファビコンがあるとユーザーはわかりやすいです。ブランディングを込めてやっておきましょう。

Adobeportfolioのファビコン設定をする

ソーシャルシェアのサムネイルの設定をします。

「ソーシャルシェアのサムネイル」では、URLがシェアされた時に、画像が表示される設定です。

Adobeportfolioのソーシャルシェアのサムネイルを設定する

「パスワード保護」では、サイト全体に設定するか、しないかを決めます。

プライバシーや著作権を守るために、自分の都合に合わせて設定をしておきましょう。

Adobeportfolioの保護設定をする

「サイトを非公開にする」では、サイトの公開状況を設定します。

Adobeportfolioの非公開設定をする

「アカウントと地域」では、アカウントの管理と公開地域の変更をします。
特定の海外や日本などに設定ができます。

Adobeportfolioのアカウントと地域設定をする

まとめ:クリエイティブをAdobeで一括管理できる

まず、AdobeCCを持っているだけで、普通は使用料がかかるサイトテンプレートが無料です。

完全無料だからプランを継続して入れば、公開し続ければずっと集客ができるサイトを所有できます。

しかし、AdobeCCを解約すると、Adobeポートフォリオも自動で解約となってしまいます。

継続して使いたい方は、社会人でもアカデミック版で購入できるのでオススメです!

コメント

タイトルとURLをコピーしました