問い合わせが来る採用サイトのポイントとは

アスキー 2018年02月14日(水)09時00分配信

 第1回から第3回までは、「コーポレートサイト」の作り方を基礎から解説しました。第4回から第6回では、目的特化型で需要も高い「採用」にフォーカスします。第5回となる今回は、採用サイトを自社で公開する意味、代表的な職種別のアピールポイント、サイトの構成、テンプレート選びについて説明します。

本記事連動セミナー、2018年2月21日(水)に開催!

 ウェブサイトからの人材採用を主眼にした採用方法についてのセミナーイベントを開催します。詳細は下記バナー画像よりご覧ください。

910-439

1.採用サイトの作り方とデザインのヒント

 BiNDには採用サイトを作るのに便利なテンプレートがいくつか収録されています。今回はそのテンプレートを使ってカスタマイズしていきます。基本操作は第2回で説明しましたので、大切なポイントのみを解説していきます。

 ページ内容については、第2回で解説した方法にもとづき、各コンテンツブロックをていねいに変更していきます。ここでは、ポイントとなる部分を説明します。

 ページ内でもっとも目を引くのは、上部のキービジュアルとキャッチコピーです。まず、この部分を自社のイメージに合う内容に変更しましょう。

 BiNDを利用する場合、キービジュアルは、画面左上の「設定」ボタン(歯車のアイコン)から「ページ設定」のタブを開き、「ビルボード」の画像を変更します。「画像ファイルの選択」で、「写真フォルダ」にある画像を選ぶのが手軽です。自分たちで撮影した写真、無料素材や有料素材を用意し、「ユーザーフォルダ」にアップロードしたものを使うのもよいでしょう。

 キービジュアル上のキャッチコピーは、ブロックエディタから編集できます(ブロック左上の「編集」をクリック)。右側の画像の部分の「編集」をクリックすると、BiNDクラウドに用意されている画像編集ツール「SiGN Pro」が開くため、キャッチコピーのテキストが直接編集できます。編集が終わったら「完了」「適用」をクリックすると、ページに反映されます。

 コーポレートメッセージやブランドメッセージなど、最近のキャッチコピーのトレンドには、「句点(。)をつけて言い切り感を強める」「英語(カタカナ語)に頼らず、日本語の語感を活かす」といったことがあります。ミライフォースでは、「Make a New User Experience.」という英語を飾りとして用いながら、日本語では「あなたとつくる、顧客体験のミライ。」としました。

 ここで「つくる」をひらがなにしたのは、有形のモノを「作る(制作する)」だけでなく、無形の体験などを「創る(創造する)」という意味を込めたいと考えたからです。また、「ミライ」は「ミライフォース」という社名にかけて、漢字ではなくカタカナにしました。

 さて、ほかのブロックも同様に、1つひとつていねいにカスタマイズしていきましょう。

bi5
1.ミライフォースで選択したBiNDテンプレート「Certified Tax Accountant Office」を開く
bi5
2.画面左上の「設定」ボタン(歯車のアイコン)をクリックし、サイトやページの基本情報を設定。ミライフォースでは、サイト設定→サイト名「株式会社ミライフォース 採用サイト」、ページ設定→ページ名「シングルページ」、ページ設定→ページタイトル「[BD:site_name]」と入力(シングルページなので、サイト名だけが表示されるように)
bi5
3.キービジュアルの変更。画面左上の「設定」ボタン(歯車のアイコン)から「ページ設定」のタブを開き、「ビルボード」の画像を変更する
bi5
4.キービジュアル上のキャッチコピーを変更。ブロックエディタの右側、画像の部分の「編集」をクリックすると、BiNDクラウドに用意されている画像編集ツール「SiGN Pro」が開く
bi5
5.SiGN Pro上で、キャッチコピーのテキストを直接編集
bi5
6.編集終わったら「完了」「適用」をクリックすると、ページに反映される

 なお、自分でビジュアルを用意するのが難しい場合は、デジタルステージのテンプレート素材提供サービス「materials」を活用するのがオススメです。1000万点以上の素材が揃っており、ポイントを使えば無料で利用可能です。

htse
materials

 またフォントは、画像ではなくテキストとして表示される「Webフォント」を使うと、検索エンジンに対する内的SEOの効果が期待できます。FONTPLUSが提供する500書体近くもの日本語フォントが使えるので、キャッチコピーの持つ言葉をより印象的にするのにとても役立ちます。

1619878
BiNDクラウドではfontplusが提供する500書体近くもの日本語フォントが使えます

2.3職種の募集要項を書く

 エンジニア、デザイナー、セールス/マーケティングの3職種に対するアピールポイントは、第4回で解説しました。以下、ミライフォースでの3つの募集要項文言を具体的に見ていきましょう。

エンジニア

 ウェブサイト制作やウェブサービス開発に関する業務が中心です。自由で柔軟な職場環境で、開発業務に取り組んでいただけます。セミナー参加費補助、書籍購入制度のほか、週1回程度のリモートワーク、マシンやソフトウェア<3733>の積極的なリプレース、クラウド環境を利用したプロジェクト進行などを行なっています。

必要なスキル
・サーバサイド実装技術(PHPなど)
・フロントエンド実装技術(JavaScript)
・SassなどCSS<2304>プリプロセッサの利用経験
・Gitなどバージョン管理ツールの利用経験

歓迎するスキル
・PHPやJavaScript以外での開発経験
・スマートフォンアプリの開発経験
・テクニカルディレクションの経験

給与:正社員 月25万円~(能力・経験に応じて決定)

