工務店・建築のホームページ事例

最初の印象はシンプルながらもクオリティが高い写真が使われていることもあり、かっこよいホームページのデザインとなっている。文章量が少ないく、全体的な訴求が控えめではあるが、丁寧な仕事をしてくれそうという好感が持てる。 シンプルで見やすく...

まず目に飛び込んでくるのが実際に作業している動画である。短くいくつもの現場が映し出されるので飽きがこない。また、実際に作業しているところを少しでも見れるのは安心感につながる。 一見塗装屋らしくないスタイリッシュなホームページだが、働い...

ページ全体が緑と白が基調になっているので明るく、ナチュラルな印象である。アイキャッチがスライドしていくたび、業務内容がわかり画像もオリジナルのものなので依頼内容をイメージしやすい。 また、トップページが非常にシンプルなので伝えたいポイ...

練馬区のリフォーム会社。メインビジュアルに社名を強調して配置した、大胆なトップページだ。 社名も「錬」という一文字だが、グローバルナビゲーションはサイトコンテンツをそれぞれ「甦」「匠」「販」など、漢字一文字で表されているのが特徴的だ。...

足立区の塗装会社。メインビジュアルには実際に使用されているハケやペイントローラーの写真が大きく表示され、外壁塗装というサービスを直感的に感じさせる。一枚一枚の写真が大きく、サービス内容が明解で分かりやすい。 スマートフォンユーザーを主...

手描きイラストをふんだんに使った、リフォーム会社のサイト。「笑顔になれるリフォーム」とコンセプトにあるように、親しみやすく暖かい印象のあるデザインだ。トップページのメインビジュアルにはサービスの幅広さを感じさせるように、色とりどりのイラスト...

トップページでは画面枠いっぱいに動画を掲載している。模型や設計図のようなモチーフを見せ、空間づくりを行う会社らしいイメージだ。 斜めのラインで見せるグローバルナビゲーションは比較的大きく、ファーストビューでは画面下に表示されているが、...

揺れ動くカーテンの動画が、心地よい風を感じさせる上品なトップページ。 ページのローディングアニメーションが滑らかで美しく、スクロールやページ遷移の待ち時間にも心地よさを感じさせる。 写真一点一点のクオリティも高いが、トリミングと...

画面全体に写真を大きく使用しており、広がりを感じられるトップページ。 グローバルナビゲーションが控えめに設置されており、コンテンツをじっくり読ませるような作りだ。見出しパーツの種類が多く、汎用的なパーツではなくページコンテンツごとに目...

都会的で洗練されたデザインのサイト。スクロールに合わせてコンテンツが背景の上を滑っていくようなパララックスデザインが実装されている。 スクロールの動きに合わせてコンテンツが浮き上がるように表示され、数字の読み込みなどもアニメーションが...

余白を活かし、文字の形に写真を切り取った処理が印象的なトップページ。 ファーストビューにはナビゲーションが入らないように調整されており、キャッチコピーを強く印象付ける。スクロールしていくとグローバルナビゲーションが現れ、サイト内の各コ...

横長のモニタでも画面幅いっぱいにコンテンツが表示され、訴求力の高いトップデザイン。メインスライドは静止画だが、スライドする毎に写真の読み込みにアニメーションが入るため、単調でなく先進的な印象が与えられる。 斜めに青色のラインが入るトッ...

サイトを開いてまず目に入るのは、自社商品が提供する価値を伝える動画。動画の上にキャッチコピーが乗り、切り替わり流れる動画に合わせてコピーライティングも変更するという工夫がされている。 トップページを訪れたユーザーは、次々と展開されるメ...

全体的にフラットな仕上がりになっており、シンプルながらも写真が映える構成になっており、安心感・信頼感のあるホームページになっている。 一般的にホームページのロゴは最上部に配置するのが一般的だが、このサイトは見出し（ヘッダー）写真の下に...

サイトアクセス時、グローバルナビゲーションが降りてくる表現が印象的。またこちらのホームページの随所で使われている表現法だが、メインビジュアルや施工事例に見せたい情報を大胆に配置してきている。パッと目に飛び込む情報量の多彩さは、モダンな雰囲気...

暖色系のテーマカラーに則った施工事例をメインビジュアルに据えているため、暖かみのある印象を受けるサイト。施主から許可をとれた物件情報を惜しげもなく掲載していることからも、ある程度高級志向の一般家庭をメインターゲットとしているのだろう。 ...

アクセスした際に、ローディング画像（アニメーション）が流れるホームページ。入札案件を扱う建築業ならではの、第一印象や企業イメージに配慮した清潔感のある仕上がりになっている。 装飾が少なくシンプルなフラットデザイン構成となっている。デザ...

東証一部に上場しているオフィス空間をデザインする会社で、一見採用サイトのような印象を受けるホームページ。 2016年頃から、メインビジュアの写真の明度を落として、キャッチコピーを白抜き文字で配置する、というデザインが流行っているが、可...

緑色をテーマカラーとしたホームページで、下層ページは2カラムで構成されている。 メインビジュアルの部分の写真は左右にスライドしつつ、パララックス（下にスクロールしても写真が移動しない仕組み）になっており、レスポンシブ対応している。 ...

ロゴを含め非常にシンプルなデザインのホームページ。 メインビジュアルの写真はスライドする形式になっており、中央に表示される文字は固定されている。写真は家の屋根をイメージしてトリミングされており、設計事務所という特色を上手く表現している...