ブログ /

その他

仕事に役立つ情報や面白いコンテンツをご紹介します。

【神は細部に宿る】コーポレートサイトをリニューアルしました!

当社のコーポレートサイトをリニューアルしました!
前のホームページが2010年2月ごろにリリースしましたので4年9ヶ月ぶりのリニューアルとなります。
今回は当社の備忘録も兼ねてリニューアルでこだわったポイントと内容をいくつかご紹介したいと思います。

ちなみに、、
当社は採用サイトを持っていますが、実はこの採用サイトの日々の改修、運用でここ数ヶ月の間で応募数40倍の実績を出すことに成功しました。(自分たちもビックリしています。。)
そこで成功した改修事項、ノウハウも取り入れてコーポレートサイトを作り込みました。
(採用サイトで何をしたら40倍になったかは、もし反響があれば近日公開したいと思います。)

ですので、採用ご担当者の方、ホームページをリニューアルしようと思っていらっしゃる方には少しでも参考になればと思います。

目次

  1. スマホファースト
  2. シンプル
  3. コンテンツを社内更新出来る
  4. 各カテゴリの内容
    ・News・Pickup job・for Staff・Company
  5. 細かいですがこだわった所
    ・ソーシャルボタンの色
    ・スマホのメニューアイコンが×になる
    ・ファビコン
    ・スマホのホーム画面に追加するとロゴが不定期で変化する
    ・マップのピンをロゴに

1.スマホファースト

当社は採用活動をするために多くの媒体を使っています。
その多くはフロムエー、バイトル、アン等など、、紙媒体では無くweb媒体です。
そして応募者の多くはスマートフォン経由で応募されます。今の時代パソコンからの応募よりも圧倒的にスマートフォンからの応募者の方が多いです。
では当社の中で某web媒体の、総応募数におけるパソコン、スマートフォン、ガラケー(普通の携帯電話)からの応募比率を示した図をご紹介しましょう。
こんな感じです。

20141103155136-ac6fa1d2239a2ba9ed0c31a0002de4f4a735f7b3.png

青色がパソコン、赤色がスマートフォン、黄緑色がガラケーです。
どうでしょうか?スマホの重要性が分かっていた方でも図にすると「ここまでか!」と思う方もいらっしゃるのではないでしょうか?もちろん職種や募集する年齢層によって結果は異なると思いますが、どの企業もスマホ比率は上がっているはずです。
当社では20代~30代女性が一番多い層ですが、この図の最後2014年4月以降も常に80%近くがスマホからの応募となっています。
さて、この図から分かるポイントは2つあります。

まず1つ目のポイントは2012年9月でモバイル(ガラケー)とスマホが逆転。
そして2つ目のポイントは2012年12月でパソコンとスマホが逆転。

その後はものすごいスピードでスマートフォンからの応募が上昇してきています。たったこの2〜3年で時代が変わってしまったんです。
この事実を受けて、やはりコーポレートサイトもスマートフォン対応は必須で、パソコンから考えるのではなくスマホから考えました。
スマホで使い易い操作性、デザイン、とにかくスマホファーストで考えました。

2.シンプル

スマホファーストで考えると、やはり色々なものを詰め込むよりもシンプルな方が良いという事にたどり着きました。
パソコンからデザインや操作性を考えると、あれもこれもと色々詰め込みたくなりますが、スマホの小さい画面で物事を考えるとやはりシンプルである方が使い易いな〜というのが当社の考え方です。
そして何よりデザイン性よりもコンテンツを目立たせたい!という思いもあり、デザインは極力シンプルに、ミニマルに、毎日見ても飽きないデザインを目指しました。あとはイベントがある時に演出を加えられるようにデフォルトのデザインにはシンプルさが必要でした。
是非今後の演出にも注目して頂ければと思います。

3.コンテンツを社内更新出来る

前のコーポレートサイトと大きく異なるのはコンテンツを日々更新していくという事です。そのため毎回業者さんに修正依頼をかけていては時間もお金も膨大になります。そのため社内でも簡単に更新作業が出来る仕組みが必要でした。そこで選んだのがムーバブルタイプというCMSです。
ここでは細かい話はしませんが、このCMSを使うことで管理画面から社内でいつでも更新作業が出来るようになりました。
また、今回はCMSも当社専用にカスタマイズして、より簡単に、そんなにweb知識がなくても社員がすぐに覚えられるようにしました。
実はサイトの見た目以上に、日々の運用を考えて裏側のCMSのカスタマイズにこだわって業者の方に作り込みをして頂きました。

4.各カテゴリの内容

各カテゴリを簡単にご説明します。

■News
ニュース記事やブログ感覚の情報発信ページです。■Pickup job当社採用サイトの中から今おすすめのお仕事を厳選して掲載します。採用サイトと連動しています。


■for Staff
スタッフさん向けの情報ページ。いくつかページがありますが、「Thank you」というページはディースパーク社員からスタッフさんに日頃の感謝の気持ちを390文字以内で伝えるページです。なぜ390文字なのか、、わかりますよね?■Company

会社概要などのページです。

5.細かいですがこだわった所

スマホファーストでシンプルなデザインにしましたが、そのぶん細かい所にこだわりました。
そんなの必要なの?と思わないでください。神は細部に宿るのです。

5-1.ソーシャルボタンの色

フェイスブック、ツイッター、グーグルプラスなどのソーシャルボタンの色をオリジナルの色からサイトイメージに合わせて黒ベースにカスタマイズしました。

20141104205135-5858f3cc9ba5b09e490c7e68f16643cbfca6beed.png

5-2.スマホのメニューアイコンが×になる

シンプルにするためにスマホの右上のメニューボタン「≡」を開いた後、閉じる時のボタン制作を検討した時に、最初は一番下に「閉じる」とか「CLOSE」にしようと思いました。しかしシンプルさを考えて「≡」が「×」にシュイ~ンと変化する様にしました。左上の虫眼鏡ボタンも同様です。

20141104211341-d0b5ef951acea62b3609bb55222dda95355e6238.png

5-3.ファビコン

これは普通かもしれませんが、リニューアル前のホームページには無かったので。ファビコンとはブラウザでサイトを開いたときに上に出るロゴです。ブックマークした時などにも出ます。

20141104204728-18b75f12c88b11ab930c8850a8f06952cdc61d12.png

5-4.スマホのホーム画面に追加するとロゴが不定期で変化する

コーポレートサイトを開いて「ホーム画面に追加」(アイフォンのサファリの場合)をすると当社のロゴがアプリの様にスマホに出ます。そしてこのロゴ、不定期で変化するようにしました。色が変わるのか、形が変わるのか、気になる方はホーム画面に追加して下さい(笑)

5-5.マップのピンをロゴに

当社のアクセスマップのページはグーグルマップを使用しましたが、グーグルマップのピンでは無く、当社のロゴを使用しました。

20141104213021-0cbd74e5af026d44300f0ac59865d94b6765eb70.png

まとめ

簡単に変更ポイントをご紹介しましたがいかがでしたでしょうか?
この中に採用サイトで応募数40倍の実績を出した重要ポイントもあります。

さて、重要なのはこれからの運用です。皆さんが少しでも見ていて楽しい、ためになるコーポレートサイトになるよう運用していきたいと思います!引き続きよろしくお願い致します。

Share
Categories: その他