サイトレビュー#1(製造業編)

ポートフォリオで製造業会社のコーポレートサイトを作るために、サイト分析をしました。
★マークがついたところは、分析を通しての自分の予想になります。
あくまで自分の主観によるところが多いですが、ご参考になれば嬉しいです。

①株式会社DHF（第一高周波工業）

誘導加熱を用いる高い技術力や歴史を持つ製造会社。

>>>色について
メインは#000,#fff,
#d71518プライマリーカラー
？#52f1ffセカンダリーカラ（PICK UPの見出しにしか使われていない）
⚠︎プライマリーカラーはほぼグラデーションとして使用（熱や火の色）
（★メインとする技術である誘導加熱を印象付けるためのプライマリーカラーでは？）
（★PICKUPに対して、新しい技術、最先端なイメージを持たせるセカンダリーカラーでは？）

>>>フォントについて
英語Oswald
細長くスタイリッシュな印象
日本語遊ゴシック
>>>ヘッダー
メニュー数７
製品・サービス、技術力、実績、DHFについて、採用情報、ニュース、お問合せ
+言語の切り替え
英語＋日本語表記
ホームはロゴにリンク付
>>>トップ
メインビジュアルには動画を使用。（人間よりも機械がアップの動画がメイン→★働きやすさよりも、技術力の高さをアピールしたいのでは？）
メインビジュアルに別ページ（DHFについて→DHF STYLE）誘導のリンク付（あまり見たことがなかった）
（★DHF STYLEが一番伝えたい優先事項なのではないか？）
セクションの流れは、PICKUP▶︎メニュー各々の全体概要（採用情報を除く）>>>その他
製品・サービスはカテゴリ別セクションの前に、カテゴリ・用途・キーワードから探す機能がついている
採用については別サイトがあり本サイトでは詳しく触れていない様子
アニメーションの速度が全体的に速い
丸い要素はない

全体の感想・イメージ
技術力の高さをとにかく印象付けられた。グローバルに展開していたり、特許を数々取得しているなどとにかく勢いのある会社であることが、サイトからも想像がつきやすい。

②株式会社岐阜多田精機

多田精機グループ - 金型のプロフェッショナル

金型を用いた製造会社。

>>>色について
メインは#333,#fff,
グレー系#f8f8f8,#9f9f9f,#484848など
青系#224060,#e4f1ffなど
全体としてコントラストが低く目に優しい色
同系色を少しづつ変えながら使うことで、色を多彩に使いながらもまとまりを出している
>>>フォントについて
英語ozwald,(lato)
日本語見出ゴMB31(落ち着きのあるイメージ)
（①同様英語にはozwoldが使われていた。使い勝手が良さそう）



>>>ヘッダー
メニュー数5
金型への思い（MISSION）、会社案内、技術紹介、採用情報、お問い合わせ
+言語の切り替え
英語＋日本語表記
ホームはロゴにリンク付
>>>トップ
メインビジュアルには動画を使用。（★①と比較すると、建物の外観や従業員の働く様子など、より会社全体を見せている→①（技術力の高さを押し出す）と比較して、採用などに重きを置いているのでは？）
セクションの流れは、ニュース→MISSON→技術紹介→グループ案内→採用情報（ナビとの関連性がない）


>>>その他
フッターにもナビがついている（ヘッダーのメニュー+ニュース）
（★ナビもトップに固定してあるのに、フッターに置く必要はあるのか？）
ファーストビューが、メインの動画をスクリーンいっぱいに映し出しており、その他の要素は言語切り替えボタンのみ（★スクロール誘導やナビがないことから操作に困るのではないか？）
淡いグレーを文字にも用いていることがあり、見づらい部分がある
コンタクトフォームのインプット欄に、placeholderを書いてある部分とそうでない部分があるが、基準がわからない

>>>全体の感想・イメージ
製造物や技術の高さというよりは、落ち着きのある会社の雰囲気が伝わってくるサイト。働きやすそうだなと思わせる。採用情報メニューのコンテンツが豊富で、先輩インタビューなど充実させていることから、採用に力を入れるためにコーポレートサイトを作ったのではないか？

③光岡自動車（株式会社光岡自動車）

https://www.mitsuoka-motor.com/

金型を用いた製造会社。

>>>色について
メインは#000,#fff,
紫のグラデーション（コードではなく、画像が使用されていた）
ホバー時#61bfcd(①のセカンダリカラーと似た色)
（★全体的に最先端で都会的な色が使用されている）

>>>フォントについて
英語Notera（読みやすさ＜お洒落、隣に読みやすくサブ見出しがふってある）, serif
日本語基本noto-sans、ラインナップ商品コピーnoto-serif
（①同様英語にはozwoldが使われていた。使い勝手が良さそう）
(★コピーのみセリフ体を用いることで、コピーがより印象的かつ魅力的に感じられる)

>>>ヘッダー
ヘッダーはロゴ＆言語切り替えのみでメニューはサイドに配置
メインメニュー数5
This is mItsuoka、ラインアップ、販売店、中古車、お問い合わせ
（★中古車のメニューをメインに配置していることから、中古車販売にかなり力を入れているのではないか？）
ナビメニュー数9
PCの時点でハンバーガーメニューを使用。メインメニューを含めた９つのメニューがある
ホームは、topボタン有、ロゴにリンク付
>>>トップ
二つに画面を分けた配置
左は、動画（セクションへの誘導リンク）
右セクションの流れは、ラインアップ、This is mitsuoka、ニュース


>>>その他
最近流行りのモバイルファーストレイアウト。
cubic-bezierを用いた細かいイージングが使われている。
メインメニュー、グローバルナビ、フッター、右側などメニューを配置している箇所が多数にあり、それぞれになぜそれを配置したのか複雑で考察できなかった
グラスモーフィズム

>>>全体の感想・イメージ
サイト全体を通して、トレンドが取り入れられた若者向けな印象。光岡自動車はそもそも個性的なデザインの車という印象があるらしく、サイトも王道で万人受けなレイアウトというよりは、デザイン性の高い最先端な印象を受けた。