【建設会社】カッコいいホームページ制作デザインまとめ！信頼感のあるデザインは？
今回は建設会社に絞った、Web制作会社が、おしゃれなホームページデザインや印象に残ったホームページを集めました。
デザインだけでなく、コンテンツにも注目すると、より理解が深まるのではないでしょうか。トレンドの参考にもなります。
建築会社や工務店のホームページデザインとは違い、しっかりとした会社であるという印象を訪問者に持ってもらいたいという会社が多かったように感じます。
巨大なプロジェクトが多いでしょうから、クリエイティブさよりも信頼感が大切なのでしょう。
信頼感のある建設会社のホームページデザイン
村本建設
「愛をもっと村元という」キャッチコピーとセットのムービーで始まるメインビジュアルを使用しています。様々な現場の人間が誠実に働いている様子が伝わってきます。全体的に水色をベースにデザインし、爽やかで信頼を得られそうなデザインをしています。「愛のあるエピソード」というユニークなコンテンツが、会社のカラーがとてもよく出ている良いコンテンツではないかと思いました。
七浦建設株式会社
栃木県の建設会社のホームページです。最近では少し珍しいですが、マウスにアニメーションが付いてきます。いやらしくない程度のアニメーションとなっており、またリンクをクリックすると追従するアニメーションが目立つようになるなど、ユーザビリティの面でも配慮されています。オレンジをポイントに使ったデザインとなっており、フッターには適切なCTAも設置されています。
共立建設株式会社
https://www.kyoritsu-con.co.jp/
NTTの関連会社である建設会社のホームページです。赤色で全体がまとめられています。赤色は攻めたイメージになりがちですが、ポイントで必要最低限に赤色を利用することで、イケイケというよりは情熱的なイメージが伝わってきます。ソリューション部分のリンク先がシンプルな文字のボタンになっているのですが、こういったリンクも意外にわかりやすいなと参考になりました。沿革が非常にボリューミーで、3ページに渡ってまとめられている沿革は初めて見ました。「街をつくる、人をつなぐ、技術を活かす」というアニメーションが、キャッチコピーとマッチしたアニメーションになっている点も素晴らしいです。
誠実さを感じる建設会社のホームページデザイン
西野建設工業株式会社
https://nishinokensetsukogyo.co.jp/
印象的なキャッチコピーを明朝でシンプルに打ち出したファーストビューが印象的です。全体として優しい印象になっており、誠実な印象を持たせてくれます。ポイントで縦書きを利用しており、メニューであることが縦に記載されている影響でわかりやすいです。授業内容などシンプルにまとまっており、建設会社として最低限シンプルにまとまっている良い事例ではないでしょうか。
松栄建設
優しい黄緑色で全体がまとめられています。おそらくロゴのカラーに合わせたのでしょう。柔らかい印象だけでなく、所々に細かいデザインのこだわりが感じられます。ハンバーガーメニューはメニューではなく「OPEN」というラベリングになっていたり、電話番号もポイントでカラーが変わっています。更新頻度の高いブログも日付の部分が可愛らしく差し込まれているのが印象的です。
株式会社スミカ
インパクトのあるメインビジュアルではなく、メインビジュアルがアニメーションを含んだメニューになっているのが非常に個性的ですが、使いやすい感じがします。ロゴに合わせてゴールドをベースにまとめられているのですが、いやらしさは全くなく、上品で現代的な印象になっています。全体的に少し堅い印象を差し込まれる、1筆書きで書いたようなイラストが中和してくれています。
カッコいい建設会社のホームページデザイン
株式会社尾上建設
濃いネイビーで全体がまとめられた、とにかくかっこいいホームページデザインの建設会社のホームページです。スクロールすると追従するタイプのメニューはよく見かけますが、このように立てて追従してくるパターンは珍しく印象的です。大きな写真を気持ちよく、しかも効果的に利用しているデザインは参考になります。これだけデザインにこだわると、制作物も建設物もこだわりを持ったクオリティの高いものに仕上げてくれそうなイメージになりますね。
日建設計コンストラクション・マネジメント
キャッチコピーと次々と切り替わる動画、そして最新のインフォメーションが全て表示されるメインビジュアルが印象的です。細目の文字をスペースを活かして効果的に配置しています。WEBフォントが効果的に利用されていますね。シンプルに掲載されがちな施工実績も写真がしっかり映えるような構成となっており、更新は少し大変かもしれませんが、お客様からの印象は非常に良いのではないでしょうか。
大豊建設
印象的なアニメーションと赤色でインパクトの強いアルファベットが印象的なホームページデザインです。ポイントで明朝の文字を利用し、メインビジュアルだけでなく、スクロールしていてもかっこいいです。ギャラリーは今となっては珍しいコンテンツですが、写真のクオリティが高いので、会社のブランディングに一役買っている形となっています。トップページだけでなく技術ソリューションページもかなりこだわっていて、とにかくアニメーションを効果的に利用し、顧客に世界観を伝えられているのではないでしょうか。
世界観を感じる建設会社のホームページデザイン
山﨑建設工業株式会社
あえてレトロにした写真加工を効果的に利用したホームページデザインです。ノスタルジックな雰囲気が独特の世界観を持っていてオシャレです。どういった狙いなのかはわかりませんが、フッターにメニューが一切なく、挑戦的な構成となっています。グーグルマップに過去の実績がまとめられている形式は、培った歴史をビジュアル的にわかりやすく表示する手法として大変有効ではないかと思いました。
株式会社野村建設
https://www.clasico-nomura.jp/
建設会社でも、住宅を前面に打ち出した建設会社もあります。モダンな感じや和風な感じ、そしておしゃれな感じを同時に実現するような、シンプルながらもオシャレさが伝わってくるデザインです。写真のセンスがとにかく良いです。スクロールに合わせて写真が上下方向に少しずつずれる、気持ちのいいアニメーションは、ぜひどこかで取り入れたくなりますね。
大手感のある建設会社のホームページデザイン
戸田建設株式会社
とにかく様々なステークホルダーに様々な導線を用意したトップページは、大手である印象を感じさせます。フッターあたりに掲載されているたくさんのバナーも、大手のホームページにありがちで、大手感の演出に一役かっているのではないでしょうか。デザイン的に特別お洒落というわけではありませんが、シンプルながらも見やすく、そして現代的にまとめる、ユーザービリティを意識したデザインとなっている点は参考になる企業も多いのではないでしょうか。
大成建設株式会社
TVCMでも有名な大成建設のホームページです。大きなコンテンツを大胆に表示させるデザインが印象的です。ロゴのカラーに合わせて全体がまとまっているところを見ると、デザインポリシーが決まっているのではないかという印象があります。実績がサイト内検索でフリーワードで探せる仕様になっており、数多くの実績がある場合はこういったユーザビリティも必要になってくるのかと感じさせられました。
西松建設株式会社
大手感満載の、様々なページに移動しやすいハブに特化したトップページのホームページデザインです。「数字で見る西松建設」というコンテンツはインパクトがあって、会社としての迫力を感じます。全体として綺麗にまとまっているのですが、技術ページなどが他の資料からの使いまわしだろうというデザインで、バナーが一致しないデザインが所々挟み込まれており、この辺を統一できるともっと世界観の伝わるホームページデザインになるんだろうなと感じました。
建設会社のホームページに必要なページ・コンテンツは？
企業概要
会社背景・想い
会社がいつ設立されたのか、どのような経緯で事業を始めたのかを説明することで、それが強みや仕事ぶりに伝わってきますから、会社の背景を理解してもらうことは重要です。また同様に会社の歴史、ミッション（使命）、ビジョン（将来の目標）、価値観を掲載することも重要になってきます。
経営陣紹介
会社のMVVだけでは伝わりきらなかった部分であったり、会社のこれから目指している未来についてなど、経営陣の想いとして紹介できると、より会社の魅力が伝わります。
また顔写真を掲載することで、安心感を伝えることにも繋がります。
こちらの会社さんのように、複数のお写真があると、プロフィール写真のような堅い印象以外も伝えることができて素敵ですね。
事業拠点・対応エリア
地域密着であったり、複数拠点で事業を展開している場合は、どこにオフィスがあるのかを示すことにより、今回の建設物に対応できるのかどうかの判断に繋がります。
地図などもセットで掲載できると、よりパッと見で判断しやすいですね。Googleマップで表示する技術もあります。
サービス紹介
主要な事業分野
一言で建設といっても幅広いですから、どのような事業分野を展開しているのか、可能な限り詳しく書きましょう。
土木工事、公共事業、民間事業、大規模開発プロジェクトなどから、ニッチな対応建設物まで細かく紹介してください。その中で得意な事業や、技術力に他社に比べ強みのある事業があれば、その理由も掲載しましょう。
こちらの会社さんのように事業をグラフで可視化してあげるとさらにわかりやすくていいですね。
技術・設備
他社との差別化をするために建設技術や設備の紹介も重要です。また紹介する設備や技術に詳しくないお客様もいらっしゃるかもしれませんので、それがどのようなメリットをもたらすかまでしっかりと掲載しましょう。最新技術の場合は特に重要です。
メーカーまで紹介されていると、わかりる人にはさらにわかって良いですね。
施工実績
建設業界だけに言えることだけではありませんが、過去の実績は非常に重要視されます。単に過去の建設物の写真を掲載するだけでも悪くはありませんが、プロジェクトの概要や規模、施工期間、施工内容などを詳しく説明できると尚良しです。
写真も１枚だけではなく、複数写真を掲載できると良いので、最初からホームページに掲載されるであろうことを想定して、プロジェクトの進行中になるべく写真を撮っておくようにしましょう。
こちらの会社さんのように事例がカテゴリ分けされていると、さらに使いやすくて良いと思います。
認証・資格
業界資格・認証
建設業界では、ISO認証（国際標準化機構が定める品質管理の国際規格）や建設業許可証など、様々な資格や認証が存在します。
もちろん資格がすべてだとは思いませんが、資格や認証を重要視している企業も多いのは事実ですから、掲載できるのであれば掲載しましょう。
安全管理
現場は危険ですので、プロジェクトに支障がでないように安全管理をすることは、みなさんも重々承知のことで申し訳ないんですが、やはり重要です。
当然クライアントも同様に感じていますので、安全管理のために行っていることはしっかりと掲載しましょう。
また、実績も以外にPRに繋がります。過去にどれだけ事故を起こさずに、プロジェクトを推進させたか、数値とセットで掲載することで信頼アップに繋げられます。
体制の図解もあると、イメージしやすいはずです。
技術力・環境保護
技術研究
競合との差別化で技術研究をどの会社も行っていらっしゃるのではないでしょうか。また単純に建設技術の研究だけではなく、最近ではAIやIoTなどテクノロジー分野にも力をいれていらっしゃる会社もあると思います。
他にも大学・研究機関・他業種企業などと提携をしている取り組みの紹介などもおすすめです。
環境への取り組み
SDGsを始めとした環境保護への機運は年々高まっています。当たり前に行っていることでも、面倒くさがらずにしっかりとPRすることが重要です。
例えば、再生可能エネルギーの利用、省エネルギー設計の導入、リサイクル材の活用、廃棄物の削減、環境認証（LEED認証など）の取得状況や、環境保護団体との協力事例などです。
SDGsのアイコンとセットだとわかりやすいです。
法規制・コンプライアンス
法的情報
建設業界は法規制が多い業界です。
建設業法や労働安全衛生法、環境関連法規などへの対応状況を説明し、法令順守を徹底していることをアピールします。
ホームページ上で、会社が関連法規をどのように遵守しているのか、コンプライアンス（法令順守）に関する方針を掲載しましょう。
リスク管理
会社のリスク管理体制や、リスクアセスメント（リスク評価）の取り組みを紹介しましょう。
具体的には、リスク管理部門の設置状況や、リスク管理マニュアルの整備状況、定期的なリスクアセスメントの実施状況などを説明します。
どのようにリスクを回避しているか視覚的にわかりやすくしてあげたいです。
地域貢献活動
地域密着型の企業の場合は「密着しています」と言葉で説明するだけでなく、そのためにどのような取り組みを行っているか紹介することで、地元の皆様に好感を持ってもらえます。
定期的に行っている場合はわざわざページを作るんじゃなくて、お知らせなどでイベントカテゴリを新設して紹介していくのもアリです。
こういう言い方してしまっては印象が悪いですが、ボランティア活動も会社の魅力を伝えるのに一役買います。
インターンシップの受け入れも行っているのであれば掲載しましょう。
デジタルツールの利用
BIM（Building Information Modeling）
BIM（ビルディング・インフォメーション・モデリング）を活用した技術のPRで、コスト削減に繋げていることなどをPRできれば、どうして提供するサービスが安いのかどうかを想像することができます。
ドローン
ドローンも同様です。ドローンを活用すると逆にコストは上がりますが（下がることもありますが）、どうしてその品質を担保できるかの想像に繋げることができるかもしれません。
具体的にどのようなシーンで活用できるのかわからない人も多いでしょうから、そのあたりも説明してあげましょう。
建設会社のホームページ制作なら
弊社でも建設会社のホームページ制作を承っておりますので、これからリニューアルや新規立ち上げをお考えの方はぜひ一度ご相談ください。
おすすめの記事はこちら
-
ウェブデザイン ｜ 2024/07/28人材派遣・人材紹介会社のおしゃれ・かっこいいホームページ制作デザインまとめ14選！
-
ウェブデザイン ｜ 2024/05/31
工務店で参考になるホームページ制作デザインまとめ！基本は親しみやすさが重要？
-
ウェブデザイン ｜ 2024/05/21
農業・酪農で参考となるホームページ制作デザイン23選！魅力的なコンテンツのアイデアも！
-
ウェブデザイン ｜ 2018/01/25
追従型メニュー（フローティングメニュー）のアイデアまとめ９選・PCサイト編
-
ウェブデザイン ｜ 2013/04/04
参考になる！紫を効果的に使用しているハイクオリティなWebデザイン制作まとめ
-
ウェブデザイン ｜ 2013/03/05
カラフルな配色が苦手な人でも簡単にバランスが取れる6つの配色技法
