ワンクリックに命がけのWEB・ホームページ制作会社「エムハンド」

インバウンドサイトを作るときに知っておきたいこと

【WEBデザイン10選】出そろった2017年度新卒採用サイトから注目デザインを厳選!

  • WEBデザイン

3月に入り就職活動が本格的にスタート。それに伴って、各社の2017年度版新卒採用サイトが、次々と公開されています。

いまや良い人材を確保するために必要不可欠とも言える新卒採用サイト。企業サイトとは別に特設サイトのような形で作られることが多い上に、新卒の学生ということでターゲットも若くなるため、コンセプトが面白いサイトや、トレンドの技術を取り入れたサイト、ユニークなデザインのサイトなど、クオリティーが高いユニークなサイトが数多くあります。今回はそのような新卒採用サイトの中でも、特に注目のサイトを選んでご紹介します。

これはチェックしておきたい!2017年度新卒採用サイト

DENTSU RECRUIT 2017

01
http://www.career.dentsu.jp/recruit/2017/


業種:広告代理店
サイトの特長:ワンカラムデザイン、フラットデザイン
キャッチコピー:答えがないから、電通がある。

日本最大の広告代理店「電通」の新卒採用サイトです。デザインはもちろん、採用コンセプトからコンテンツまで、どうすれば学生に響くかがしっかりと考え抜かれており、全体的な印象として「何か新しいものを生み出す会社である」という、面白さや期待感を感じさせるサイトになっています。デザインとしてはフラットデザインを基本にしながらも、ボタンには独特のパターンを使っているなど、細部まで作り込まれたサイトになっています。

東急エージェンシー 2017採用サイト

01
http://www.tokyu-agc.co.jp/recruit/2017/special/top.html


業種:広告代理店
サイトの特長:ワンカラムデザイン、フラットデザイン、パララックス

東急エージェンシーの採用サイトは、スッキリとした白地に、アニメーション付きで人物が読み込まれていくトップページが印象的です。こちらも広告代理店ということで、オブジェクトが個性的な形にトリミングされていたり、タイトルのフォントがデザインに合わせて三角形を組み合わせた幾何学模様のようなものになっていたり、随所にクリエイティブと遊び心が感じられます。今回開始された職種別採用にもつながるコンテンツ「働く意味とは?」や、漫画コンテンツ「就活用心棒」など、企画面でもバラエティ豊かなサイトとなっています。

ヤフー株式会社 採用情報

01
http://hr.yahoo.co.jp/


業種:情報・通信
サイトの特長:ワンカラムデザイン、レスポンシブWebデザイン、フラットデザイン、動画

Yahoo! JAPANの採用サイトです。背景全面動画、社員インタビューの写真にマウスを載せると360°写真が回転、フラットデザインのピクトグラムで見せるコンテンツ「WHAT IS THIS NYMBER」、公式インスタグラム…と、トップページを見ていくだけでもWEBのトレンドがわかるような作りになっています。サイトはレスポンシブ対応しており、モバイル時のナビゲーションも参考になります。

NTTデータ新卒採用サイト2017

01
https://nttdata.saiyo.jp/newgraduates/


業種:情報・通信
サイトの特長:ワンカラムデザイン、グリッド、レスポンシブWebデザイン

NTTデータの新卒採用サイトは、コーポレートカラーのネイビーで全体のトーンを統一。レイアウトは整理されたグッリドデザインですが、部分的にカードレイアウトのようになっている箇所もあって、とても見やすく設計されており、レスポンシブ対応もなされたサイトとなっています。コーポレートサイトとのトンマナを揃えつつも、学生というターゲットに合わせてさらにデザイン性の高いサイトにする、という考え方がページからしっかりと感じられます。

MITSUBISHI MOTORS 採用情報

01
http://www.mitsubishi-motors.com/jp/corporate/recruit/17/


業種:自動車
サイトの特長:ワンカラムデザイン、パララックス
キャッチコピー:さあ、未知を走ろうぜ!

