headerのロゴ画像

Works

合同産業株式会社 様

コーポレートサイトを制作しました。
対応範囲:デザイン/ HTML/ CSS/ jQuery/ WordPress/ 動画・写真撮影 /ライティング

コーポレートサイトのリニューアルに伴い、ディレクションからサイト公開までを全面的に対応しました。
クライアント様でも更新が可能なようにWordPressを採用し、オーダーメイドで制作しました。

リニューアル前の課題と目的

リニューアル前の課題として下記の3点がありました。

  • お問合せフォームがなく、電話で対応している
  • 求人情報が掲載されていない
  • 掲載情報が古い(更新に料金がかかる)

これらの課題を解決することを前提として、サイトリニューアルの目的を下記のように設定しました。

  • メールでのお問合せを獲得する
  • 求人サイトからの応募を獲得する

課題解決のための実施事項

それぞれの課題を解決するために実施したことをまとめました。

課題1:お問合せフォームがない

お問合せフォームを設置し、メニューの中でも目立つようにボタン形式にデザインしました。

また、お問い合わせへの導線(入り口)を増やすため、下層ページ全てにお問合せセクションを設置しました。

問い合わせメールは別途新たに作成したメールアドレスへ送信される仕様にしました。

課題2:求人情報がない

お問合せと同様に、ボタン形式のデザイン、各ページへのリンク設置を行い、入り口を増やしました。
さらに、求人用のバナーを作成し、トップページ中断に設置しました。
バナーのデザインは他のコンテンツに埋もれずに最も目立つように、あえてサイトデザインとは異なるコンセプトでデザインをしました。

求人情報はサイト(HP)自体に掲載するのではなく、求人サービス(エンゲージ)に登録して別サイトを作成しました。

求人サイトを利用した理由は下記の3つです。

  • 求人の露出を増やすため
  • 求人応募から採用までの応募者管理を専用画面上で管理できるため
  • HPに掲載することで求人サービスとHPの両方で求人情報を管理しなければならない手間を省くため
課題3:掲載情報が古い

サイト制作時点で最新の情報を掲載するために掲載画像を新しく撮影し、テキストもほぼ全てを刷新しました。
また、今後も費用をかけずに更新できるよう、クライアント様用の管理画面で画像・テキストの差し替えを行える仕様にしました。
投稿記事だけでなく、ほぼ全ての画像とテキスト(見出しなども含め)を差し替え可能です。

デザインコンセプト

デザインのコンセプトは「誠実、堅実で信頼性のあるデザイン」です。

カラー

テーマカラーはロゴに使用されている赤色にしました。

誠実・堅実・信頼をイメージできるように背景は白色とライトグレーを使用し、テーマカラーである赤色はあえて広い面積では使用せず、アクセントとして使うようにしました。

フォント

可読性を上げるため最もメジャーなNoto Sans JPをメインフォントにし、文字感覚は10%、行の高さは1.5に設定しました。
(見出し、ボタン等は別途設定)

アニメーション

複雑なアニメーションはあえて排除し、見やすいサイトを意識しました。
「細かいところで気が利いている」印象を持ってもらうためにセクションタイトルとボタンのアニメーションにグラデーションを使用しています。

グラデーションのカラーは赤とオレンジです。
赤色はテーマカラーでありオレンジは製品の色として頻繁に使用されています。
工場内で多く使用されていた「炎」をイメージすることもできるため、このグラデーションにしました。

また、ビジネス感を意識するあまり「つまらないサイト」になってしまわないようにスライドを多めに設置し、動画を挿入することで動き付け加えました。

画像(写真)

写真は工場で働く人々のライブ感を出すために、実際に勤務している現場に入り込んで撮影しました。
臨場感を出すためにあえて照明は一切使わずに現場の光だけで撮影しています。

SEO対策

広告などは使用せずに無料で行える基本的な対策を施しました。
行なったSEO対策は下記の5つです。

  • サーチコンソールでのサイトマップとインデックス登録
  • テキストコンテンツへキーワードを盛り込む
  • 画像のalt属性
  • Googleマイビジネスの登録
  • タイトルとディスクリプションの最適化
一覧へ戻る