水・地球環境をイメージするフルサイズの迫力ある画像、ファーストビューが印象的な下田エコテック株式会社様のコーポレートサイトです。今回 ホームページ制作実績として、ご紹介する下田エコテック様は東京台東区柳橋にてグリーストラップや排水桝など製品の設計・製造・販売をされています。
サイトデザイン時には地球環境や水をイメージした、透明感があり スタイリッシュなビジュアルを重視しました。それに伴い、全体的なカラーリングもブルー系で統一しています。元々あった既存サイトのリニューアルということで、リニューアル制作時には製品情報の内容も整理。
サイトビジュアルを良くすると共に、ユーザーにとって分かりやすく、使いやすいホームページとなるよう コンテンツデザイン/レイアウトから文字フォント面まで配慮しながら制作いたしました。

ホームページ制作実績紹介:東京台東区の下田エコテック様
トップページ制作時のPOINT
Google検索エンジン等 経由で訪れる多くのサイト訪問者が最初に閲覧するトップページの見せ方/デザインは非常に重要で、TOPファーストビューのイメージがそのまま そのサイト、そして その会社のイメージにも繋がるため”閲覧者へどういった印象を与えたいか”の面を考慮する必要があります。
TOPメイン画像には「地球環境を考え 安心・安全な未来を創る」といったキャッチコピーをスタイリッシュに英字と日本語で掲載。そのメッセージにマッチする画像をヘッダー/メインビジュアル一体型でフルサイズにてレイアウトしています。
自動的に3枚の画像が切り替わる仕様で1枚目は透明感あるクリアな水の画像、2枚目は壮大な滝から水が流れ落ちる画像、そして3枚目は地球環境や壮大な自然をイメージする山と雲の画像で構成されています。
今回のトップページ制作時はパララックスデザインにて ユーザーのスクロールの動きに連動し、背景画像が切り替わるようにしました。
パララックス・スクロール連動型背景にすることで、ユーザーに対して 視覚的に凝った印象を与えられるメリットがあります。特に縦長ページのwebデザインと相性が良く、スタイリッシュ且つ お洒落に魅せることができる利点がありますが、通常の一般的webデザインより制作工数がかかります。また背景写真用に解像度の高い画像が複数枚 必要です。
しかし通常よりも制作工数がかかる分 視覚的効果が高く、ユーザーへ「次にどんな画像が出てくるのかな?」といった興味を持ってもらえます。ターゲットユーザーに対し、凝った印象と共に、先進的なイメージを持ってほしい場合 非常に有効です。


パララックスデザインにて自動で画像が切り替わる分、ニュースインフォメーション欄や製品情報項目のコンテンツデザインをシンプル目にしています。パララックスデザインで装飾の多いコンテンツデザインを行った場合 雑多なビジュアルになりがちなため 注意が必要です。
TOPページ下段からフッターのデザイン表現は、敢えて上部/中段とは異なった少し変化のあるカラーリングの画像を選別。青々とした海や赤オレンジの夕暮れ画像を取り入れることで、視覚的なメリハリを持たせることができます。

下層ページ制作時のPOINT
多くのネットユーザーがトップページの次にアクセスする製品情報ページも同様に、メイン画像を敢えて鮮やかな色合いの夕日にしています。ページを遷移した際の色合いの変化は実は大切です。
その下のメインページタイトルは、落ち着いた紺色と爽やかなブルーのグラデーションカラーがお洒落な見せ方です。
またメッセージ/コメント部分を黒に近い紺色一色にし、白字にて文面を記載することで視認性が高くスタイリッシュな打ち出し方になります。

「型式選定フォーム」のページもアクセスをした際 インパクトある壮大な大自然の池/山の写真が目を引きます。ページ上部 メインビジュアルは色合い鮮やかな見た目で、メインのフォームはシンプルでユーザーの分かりやすさ・使いやすさの面を考慮しています。

初期ホームページ制作時もデザインリニューアル時もwebデザイン面/ビジュアル面へ焦点が当たりがちですが、基本的なユーザビリティ、ユーザーに対する分かりやすさ/使いやすさ/ストレスを感じないページ構成面にも配慮すべきです。
「デザインは良いのだけど、何だか使いにくい…」「見たい情報へなかなか辿り着かないな…」「内容が分かりにくい」といったwebサイトにならないよう、ユーザー視点でビジュアル面そしてユーザービリティ面を検討しながら制作を行うのがPOINTです。
【今回の記事の執筆者】
カスタマーサポート部/チームリーダー webディレクター:渡邉 真帆

建設業/製造業を中心に300以上のホームページ制作の経験を積む。ディレクション時、クライアントから「事業の強み/差別化のPOINT」を引き出すことが得意。
日々IT・PCに関するリテラシー向上に努め、Webのことは勿論、お客様の多様なお困りごとを解決。エグゼクティブクリエイションの中でも特に顧客満足度の高いディレクター。
社内では癒し系なものの、クライアントとの打ち合わせ時のキリッと具合は別人のよう。
得意なこと:アクティブリスニングと笑顔 苦手なこと:料理と口喧嘩
---------------------------------------------------------------
台東区浅草橋 等でホームページ制作なら
エグゼクティブクリエイションへ!
---------------------------------------------------------------

◇Webサイト制作/運営についてのお問合せはこちら
TEL: 03-5839-2512
FAX: 03-5839-2513
≫ホームページ制作 のエグゼクティブクリエイションTOPへ