ファーストビューのメインビジュアルとして、ポリゴンデザインの車が目に飛び込んでくる「三菱自動車」の採用サイトです。全ページ、スッキリとしたワンカラムデザインになっており、とても見やすいサイト。トップページには、スクロールすると下のコンテンツが上に重なっていくようなパララックスが施されています。それによって、単にシンプルなサイトというだけで終わってしまわない、印象に残るデザインに仕上がっています。

関西テレビ RECRUIT 2017

01
http://www.ktv.co.jp/recruit/


業種:放送
サイトの特長:2カラムデザイン、レスポンシブWebデザイン、フラットデザイン、パララックス
キャッチコピー:“いま”と“これから”を楽しめる人へ

関西テレビの新卒採用サイトです。左がナビゲーション、右がコンテンツという作りで、ページをスクロールしていってもナビゲーションがわかりやすく、ページ遷移しやすい構成になっています。ロゴ風にデザインしたキャッチコピーをはじめ、全体のトーンがPOPでキャッチーなものになっており、フラットデザインやパララックスの動きととても相性の良いデザインになっています。レスポンシブ対応時の挙動も美しく、よく考えられたレスポンシブWEBデザインの参考としても要チェックです。

パソナキャリア新卒採用サイト2017

01
http://www.pasonacareer.biz/recruit/


業種:人材派遣
サイトの特長:ワンカラムデザイン、レスポンシブWebデザイン、フラットデザイン、パララックス
キャッチコピー:社会視力で、創ろう

パソナキャリアの新卒採用サイトです。ビジュアルで見せる構成がワンカラムデザインに適しており、それぞれのコンテンツがわかりやすく目に入ってきます。また、「社会視力」というユニークなキーワードで、メッセージをしっかりと伝えています。特にトップページのメインビジュアルは、このコンセプトを強調するためのギミックのある面白い仕組みになっており、コンセプトがしっかりとした採用サイトだと言えます。

資生堂グループ 2017年度 定期採用情報

01
https://www.shiseidogroup.jp/teiki/


業種:美容
サイトの特長:レスポンシブWebデザイン、グリッドデザイン、フラットデザイン
キャッチコピー:美しさを通じて、世界中の人々を幸せにしたい人、集まれ!

資生堂グループの採用サイトです。グループ全体の採用サイトのトップから、「総合職採用」「美容職採用」それぞれの採用サイトに移動する作りになっており、その先では職種でガラッとイメージを変えたページが展開されていきます。採用する職種が複数ある場合は、この資生堂のサイトのようにしっかりと情報を整理した上で、ユーザーの立場に立った導線を意識して制作していくことも重要。そのような構造を考える際の参考になりそうなサイトです。

第一生命新卒採用

01
http://www.dai-ichi-saiyo.jp/2017/


業種:保険
サイトの特長:レスポンシブWebデザイン、グリッドデザイン
キャッチコピー:最良の道を行こう。

第一生命の新卒採用サイトです。情報量の多いサイトですが、レスポンシブ対応も施されており、デバイスを選ばず見やすい仕上がりになっています。レスポンシブWEBデザインでグリッドデザインというと、どのサイトも似たようなデザインや印象になってしまいがちですが、このサイトはひとつひとつのビジュアルを完成度の高いものにすることで、そこを解決。ディテールにも参考になるポイントが多く、非常に参考にできるサイトです。

JETRO 2017年度新卒採用サイト

01
https://www.jetro.go.jp/recruit/info/


業種:独立行政法人日本貿易振興機構
サイトの特長:レスポンシブWebデザイン、グリッドデザイン、フラットデザイン
キャッチコピー:世界の最前線へ

JETROの新卒採用サイトです。組織のイメージから考えるともっと固いサイトを想像してしまいますが、魅力的な人々の写真を多用し、学生を意識したわかりやすいサイトになっています。特徴的なのは、雑誌のレイアウトのような大胆なタイポグラフィーやキャッチコピーの処理の仕方。デザインに動きが出てインパクトもあり、他の採用サイトとの差別化にも一役買っています。

今回のまとめ

