未経験から転職を目指すための
ポートフォリオサイトの作り方

作成のポイント

ポートフォリオサイトを作るときの大切にしたいこと

レスポンシブ対応

パソコンとスマートフォンのどちらでも見栄えよく見れるレイアウトにしましょう。

自分らしさの演出

サイトのデザインや色、テキストなど、自分らしい内容のサイトにしましょう。

サイトの公開

作ったサイトは公開することで、就職・転職活動で見てもらえるようにしましょう。

ポートフォリオサイトの作成の流れ

ポートフォリオサイトを作る大きな流れを理解しよう

  • ステップ1

    ステップ1

    サイト作成の目的の明確化

    ポートフォリオサイトを作る目的は何でしょうか。 就職・転職のためのアピールなのか、自分の学習ようなのか。 まずは、その点を明確にしましょう。

  • ステップ2

    ステップ2

    サイトのデザイン決め

    ポートフォリオサイトのデザインを決めましょう。 色々なサイトをみて、自分が作るサイトのデザインの参考にしましょう。

  • ステップ3

    ステップ3

    サイトの作成

    どのようなポートフォリオサイトにするか決まったら、 実際にポートフォリオサイトをHTMLとCSSを使って作っていきましょう。

    【参考】Web基本のまとめ
  • ステップ4

    ステップ4

    サイトの公開

    ポートフォリオサイトを作ったら、せっかくなので公開しましょう。 サイトの公開は、レンタルサーバを使うのが一番簡単。 そんな中でもロリポップサーバをオススメします。

  • ポートフォリオ
    サイトの
    公開完了!

ポートフォリオ作成が不安な方向け

スクール活用など、不安な方向けの記事を紹介

初心者におすすめのプログラミングスクール一覧

ポートフォリオの作成が不安な方には、スクール活用してサポートを受けながら進めていくのもおすすめ

記事ををチェック

初心者におすすめのプログラミングスクール一覧

ポートフォリオの作成が不安な方には、スクール活用してサポートを受けながら進めていくのもおすすめ

記事ををチェック

初心者におすすめのプログラミングスクール一覧

ポートフォリオの作成が不安な方には、スクール活用してサポートを受けながら進めていくのもおすすめ

記事ををチェック

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

ポートフォリオとして参考にできるサイトを紹介します

サイトをチェック
参考レイアウト1
シンプルな縦スクロール
サイトをチェック
参考レイアウト2
サイドメニューレイアウト
サイトをチェック
参考レイアウト3
1ページのファーストビュー

ポートフォリオサイトの公開方法

公開したポートフォリオサイトは、

転職サイトなどの自分のプロフィールの欄にサイトのURLを記載しておきましょう。

この3つのレンタルサーバがオススメです

ロリポップ

コスパ良し、初心者に優しい

サイトをチェック

ConoHa WING

スピードや安定性に定評

サイトをチェック

お名前.comレンタルサーバー

ドメインの取得もセットでお得

サイトをチェック

参考記事

ポートフォリオサイトの作成、公開に関する参考記事を紹介

ロリポップレンタルサーバーの契約の方法

初心者の方に、オススメしている、 ロリポップレンタルサーバ ロリポップレンタルサ...

記事をチェック
作成したWebデザインをロリポップレンタルサーバにアップロードしよう

初心者の方の中で、Webデザインを作って、 アップロードするサーバを探しているな...

記事をチェック
Webデザインやフロントエンドのポートフォリオは公開してアピール

プログラミングやWebデザインの初心者が、 Photoshopなどで作った画像、...

記事をチェック