デザイナー

 ウェブサイト制作やウェブサービス開発に関する業務が中心です。プロジェクトの企画段階から参加することが多く、デザイナーとしてのやりがいを強く感じられると思います。平日と休日のメリハリがはっきりしていること、育児への社内理解など、ワークライフバランスを保てる就業環境のもとで働けます。

必要なスキル
・グラフィックデザインの経験
・ユーザーインターフェイス(UI)デザインの経験
・Adobe Illustrator/Photoshopの利用経験
・HTML、CSS<2304>、jQueryなどフロントエンド実装の経験

歓迎するスキル
・UX(ユーザーエクスペリエンス)デザインの経験
・エディトリアル(編集)デザインの経験
・ウェブディレクションの経験

給与:正社員 月25万円~(能力・経験に応じて決定)

セールス/マーケティング

 ウェブサイトやウェブサービスの新規案件開拓、ウェブマーケティングの企画立案・実施、ワークショップのファシリテーションなどを担当していただきます。コミュニケーションが中心の仕事ですので、段取り力や提案力の高い人、自分で仕事をどんどんリードできる人が希望です。

必要なスキル
・アクセス解析(Google Analyticsなど)の経験
・検索エンジン最適化(SEO)の経験
・広告運用に関する経験
・ほか、ウェブマーケティングに関する全般的な知識

歓迎するスキル
・ライター/エディターの経験
・サイト設計や画面設計などの経験
・マーケティングオートメーション(MA)の利用経験

給与:正社員 月30万円~(能力・経験に応じて決定)

 以上のように、「担当業務の説明」「必要なスキル」「歓迎するスキル」「給与」の4つを含めることにしました。特にスキルについては、“must have”と“nice to have”を分けることで、より確度の高い応募者が集まるように工夫しました。

 なお、すべての職種に共通の「応募資格」や「福利厚生」などについては、直前のブロックに載せることにしました。通り一遍の内容だと見た人の記憶に残らないので、アピールポイントとして「カフェのようなオフィススペース」「東京と札幌支社でのマルチワーク」「札幌支社では、夏はビルの屋上で花火見物/ビアガーデン至近」という、ミライフォースならではの内容を含めてあります。

 数ある会社の中から自社を転職先として選んでもらうには、何か「決め手」が必要です。とはいえ、人によって決定打は異なるため、さまざまな角度から会社の魅力を伝えることが大切です。

bi5
1.エンジニア、デザイナー、セールス/マーケティングの3職種の募集要項には、「担当業務の説明」「必要なスキル」「歓迎するスキル」「給与」の4つを含めた。特にスキルについては、“must have”と“nice to have”を分けることで、より確度の高い応募者が集まるように工夫した
bi5
2.すべての職種に共通の「応募資格」や「福利厚生」などについては、直前のブロックに載せることにした。見た人の記憶に残るように、ミライフォースならではのアピールポイントを含めた

3.採用エントリーフォームを用意する

 次は、ページの下部に採用エントリーを受け付けるための入力フォームをBiNDで用意してみましょう。

 BiNDのフォーム機能「Smooth Contact」にはあらかじめニーズの高いフォームのテンプレートが用意されています。その中で今回は「採用応募フォーム」を選択しました。必要な入力項目がひととおり用意されていますので、募集職種などを自社に合った内容にカスタマイズしましょう。不要な項目は削除してかまいません。

 次に、デザインを決めましょう。ボタンの色や形などを簡単に変えることができるので、サイトの雰囲気と合うものに変更します。

 通常の問い合わせフォームなどとは異なり、採用応募フォームではさまざまな項目を入力してもらう必要があります。このような場合でも、「住所」には「履歴書などの返送に利用します」、「電話番号」には「面談日時の調整などのために必要です」といった但し書きをつけておくと、応募者の安心感が増すでしょう。

bi5
1.ブロックエディタで「フォーム」を選択し、右側の「フォームの編集」をクリックすると、Smooth Contactが立ち上がる
bi5
2.Smooth Contactのフォームテンプレートの中で「採用応募フォーム」を選択する
bi5
3.必要な入力項目がひととおり用意されている。募集職種などを自社に合った内容にカスタマイズする。不要な項目は削除してかまわない
bi5
4.「デザイン」のタブに切り替え、「カスタムモード」をクリック。文字色などをサイトの雰囲気と合うものに変更する
bi5
5.画面上の「フォーム一覧」をクリックし、新規で作ったフォームを「BiNDで使う」に設定。BiNDの画面に戻って「適用」を押すと、新規で作ったフォームが埋め込まれる
bi5
一次完成したミライフォースの採用サイト

次回予告

第6回では、「採用メッセージ」を手厚くするために、採用担当者のインタビューを用意し、コンテンツに含める方法を解説します。また、内容を全体的にブラッシュアップし、採用希望者に会社の魅力をよりいっそう伝える方法を説明します。


bi5
最新のBiNDクラウドでは、「新テンプレート」、サイト自動生成機能「AiDジェネレーター」、ウェブサイトへの集客を強化する「SEOアシスタント」、ページ遷移を後押しするアニメーション機能「SHiFT」、新・画像編集ソフト「SiGN」、サーバー機能も使えるオンラインサービス「BiNDクラウド」など、さまさまな機能が追加・強化されている

(提供:デジタルステージ)

本記事連動セミナー、2018年2月21日(水)に開催!

 ウェブサイトからの人材採用を主眼にした採用方法についてのセミナーイベントを開催します。詳細は下記バナー画像よりご覧ください。

910-439
アスキー
もっと見る もっと見る

【あわせて読む】

    最終更新: 2018年02月14日(水)09時00分

    【関連ニュース】

    【コメント】

    • ※コメントは個人の見解であり、記事提供社と関係はありません。