横浜で新築物件の給・排水管工事、リニューアルをされている横浜エンジニアリング様のサイトリニューアルについて、本日は掲載いたします。
8年前にサイトを作成し、今回全面的なデザインリニューアルを行っています。8年間運用を行ってきた中で様々な追加コンテンツや施工事例等が加わり、情報量が多く全体的なページ遷移の導線も分かりにくくなっていたので”ビジュアル面・サイトマップ面の改善”を図りました。
以前の新規立ち上げ時は上部メニュー/サイドメニュー有りの複合型メニューでしたが、今回は左メニューを外したことで横幅一杯までコンテンツを配置できるようになりました。これによってTOPページも下層ページも「メリハリある且つダイナミックな表現」が可能になり、jQueryと相性の良いパララックスデザインで制作をしております。
Webデザインは地球環境/水を連想するイメージ画像や横浜の街並み等の画像を活用し、サイト設計段階から”オーガニックさ””壮大さ”を重視。最近主流の打ち出し方でリニューアルを行い、透明感あるお洒落な雰囲気に仕上がりました!
TOPページはメイン画像下に目立つように「指定給水装置工事事業者」であることをPR。その下には”ライフラインとなる「水」を守るための努力と研鑽”といったキャッチフレーズを置いています。背景に配置した、みなとみらいの画像とも上手くマッチしました。サイトリニューアルの際は、背景画像や各コンテンツ同士の関連性・役割を考慮し、制作を進めています。
中段には「横浜エンジニアリングの設計・施工」として、会社の大きな強み”高性能3DCADによる精細な設計と工期短縮化”メニューをレイアウトしました。従来の平面CADと高性能3DCADとの対比画像と共に、3次元CADの画面イメージもyoutube動画形式で見れるようになっています!
神奈川県横浜市の横浜エンジニアリング様:HPリニューアル実績紹介
今回のリニューアル時にはパララックスデザインにて制作を行った以外に、スマートフォン端末でアクセスをすると自動で見やすいサイズへリサイズ表示されるよう制作しております。
リンクバナー等のパーツを従来より大型化していますが、スマホで閲覧した際はあまり大きくなり過ぎず、ユーザーがクリックしやすいサイズで配置しました。
下層ページはサイドメニューが無くなりコンテンツの密度が低くなったことで、スッキリと分かりやすい見せ方に変わりました。しかし、その分どうしても縦長のページ構成になるため、サイト訪問者を飽きさせずページ下部までスクロールしてもらえるよう、横から自動でコンテンツがスライド表示される仕掛けを取り入れるなど工夫しています。
下層も近年のwebデザイントレンドを意識したレイアウトで「いかに内容を読みやすく、見た目良く仕上がるか?」のアイデアを検討しながら作成いたしました。
下層コンテンツの解説
会社概要ページでは会社officeのエントランス、MTGスペース、事務所、建設業の許可票などの写真をアップ。また地域住民の方への素晴らしい貢献として、AED機器の設置写真も載せています。不測の事態があった場合はAEDを使用いただけるようになっています!
事業の強みページは、まずページを開いた瞬間に近代的な高層ビルのメイン画像が表示されます。こちらのページでは高品質な新築物件の給排水・衛生設備工事、妥協のない設計・施工管理、内外装リフォーム工事について等「会社としての5つの強み」を明確に示しています。
そして施工実績では、漏水修繕や新築賃貸マンションの給排水施工、SP工事、商業施設の新規配管工事、排水管の高圧洗浄、給湯器の交換事例、蛇口のオーバーホールの様子等を数多くご紹介しており、非常に見応えのあるページです。「お困りの方へ」ページは”給排水・空調工事に関するセカンドオピニオンとしての建物診断の提案”についてを詳しく掲載。
採用情報のページもビジュアル的に、爽やかなイメージとなっています。
今回、Webサイトのフルリニューアルを行ったことで”全体的に信頼度が高く近代的な雰囲気”になりました!今後もこちらのリニューアルサイトをより多くの方々/会社様からアクセスいただけますよう、コンテンツ面と外部リンク面の強化を進めてまいります。
---------------------------------------------------------------
◇サイトリニューアルについての
ご相談は以下よりどうぞ!
TEL: 03-5839-2512
FAX: 03-5839-2513
≫ホームページ制作 東京 エグゼクティブクリエイション