Webデザインポートフォリオをオンラインで作成する方法
公開: 2020-05-11ウェブデザイナーであるあなたは、あなたのキャリアの中でこれほど熱心に取り組んできたプロジェクトに誇りを持っています。 これはただ一つのことを意味することができます-あなたの最高の作品を集めて展示する時が来ました。 あなたがあなたの作品をどのように提示するかはあなたのプロ意識を物語っています。 きちんと整理された方法であなたのデザインを紹介することはあなたの最大の利益です。 これは、Webデザインポートフォリオが介入する場所です。
あなたの顧客や雇用主は、あなたの作品やプロジェクトについて聞くよりもむしろ見たいと思っています。 良いポートフォリオは彼らにその機会を与え、あなたが彼らの信頼を勝ち取るのを助けます。 Webデザインポートフォリオを正確に作成する方法に興味がある場合は、読み続けてください。 この記事では、プロセスを段階的に説明します。
RenderforestのWebサイトテンプレートの1つを使用して、ポートフォリオを作成します。 それでは、ナビゲーションメニューの「 Webサイトの構築」に移動して、作成を開始しましょう。
Webサイトビルダーページにアクセスすると、Webサイトテンプレートのいくつかのカテゴリとサブカテゴリが表示されます。 ニーズに合ったものを選択してください。 Webデザインポートフォリオの場合、[パーソナル]カテゴリで[ポートフォリオ]を選択するか、[アート]カテゴリで[デザイン]を選択できます。
または、[すべて]をクリックして利用可能なすべてのテンプレートを開き、検索バーを使用して必要なテンプレートを探すこともできます。
カテゴリを選択すると、さまざまなWebサイトテンプレートから選択できるようになります。 次の図は、ポートフォリオのオプションを示しています。
いずれかを選択したら、それをクリックしてテンプレートの全画面プレビューを表示します。 「WebDesignerCV」を選びました。
プレビューページでは、下にスクロールしてテンプレートを表示したり、デスクトップ、タブレット、電話の画面でどのように表示されるかを確認したりできます。
さらにテンプレートを閲覧したい場合は、左隅の「テンプレートに戻る」をクリックしてください。 選択したテンプレートに満足したら、右上隅にある[適用]をクリックします。
「適用」ボタンをクリックすると、Webサイトメーカーエディターに移動します。ここで、テンプレートを編集して完全にカスタマイズできます。 それで、それがどのように行われるか見てみましょう。
テンプレート内のすべての要素はカスタマイズ可能です。 これが、作業を非常に柔軟にする理由です。 まず、ヘッダーの調整から始めましょう。
左側には、ロゴを付けるためのオプションがあります。 右側では、背景色を変更できます。 ヘッダー全体を別のものに置き換える場合は、背景色のすぐ横にある[置換]をクリックします。
それをクリックすると、ヘッダーセクションの他の多くのオプションが表示されます。 適切なものを見つけたら、「交換」ボタンを押します。
ヘッダーがどのように表示されるかを決定したので、ナビゲーションメニューの作成を開始できます。 不要なメニュー項目を削除するか、「リンクを追加」をクリックして新しいメニュー項目を追加してください。
メニュー項目にリンクを添付するには、ハイパーリンクアイコンをクリックします。
新しいウィンドウが開き、メニュー項目名を編集して、ページの特定のセクションへの外部リンクまたはジャンプリンクを挿入できます。
最後に、「コンポーネント」ボタンがあります。 それはあなたがあなたのウェブサイトに他のどんなテキストまたは視覚的な構成要素も加えることを可能にします。
CTAや価格設定から、FAQやソーシャルメディアのリンクまで、考えられるあらゆるコンポーネントを見つけることができます。
ヘッダーセクションが完成したら、さらに下に移動して、同じ方法で他のセクションをカスタマイズし続けます。 ページに表示されているブロックを変更、置換、削除、または追加できます。
テンプレート内のテキストを編集するには、それをクリックして入力を開始するだけです。

