高級感のあるグラデーションのGoldがメインカラー、優しい色合いのピンクがサブカラーの上品な雰囲気を重視したWebデザインです。こちらは京都・滋賀を中心にさとう式リンパケアの施術/各種講座をされているSpring Forest様です。
既存のお客様からのご紹介でホームページリニューアルを行い、先月に一般公開をしました。さとう式リンパケアサロンということで、さとう式リンパケアの施術の特徴に関する内容からセラピスト養成講座、そして起業支援と多彩なコンテンツがあります。
トップページはjQueryで画像が切り替わる仕様で、ご代表者様が施術をされている写真や講座中の様子等が見れるようになっています。そしてメインコンテンツ部分の背景はパララックスデザインでスクロールに連動し、画像が別のものへと変化します。
滋賀/京都のスプリングフォレスト様：HPリニューアル実績紹介
HPトップ制作時のポイント
トップページは言うまでもなくHPの中で特に重要で、TOPの出来によってサイト自体のコンバージョン率が変わってきます。そのため、ディレクション時にはメインターゲットに関する内容から他との差別化のPOINT・独自の強み（USP）などを細かくヒアリングします。
またお客様がどういった雰囲気のwebサイトにしたいかや「サイト訪問者に対し、どのような印象を与えたいか？」も考慮しながら、サイト企画案を練ります。Spring Forest様のメイン活動拠点が京都/滋賀のため、今回まずはお電話でご要望をお聞きしました。
その後、ご代表者様が東京へいらっしゃるタイミングでお時間をもらい、今回新宿で2時間ほどお時間をいただきましてwebサイトについての打ち合わせを行いました。メインカラーの細かなパーツの色合いや使用画像、掲載コンテンツに関する内容と確認すべき内容が多くあり、アッという間に時間が過ぎました。
サイトへ使用する写真はご代表者様がこれまで撮影の上、AmebaブログやFacebookへ掲載されてきたものと、新たにご知り合いのプロカメラマンの方に撮っていただいた高解像度の画像を活用しています。やはりプロカメラマンが撮影した画像は光の当たり方や躍動感などが一味違います。そのため、年々当社ではホームページ制作時に使用する写真をプロのカメラマンさんに撮っていただくケースが増えています。
特に人物写真をメインとしたサイト作りの際、動きのある画像・活き活きとした表情の写真を取り入れることで格段に仕上がりが良くなります。HP作成時に撮影した写真は、クライアントが看板やパンフレット、チラシ等を作る際にも活用できるのでお勧めです！
TOPページ中段はお洒落な見せ方の3つの大型バナーを配置しています。1つ目は”このような方はお勧め”として、「さとう式リンパケアに興味がある・色々な資格を所有しているけどイマイチ活かしきれていない方などにオススメです」といった、ターゲットユーザー層を意識したコンテンツです。
2つ目は”開業支援プログラムベネフィット”でセラピストとして今後活躍されたい方や自身や家族を幸せに、笑顔にしたい方向けのコンテンツ。そして3つ目はスプリングフォレスト様で提供しているプログラムの特徴に関する話題となっています。文字だけでなく、実際の講座風景写真も取り入れ、ユーザーがスクロールした際、目に留まるようになっています。
下層制作時のポイント
下層メニューの最初は珍しくメールマガジンのコンテンツを最初に配置しています。”美も健康も働き方も叶える7日間メール講座”について、おススメの方やご代表の過去のエピソード、具体的な講座カリキュラムを分かりやすく打ち出しています。
TOPページはパララックス仕様でメインコンテンツ部分の背景を透過させ、ビジュアル重視でページ制作を行っていますが、下層ページは内容の読みやすさ/視認性を重視し、メインコンテンツ部分の背景は白ベースにしています。下層はできるだけサイト訪問者にTEXT分を読んでほしく、透過の背景では少し読みにくいのでホワイトレイヤーを重ねました。
下層制作時はどうしても文章中心で単調になりがちなので、適宜画像バナーやイメージ写真を大きめに配置し、メリハリ面を考慮します。
また、コンテンツとコンテンツの区切りも明確にすることが大切です。現在読んでいるコンテンツがどこまでで、次の新たな章がどこからかが不明確だと、ユーザーは違和感を感じると共に読みにくさも感じてしまいます。そのため、次のコンテンツの前に大き目の余白を取りつつ、区切りの帯も濃い色合いでハッキリさせています。
それでも1ページに対し、多くの内容が載りすぎるとユーザビリティが下がるので、これを解消すべく「ショートカットリンクメニュー」群をページ冒頭へ配置します。今回制作を行ったスプリングフォレスト様のホームページ上では「講座のご案内」ページがこちらに該当し、ページを開いてすぐの場所に講座メニューとして計10個のページ内リンクを設けています。こちらを設けることで、サイト訪問者は自身が見たい内容・得たい情報へすぐにたどり着くことができます。
掲載内容の分類上どうしても1つのページに対し、複数のコンテンツを載せなければならない時に非常に有効です！
---------------------------------------------------------------
東京でホームページリニューアルなら
株式会社エグゼクティブクリエイション
------------------------------------------------
---------------------------------------------------------------
◇WEB作成/運営についての
お問い合わせはこちらから
TEL: 03-5839-2512
FAX： 03-5839-2513
------------------------------------------------
≫ホームページ制作 東京 エグゼクティブクリエイション
