山口佳奈/卒業研究II

飲食店のためのWebサイト制作

集客・宣伝を柔軟に行える Webサイトの構築

山口佳奈
Keywords：WebDesign, WordPress

↑

Overview

↑

Introduction / What is This

オープンソースのCMSであるWordPressを利用して、焼肉店のWebサイトを作成する。

↑

Background and Purpose

現在各種グルメサイトを利用して集客・宣伝を行っており、掲載料やネット予約手数料が必要なグルメサイトも利用している。グルメサイトには様々なプランがあり、コストをかければかけるほど検索結果で上位に表示されるという仕組みになっている。また、グルメサイトの紹介ページに表示されている電話番号は店の番号とは違うものでこの番号で予約が入るとネット予約手数料を支払うことになる。

このようにグルメサイトでの集客・宣伝は恩恵もあるが費用もかかりそれがコロナ禍において負担になっている。集客・宣伝の手段として拡散力の高いSNSを活用する方法もあるが、掲載できる画像の容量や枚数、文字数などの制限がある中で店の情報を伝える必要がある。

グルメサイトと費用がかからず制限なく情報を詳細に伝えられるWebサイトを併用した集客・宣伝を行い、費用負担を軽減する。

↑

Concept

店の情報を正確に、店の魅力を効果的に伝える
コロナウイルスの影響で店の営業状況が変化しやすくなっている中で、状況に柔軟に対応できる

↑

Tools

WordPress

↑

Term

2021.04.16 〜

↑

Survey

↑

Present Status

グルメサイトに関する意識調査
株式会社「TableCheck」が20~60代の全国の男女1100名と20~50代の飲食店に勤務する全国の男女660名を対象にグルメサイトに関する意識調査を実施した。

グルメサイトへの信頼度調査
グルメサイトの点数やランキング表示をユーザーの半数がグルメサイトはあくまで情報源の1つと回答し、約3割のユーザーが信用していないと答えた。

飲食店を検索する手段
飲食店の検索手段はグルメサイトの他にGoogle検索とGoogleマップの利用率が高かった。

飲食店を予約する手段
予約手段はグルメサイトと電話の利用が多かった。

↑

Precedent

先行事例
Webサイトの制作にあたり焼肉店のホームページについて調査した結果、黒色や暗い色を使っているものやシングルページや縦に長いWebサイトが多いということが分かった。また、焼肉店以外の飲食店のホームページ調査も行った。

「飛騨牛焼肉にくなべ屋朧月豊橋駅前大通り店」のホームページ

「飛騨牛焼肉にくなべ屋朧月豊橋駅前大通り店」のホームページでも黒が多く使われており、縦に長い構成となっている。また、背景に和柄や和紙のテクスチャ画像を使用してページの外観が固定されているグルメサイトやSNSでは表現できないやり方で店の雰囲気を伝えている。

日本料理店「桜坂 ONO」のホームページ

日本料理店「桜坂 ONO」のホームページでは、ページを開いたときに最初に表示される店内の写真から店の雰囲気を伝えている。ページをスクロールすると表示される店の紹介文では『四季を食す』という印象的な言葉が使われており、ナビゲーションメニューや予約ページへのリンクがページをスクロールしても常に表示されている。

レストラン「ミツバチ食堂」のホームページ

レストラン「ミツバチ食堂」のホームページはイラストや手書き文字が多用されており、レストランのテーマである「季節感、素材感、土の温もり」が表現されている。

↑

Technique / Technology

worklog

↑

トップページにセクションを追加

店内の構造についての紹介文と画像を追加、background-attachment: fixed !important;を設定。

↑

2021.12.01

↑

ニュース項目のCSS設定

ニュース項目のCSSにinline-blockを設定し、投稿記事を3つ横に並べて表示。inline-blockを設定した後は投稿記事のwidthを30%に変更して、横に均等に並ぶようにする。display: flex;とflex-direction: column;を用いて画面幅が狭まると横から縦に並べる配置へ変わるように設定、レスポンシブに対応させた。

↑