アイコンを変更するには、編集ボタンをクリックすると、新しいウィンドウがポップアップ表示されます。
ここでは、検索バーを使用して必要なものを探すことができます。 アイコンを選択して[保存]をクリックすると、アイコンが置き換えられます。
このテンプレートには、作品やデザインの写真専用のセクションがあります。 表示する画像の数を選択し、画像アイコンをクリックして画像を追加します。
ファイルをアップロードしたり、画像のURLを挿入したり、メディアライブラリから写真を選択したり、ストック画像を閲覧したりできます。
ページの一番下に、ソーシャルメディアリンクを添付するオプションがあります。 アイコンを選択し、ソーシャルリンクを挿入して、訪問者とアカウントを共有します。
移動すると、ページの左側にあるサイドバーメニューに気づいたかもしれません。 サイドバーには、デザインポートフォリオ用の追加の編集ツールが用意されています。 ツールとその機能を簡単に見てみましょう。
最初のツールでは、テキストのフォントとサイズを調整できます。 自分のスタイルにぴったりのフォントが見つかるまで、フォントを試してみてください。
すぐ下に、ページ上のボタンと要素の形状を制御する「スタイル」ツールがあります。 丸みを帯びた、角のある、鋭いエッジの3つのオプションがあります。
次は、「カラー」ツールです。 かなり自明です。 それはあなたが色を選ぶことを可能にします。 デザインチームが提案するカラーパレットを試すか、ブランドカラーを追加することができます。
次のツールは「ページ」と呼ばれます。 新しいページを追加したい場合は、このツールを使用して行います。 「新規追加」をクリックし、ページ名を入力して作成します。 その後、先に進んでカスタマイズすることもできます。
「ウィジェット」ツールを使用すると、ポートフォリオにツールや機能を追加できます。 今のところ、利用可能なウィジェットはライブチャットだけです。 あなたはいくつかのライブチャットサービスプロバイダーを見つけるでしょう。 いずれかを選択し、提供されたリンクをたどって設定方法を学びます。
最後になりましたが、「設定」ツールがあります。 これにより、ページのより技術的な設定を微調整できます。 設定には、一般、ページ、ドメインの3つのカテゴリがあります。 一般設定は、Cookieバーの表示、ファビコンの編集、ソーシャルイメージの選択などを担当します。
「ページ」設定は、ページタイトル、メタ説明、およびキーワードを設定するのに役立ちます。 最後に、「ドメイン」はあなたのウェブサイトのドメイン名を扱います。 カスタムドメインまたは無料のRenderforestサブドメインのいずれかを選択できます。
最終設定を調整したら、ポートフォリオの作成はほぼ完了です。 おめでとうございます! ただし、このチュートリアルを終了する前に、トップバーについても簡単に説明しましょう。
ここには、変更を元に戻したりやり直したりできる2つの小さな矢印があります。 誤って間違った動きをした場合でも、心配しないでください。いつでもダメージを元に戻すことができます。
次に、ポートフォリオへの編集リンクを、プロジェクトをさらにレビュー、校正、編集できる寄稿者と共有するオプションがあります。 編集リンクをアクティブにしておく時間を決定します。
[プレビュー]ボタンを使用すると、ページを公開する前にページがどのように表示されるかを確認できます。 ここでも、デスクトップ、タブレット、電話でポートフォリオをプレビューできます。
最後に、すべてが完璧で、ポートフォリオが素晴らしいように見えることを確認したら、待望の「公開」ボタンを押すことができます。 プロジェクトは自動的に「マイウェブサイト」に保存されます。 いつでもアクセスして編集できます。
プロジェクトが正常に作成されたようです。 さあ、あなたの卓越したウェブデザインポートフォリオで世界を征服しましょう!
下のボタンをクリックして、今すぐ独自のWebサイトを構築してください。
今すぐ作成