今回はクオリティーの高い「2017年度新卒採用サイト」を見てみました。いかがだったでしょうか?採用に携わっている方以外、なかなか採用サイトを見ることはないかもしれませんが、攻めのデザインで新しい技術を取り入れたものも多く、クオリティーの高いサイトが多いことがわかっていただけたかと思います。

眺めていると、自社サイトにも活かせそうなヒントが見つかったり、色々なアイデアが湧いたりしてくるかもしれません!今回ご紹介した以外の採用サイトも、この機会にぜひチェックしてみてはいかがでしょうか。

<関連記事>
【WEBデザイン10選】春間近!ピンク色を効果的に使ったサイトまとめ
【WEBデザイン10選】丸を効果的に使ったデザインのサイトまとめ

seleQt

この記事に関連する記事

カテゴリー

アクセスランキング

月間

  1. 1

    いまさら聞けない!フリック、スワイプ…スマホ操作の基本用語まとめ

  2. 2

    今どきの幼稚園・保育園ホームページ研究。32サイトに見る傾向と課題とは?

  3. 3

    【WEBデザイン10選】これぞ進化系!今どきのレスポンシブWEBデザインサイトまとめ

  4. 4

    「プッシュ通知はアプリのもの」は過去の話。簡単にできるブラウザでプッシュ通知する方法

  5. 5

    【WEBデザイン10選】シンプルでわかりやすい「1カラム」サイトまとめ

  6. 6

    【保存版】アツイ視線が集まる激戦区!女性向けWEBメディア50選

  7. 7

    【WEBデザイン10選】雑誌風デザインを上手く取り入れたWEBサイトまとめ

  8. 8

    結果につなげるLINE@活用。最新集客事例に学ぶ成功の6つのポイントとは?

  9. 9

    【WEBデザイン10選】効果的に動画を使ったキャンペーン、プロモーションサイトまとめ

  10. 10

    【WEBデザイン10選】背景に動画を大胆に使った日本のサイトまとめ

総合

  1. 1

    いまさら聞けない!フリック、スワイプ…スマホ操作の基本用語まとめ

  2. 2

    【保存版】アツイ視線が集まる激戦区!女性向けWEBメディア50選

  3. 3

    【WEBデザイン10選】これぞ進化系!今どきのレスポンシブWEBデザインサイトまとめ

  4. 4

    初めてでもできる!iPhone動画編集アプリ【厳選4つ】

  5. 5

    【WEBデザイン10選】コンバージョンUPにも!パララックスを効果的に使ったLPまとめ

  6. 6

    【WEBデザイン10選】シンプルでわかりやすい「1カラム」サイトまとめ

  7. 7

    【事例に学ぶ】話題の新興SNS、Instagramを集客に使うコツ

  8. 8

    今どきの幼稚園・保育園ホームページ研究。32サイトに見る傾向と課題とは?

  9. 9

    【WEBデザイン10選】背景に動画を大胆に使った日本のサイトまとめ

  10. 10

    【WEBデザイン10選】雑誌風デザインを上手く取り入れたWEBサイトまとめ

エムハンドブログ編集部

  • 編集長みつむね

    得意分野はWEBマーケティング/コンテンツ編集。「インバウンドブログ」立ち上げから編集に参加。

  • 伊藤 高啓

    SNS運営からWEB広告/マーケティング業界を経て、鳴り物入りでエムハンドブログ編集長に就任。

  • 新棚幹太

    雑誌出版社を経てフリー編集者に。東京生まれ、京都暮らし4年目のオールラウンドライター。

  • 島田

    某グルメ雑誌の編集長を経て、業界違いのWEBへ転身。独自の視点で個性的な記事を手がける。

  • ヨネクラ

    WEBメディアの立ち上げに参加したくエムハンドライティングチームに参加。早稲田大学出身。

  • キクチ

    京都大学卒業後、京都大学院工学研究科に進学。研究を続けながらライター業に従事。

  • 池田仮名

    週末Webプランナー。情報システムの発展によって変化していく人の心や共同体のありかたに興味。

最新記事

  • M-HAND 士業
  • M-HAND 歯科
  • Logonic
  • M-HAND TechnicalBlog

ワンクリックに命がけのホームページ制作会社「エムハンド」