ウェブ系企業の就職率アップ!面接に役立つ仮想サイトの作り方

おなやみくん
将来フリーランスとしてやっていきたいけど、その前に就職して実力をつけたい。
でも、未経験の自分が就職するなんてできるか不安がある。就職にはポートフォリオが良いっていうけど、どんなサイトを作ればいいのかわからない。

こんにちは。ゆーへーです。

就職したいけど、どうすればいいですか?という質問はたびたびもらいます。
必ずと言っていいほど、ポートフォリオを作ってきてください。という返事が返ってきます。

ここで起きる問題の一つとして、「どんなサイトを作ればいいのかわからない」です。
これってかなり重要な問題でして、クライアントから何でもいいからサイト作ってきてと言われているのと同じ状態です。

これだと中身が空っぽで、ダメなサイトが出来上がります。

なので仮想サイトを作ってポートフォリオにしましょう。

新感覚スカウト型求人サービス「Swicth.」

仮想サイトを作ってポートフォリオのクオリティをあげる。

おなやみくん
仮想サイト??
ゆーへー
想像で作るサイトの事だよ

ウェブ系企業やデザイン事務所で働くには、ベテランの経験者でない限りポートフォリオが必要となってきます。

仮想サイトを作るメリットは3つ

  • 1つのサイトを1人でデザインから公開までできることの証明
  • 簡単なデザインがある程度できる事の証明
  • 模写ではなく制作なので、面接時の評価が高い

仮想サイトには、様々な技術が必要になってきます。
作って完成させるだけでそれを証明することが出来るのです。なので面接での評価は当然高くなってきます。

仮想サイトの作り方

1.作るサイトを決める

  • 趣味から仮想サイトを作る
  • 小中高の部活から仮想サイトを作る
  • イベントの仮想サイトを作る
  • 地元の飲食店の仮想サイトを作る

僕が進めるオススメの作り方は、地元のレストランか部活ですね。
地元のレストランだと素材も撮りに行きやすいし、ほんとのサイトを作るみたいでよりリアルですよね。なんなら営業かけても良いですし。

2.内容の決め方

まず、コンテンツを決めなければいけません。
レストランに必要な情報は、他のレストランを調べるとすぐに出てきますよね。

  • 店舗情報(アクセス情報)
  • ギャラリー
  • メニュー(価格)
  • おすすめ商品

ざっくりですがこんなところですかね。
仮想なので、メニューとかおすすめ商品は適当にきめてもOKです。
それっぽい感じにしましょう。

3.デザイン&HTML化

内容が決まれば、デザインとHTML化します。
デザインを自分で考えるのは最初は難しいので、これも同業種で良い感じのサイトを見つけてきて、パクりましょう。
気になる動きとかあれば、それも真似して作るとなお良いですね。

初学者の方はほぼアニメーションを使っていません。
transitionをもっと使うようにするとそれだけでワンランク上のサイトが作れます。
例えば、ボタンのhoverアニメーションとかですね。ふわっとさせたり色変えたり。

4.公開

HTML化が終われば公開です。
ここまで一人でできれば、もう一人前ですね。ここまで来てやっと初心者脱出です。

ただ仮想サイトなので、検索には引っかからないようにしておきましょう。
noindexだけだと絶対じゃないので、BASIC認証もかけておきましょう。

ポートフォリオサイトなら、サイト全体にかけておくのが良いかと思います。

BASIC認証のかけ方がわからない人は、サーバーの管理画面からもアクセス制限が簡単にかけれるエックスサーバーを選ぶのが良いでしょう。
他にも良いサーバーはあるので、こちらの記事を参考にどうぞ。

関連記事

【初心者向け】機能で選ぶレンタルサーバーのすすめ。

まだ自信のない方はTECHACADEMYをうけるのもありです。
はじめてのプログラミングコース

面接では、ポートフォリオの質が採用のカギを握る

先日の赤ヒツジ先生の家庭教師で、ある生徒が面接で落とされたときき、仮想サイトを作って提出したら評価がぐっと高くなるので採用率があがるとアドバイスしました。

次の面接では、高評価をいただけたとのこと。結果はまだこれからみたいです。

また他の生徒でも同じように仮想サイトを作って面接にいくと高評価を得られたとのこと。
模写だとただの真似なのでソースコピーしたら簡単にできてしまうんですが、仮想サイトは1からオリジナルのコードですから評価が高くなるのも当然ですね。

面接では、どういった理由でこのサイトを作ったのか?このサイトを作るのにどれくらいかかったのかをよく聞かれますので、理由も用意しておきましょう

口だけの人間は、ポートフォリオを見るとばれる

  • 仮想サイトを作る
  • ポートフォリオをまとめる(3つくらい仮想サイトを作ると良し)
  • クオリティを上げていく

ウェブ系企業は基本即戦力を望んでいます。
少なくとも0から指導する会社は、今はほとんどないでしょう。

やる気なしと判断されます。
事実0からウェブ系企業に就職したいって人がきたら、口だけのやる気はあるけど、能力もやる気もないって判断されます。

面接もプレゼンも準備の段階からすでに始まっています。
面接をうまくのりきるにはポートフォリオをしっかり準備しておこう。

新感覚スカウト型求人サービス「Swicth.」
@type(未経験OK案件多数あり)

面接に有利と書きましたが、ランサーズなどの提案の時にも有利ですよね。

この記事を書いた人

Yuhei Katayama

【フロントエンドエンジニア】

2014年よりフリーランスとして活動開始、3年目。タイが好きでよく行く。人手不足を補うをもっとうに仕事しています。HTML、Wordpress、EC-CUBE、MakeShop、カラーミーショップ、楽天のカスタマイズ経験あり。

この記事が気に入ったら
いいね!しよう

最新の情報をお届けします

赤ヒツジ先生~コーディングチェック~

このサービスは、コーディングのHTMLチェックではなく、デザイン通りにコーディングできているかをチェックするサービスです。