賢象WEBデザイン

制作実績〜Work 04〜

フォーチュンBAR タロット

新宿でおしゃれなカクテルと占いを落ち着いた空間で楽しめる、フォーチュンバータロットさんのサイトリニューアルを行いました。

リニューアルのご要望は、明るくも神秘的な雰囲気のサイトへと生まれ変わること。
そして、リニューアル前後で検索順位をなるべく落とさないこと。

プライマリーキーワードで上位表示されるサイトのリニューアルだったので、SEOツールでの分析を十分に行い、それをベースにしたサイト設計とリニューアルを行いました。

デザイン面では、ベースカラーには、様々な色と相性が良い、落ち着いたグレーがかった白を使用し、テーマカラーには、優しい夜の帳を思わせる、濃紺を使用しました。

リンクには、爽やかでありつつも神秘的なエジプシャンブルーを使い、差し色として、ロゴにも使用されている豊かさと幸運を連想させるゴールデンイエローを使用しました。

総ページ数240ページの大型リニューアルでした。

ホームページの顔となるトップページには、googleの検索から来られた方が、すぐに当日の営業情報を確認できるように、スマホでタップするとすぐにお店へ電話をかけることができたり、またお昼と夜の営業時間情報をタップすると最新の営業時間情報が表示されるアニメーションを実装しました。
クリックやタップを誘導するために→が点滅するアニメーションで知らせています。

ナビゲーションは、ホバーやタップで、ドロップダウンが緩やかなアニメーションとともに表示されるようにしました。
そして、フォーチュンカウンセラーの各カウンセラーの画像をタップすると、自己紹介記事に遷移し、訪問者が快適に情報を確認できるようにしました。

そして、詳しいシフトについてすぐにお店に電話できるように、この部分にもタップするとお店への通話が直ぐにできるリンクを入れています。

おすすめメニューと利用シーンの部分は、スクロールすると、軽快なアニメションで画像が表示されていきます。

その他、メニューの紹介ページでは、オリジナルドリンクがスクロールによって、一つずつ、元気よく表示されるアニメーションを実装しました。

また、以前のサイトで多くのブログを執筆されていらっしゃいましたのでそれも、ほぼ全て移管しました。

以前のサイトでは、お知らせとブログが同じ投稿ページの仕組みから公開されていたので、今回のリニューアルでは、ブログとお知らせは分けて投稿できるようにいたしました。

サイトに訪れた人が、快適に情報を取得でき、お店へのアプローチを快適に行え、リニューアル期間中もgoogleからのお客様の来店数に影響が出ないようにSEOも細かな部分から精密に設計し、移管しました。


担当した業務は以下となります。
・ヒアリングシートとZoomによる会議をベースとした要件定義
・ディレクション
・デザイン
・サーバーにおける各種SEO対策
・実装 ・キーワード選定とそれに基づいたサイト設計
・ボイスアンドトーンを意識した主要ページのリライト
・HTML,CSS,jQuery、Javascriptによるコーディング
・スマホからのワンタップ通話(クリッカブル電話番号)機能の実装
・Googleアナリティクス設置(GA4)
・Googleサーチコンソール設定
・Google内部SEO対策

Link to