- category
- Youtubeチャンネルd>
- 制作期間
- 約1.5ヶ月
- URL
- https://mokumeshi-tokyo.com/
Youtubeチェンネルとの連動を考えたホームページ制作
Youtubeチャンネルを運用する会社様からホームページ制作の相談をいただきました。ご要望としては、Youtubeでグルメ情報を配信していたが、再生回数、登録回数が伸びるに従って、閲覧者からYoutubeで紹介している飲食店の情報についてより詳しい情報が見たいと要望があったので、それらをまとめることのできるホームページを作りたいということでした。
飲食店は「現在地から検索」「エリアから検索」「Map」等で検索できるようにしたい、できるだけストレスなく飲食店の情報を閲覧したい、ホームページからの収益も得る為に広告掲載したい、閲覧者の中には日本国外の方も多いため、翻訳機能も導入して欲しいとご要望をいただきました。
また、頻繁に飲食店の掲載、変更等を行うため、管理画面内は、ストレスなく情報の投稿が行えるというご要望もいただきました。
ご希望に対しての以下の内容でホームページ制作を行いました。
Youtubeからリンクで訪問するユーザーも多いことを想定し、操作がシンプルなYotubeから遷移してもストレスなく操作できる仕様を心がけています。
メインイメージでは、多くの方が関わってることが連想できるように、お店の方々の仕事風景がスクロールで流れる仕様を導入しています。そして、目的の情報がすぐ検索できるように「現在地から検索」「エリアから検索」「マップ」検索の3種類の検索ボタンを設置しています。
「目的地からの検索」では、端末の位置情報を取得しユーザーから近い飲食店が表示される仕様となります。
「Map検索」では、GoogleMapと連動し投稿画面から店舗登録する際に入力した住所から自動的にMap内にピンが立つ仕様となります。
詳細ページについては、記事タイトル、飲食店の住所、YoutubeのURL、基本情報、お店の詳細写真と補足説明文章を入力すると、決められたフォーマットに情報が整理されてページが生成される仕様となります。
デザインについては、情報が閲覧しやすいようにシンプルで余白を広く使用した構成となります。
- ・掲載している飲食店の情報を見つけやすく見やすいように制作して欲しい
- ・飲食店の情報を、地図検索、位置情報などいろいろな検索システムから検索できる用意したい
- ・ホームページからの収入も期待できるように広告スペースを用意したい
- ・日本人以外の訪問者数も多いため、多言語対応を行って欲しい
今回の要望のまとめ
検索一覧ページ
検索一覧ページでは、条件から選択した飲食店がリストで並ぶ仕様となります。
一覧ページからも飲食店のMap、Yotubeへの誘導が行えるよう配慮しています。
Map検索
Map検索では、管理画面より飲食店の住所を入力した際に住所を取得しGoogleMapに自動的にピンが立つ仕様となります。
店舗詳細ページ
飲食店詳細ページは、管理画面より入力された以下の情報を入力すだけで決められたフォーマット内に表示される仕様となります。ページタイトル｜Youtube動画（YOUTUBEのURLを入力するだけで表示）｜電話番号・住所などの基本情報｜GoogleMap（住所を入力するだけで表示）｜店舗詳細写真と説明文章（このブロックは無制限で追加可能）
スマートフォン対応について
今回のスマートフォン対応について、問題だったことはトップページはフルリニューアルのため、制作の段階でスマートフォン対応を考慮することが出来るのですが、下層ページについては、フレームのみのリニューアルのため、各ページの内容は既存のHTML情報を引き継ぎます。そこで起こる可能性がある問題は、既存サイトのＨＴＭＬがスマートフォン対応に適していない場合があります。
その場合は、スマートフォン対応が行えない場合があります。今回この提案が行えた理由として、既存サイトの下層ページのＨＴＭＬがスマートフォンに対応できるかの事前調査を行い、問題ないという判断が出来たことです。
今回のスマートフォン対応はレスポンシブ対応を採用し、PCサイトと同様のページ構成で対応しました。
レスポンシブ対応は、ブラウザのウィンドウサイズに合わせてレイアウトが切り替わるため、端末に依存しない効率の良いスマートフォン対応です。
制作担当者より
制作の目的が明確で仕様の考察がスムーズに進みました。担当者の方にもとても丁寧に対応いただいたため、制作をスムーズに進めることができました。ありがとうございました。
