ホームページリニューアル事例「飲食系のホームページリニューアル」

以下、元の文章の内容や流れはそのままに、倍程度のボリュームになるよう各項目を補足・拡充した文章例を作成いたしました。参考にしていただければ幸いです。

ホームページリニューアルに関して、実際どの程度のボリュームで、どの程度の費用がかかり、リニューアル公開までにどのくらいの時間を要するのかについては、サイトの規模やご要望・運用状況など、さまざまな条件によって大きく変動します。そのため、一概には「〇〇万円でできます」「〇週間で完了します」とは断言しにくいのが実情です。しかし、少しでも実感していただくために、ここでは私たちが手掛けた実際のリニューアル事例を紹介し、具体的な流れやポイントをお伝えしていければと思います。今回ご紹介するのは、ホームページリニューアルの二つ目の事例として「飲食系のホームページリニューアル」です。

リニューアル前のホームページ

リニューアル前のホームページの概要

今回リニューアルを行ったホームページは、最初の公開から8年ほど経過しており、HTMLをベースにした比較的シンプルな作りでした。スマホ対応はまったく行われておらず、PCでの閲覧を前提としたデザイン・レイアウトになっていたのが特徴的です。更新作業は、必要なときに外部の業者へ依頼するスタイルをとっていたため、更新頻度がそこまで高くなかったこともあり、運用コストがかさむ形になっていました。

ファイル数は100程度で、ページ数からするとやや少なめでしたが、アクセス解析が導入されていなかったため、具体的なアクセス数やユーザー行動を把握することが難しい状態。実際にホームページがどの程度の集客効果や販促効果を出しているのか判断できず、「せっかくホームページを持っているが、有効活用できているのか分からない」という悩みを抱えておられました。また、LINE公式アカウントやFacebookページは既に運用中でしたが、ホームページとの連携はほとんど行われていなかったのも特徴です。

リニューアル前のホームページの構成

リニューアル前のホームページは、以下のような基本6ページ構成でした。各ページの文字量はA4用紙1ページに収まる程度で、1ページにつきイラストや写真は1点以上掲載されていました。なお、特徴的なページ名などはプライバシーの観点から変更しています。

1. トップページ
2. お店紹介ページ
3. サービス紹介ページ1
4. サービス紹介ページ2
5. 会社概要ページ
6. お問合わせページ

リニューアルに関して

リニューアルに際してのご要望

1. スマホで見やすくしたい
   リニューアル前はスマホでの閲覧を想定していないデザインでした。そのため、「スマートフォンやタブレットで訪れたユーザーにとって見やすいページにしてほしい」というご希望が最優先事項でした。最近は、飲食店やサービス業の場合、ユーザーがスマホで検索するケースが増えているため、モバイル対応は必須といえる状況です。
2. 簡単な更新作業は自分で行いたい
   これまではメニュー変更やキャンペーン情報の掲載などを外部業者に依頼していたため、ちょっとした修正でも費用がかかることが課題でした。「自社内で簡単に更新できれば、更新の頻度も上がり、タイムリーな情報発信ができるのではないか」と考えられており、費用を抑えたいという要望も重なっていました。
3. 予算は30万円程度まで
   予算に明確な上限が設定されていることは、ホームページリニューアルの計画を立てるうえで非常に重要なポイントです。デザインや機能を自由に盛り込みたいというご希望もありましたが、それよりも「必要最低限の機能で確実にコストを抑えたい」という方針でした。
4. インスタを載せたい
   Facebookページを以前から活用していたものの、最近はInstagramでの発信の方が多いとのこと。せっかく Instagram を活用しているなら、その情報をホームページ上でも同時に表示しておきたい、という要望がありました。
5. Facebookページの投稿に負担を感じている
   もともとFacebookページでお知らせや新メニューの情報などを投稿していたものの、投稿作業自体に負担を感じてしまい、段々と更新が滞っている状態でした。今後はインスタをメインにして負担を軽減したいという考えが強かったようです。
6. 営業日カレンダーの変更
   Googleカレンダーを引用表示する形で公開していたものの、Googleカレンダーの操作が苦手だということで、他の方法に切り替えたいという要望もありました。

リニューアル案

上記のご要望をもとに、弊社で検討した結果、ご予算的にも可能で、かつクライアント様にとってもっともシンプルかつメリットが大きい「ライトプラン」の利用をご提案させていただきました。その際の主な内容は以下のとおりです。

1. ライトプラン
   弊社のホームページリニューアルサービスの中でも、コストを抑えつつ基本的な機能を一通りカバーできるプランです。通常はページ数やデザイン面である程度の上限はあるものの、シンプルな構成であれば十分に対応可能です。
2. WordPressを導入
   クライアント様が簡単な更新を自分で行いたいというご要望を叶えるため、WordPressというCMS（コンテンツ管理システム）を採用しました。記事の追加や画像の差し替えなど、HTMLやCSSの知識がなくても比較的スムーズに行っていただけます。
3. レスポンシブデザイン
   スマホ最適化という要望に応えるため、レスポンシブデザインを導入。PC・スマホ・タブレットなどさまざまなデバイスで、画面サイズに合わせてレイアウトが自動調整されるようにデザインを組み込みました。これにより、モバイルでの閲覧時にもストレスなく閲覧できるようになります。
4. リニューアル公開は1か月後を目途
   6ページほどのサイトということで、細かな修正を挟んでも約2週間程度の作業を想定。スケジュールには余裕を持たせて1か月後の公開を目安に設定しました。
5. インスタ引用表示用のプラグイン導入
   Instagramの投稿をホームページ上に掲載したいというご要望に合わせ、特定のプラグインを活用して、インスタの最新投稿を自動的に取得・表示できるように設定。ホームページとSNSを連動させることで、更新負担を最小限にしつつ、常に新しい情報を発信できます。
6. Facebookページの扱い
   Facebookへの投稿は負担が大きいとのことでした。インスタと連動する「Meta Business Suite」を使えば、一度の投稿でInstagramとFacebook両方へ投稿できる利点がありますが、それでも「少し面倒」という印象があるとのことで、今回はInstagram運用をメインにする方針となりました。
   ※SNS運用は「継続」が最重要ですが、それが負担になり過ぎると挫折しやすいものです。無理なく続けられる方法を選ぶ方が長期的に効果を出しやすいというのが私たちの経験上の見解です。
7. 営業カレンダーの変更
   Googleカレンダーの操作が苦手とのことでしたので、別のカレンダープラグインをいくつかご提案しましたが、やはりこちらも操作が煩雑に感じるとのこと。最終的には営業日の一覧を画像で掲載する形式に落ち着きました。画像の差し替えだけなら、WordPressの管理画面で簡単に行えるため、更新も比較的楽です。

サイト構成

リニューアルによって、元々のページ構成を見直し、営業日案内ページや新たなサービスの紹介ページなどを追加しました。最終的には下記のような構成に変更となりました。

1. トップページ
2. サービス紹介ページ1
3. サービス紹介ページ2
4. サービス紹介ページ3
5. 会社概要ページ
6. お問合わせページ
7. 営業日案内ページ

リニューアル中

リニューアル作業を進める過程で、公開中の現行サイトにどうしても最新情報を反映したいというケースが発生することがあります。例えば、新しいメニューが決まったので掲載したい、営業時間が変わったのでお知らせしたい、といったことです。そのようなとき、条件が整っていれば、追加費用なしで簡単な更新作業を行わせていただく場合もあります。今回のサイトの場合も、HTMLベースで作られていたため、ちょっとしたテキスト修正や画像の差し替えを無料対応させていただきました。

ただし、下記のようなケースでは更新作業が難しくなることがありますので注意が必要です。

• WordPress本体のバージョンがかなり古い場合
• PHPのバージョンが非常に古い場合
• 専用のCMSやWebサービスで作成されており、ログイン情報が不明な場合

これらに当てはまる場合、まずはそのホームページを作った会社や、サーバー管理を行っている業者へ問い合わせるのが安全かと思います。それでもどうしても連絡がとれない場合などは、代替手段をご提案して対処させていただくことも可能です。

リニューアル作業の流れ

今回のリニューアルでは、以下のSTEP1〜STEP9を経て約2週間で作業を終えました。スムーズに進んだ要因としては、クライアント様が必要な原稿や画像を早めにご用意いただいたことも大きいです。

1. リニューアル前のホームページのデータをダウンロード
   現行サイトのHTMLファイルや画像などのファイル群をすべて取得し、万が一に備えたバックアップを確保します。
2. 利用中のサーバーにリニューアルホームページ用のスペース（フォルダ）を作成
   新しく作成するWordPressサイトは、現行サイトとは別のフォルダ上で構築します。これにより、リニューアル作業中でも現在のホームページは引き続き稼働できます。
3. 作成したフォルダにWordPressをインストール
   データベースをサーバー側で設定し、WordPressのインストールファイルをアップロードして環境を整えます。
4. 標準のテーマを利用して、リニューアル前データをたたき台として入れ込み
   まずはWordPressの初期テーマを使い、テキストや画像を仮配置してページの構成を確認していただきます。
5. 変更や追加したい内容や写真・画像などが無いかをざっと確認
   この時点で細かい部分まで決定しておく必要はありません。大まかにコンテンツの流れや抜け漏れがないかをチェックしてもらいます。
6. 実際に使用するテーマをインストールしレイアウトを整える
   今回は「できるだけリニューアル前に近い雰囲気」をご希望でしたが、プロの視点から「ここは変えたほうが見やすい」「この色は可読性が低い」といった提案を行い、一部デザインを変更させていただきました。
7. 公開OKという段階まで何度か確認・修正を行う
   必要に応じて画像を差し替えたり、文言を変更したりします。あまり細部にこだわり過ぎると公開が遅れてしまいますので、ほどよいところで「公開後に必要に応じて微調整する」という判断をおすすめしています。弊社のサービスでは1年間のアフターサポートが付いているため、公開後にも修正が可能です。
8. リニューアル公開日を決定
   クライアント様のご都合や宣伝のタイミングを踏まえて、公開日を最終決定します。周知を行ったり、SNSで事前告知を行うなど、公開日に向けた準備を整えていきます。
9. リニューアル公開
   最終的にデザインや文章の校了を経て、新しいサイトを公開します。公開後は新しいURLでのアクセス確認や、リンク切れがないかなどを入念にチェックします。

リニューアル後

弊社のホームページリニューアルサービスでは、リニューアル完了後も1年間のサポートがついているのが特徴です。サイトを公開した後も、「はい、終わり」ではなく、運用しながら生じる疑問や追加要望に継続的に対応しています。今回のサイトでは、リニューアル中にいくつか簡易的なマニュアルをお渡ししましたが、公開後はさらに以下のようなサポートを行いました。

1. WordPressのバックアップとアップデート作業のマニュアル作成
   定期的なバックアップ取得やWordPress本体・プラグインのアップデート方法などを、画像付きの手順書でまとめました。更新を怠るとセキュリティリスクが高まるので、重要な作業です。
2. WordPress本体のアップデートやプラグインのアップデート
   必要なタイミングで実施することで、セキュリティ面や機能面の安定性を維持します。バージョンアップに伴う不具合が起きないか、事前にテスト環境で検証する場合もあります。
3. ファビコンの作成と設定
   ホームページのタブやブックマークなどに表示されるアイコン（ファビコン）を追加し、ブランドイメージを高めました。小さなアイコンですが、ユーザー体験の向上につながります。
4. パーマリンク変更
   サイトのURL構造を変更する場合は、SEOやリンク切れに配慮しながら慎重に実施します。変更により検索エンジン評価が下がるリスクもあるため、301リダイレクトの設定が必要です。
5. Googleサーチコンソールの導入
   サイトの検索パフォーマンスを把握し、エラーの検知や検索キーワードの分析ができるようにするため、Googleサーチコンソールの設定を行いました。併せてクライアント様に簡単なレポートの見方も説明しています。
6. サーバーから旧ホームページデータや未使用データを削除
   不要なファイルを残しておくとサーバー容量の圧迫やセキュリティリスクにつながる可能性があります。必要に応じてサーバー上の整理・整頓を実施しました。
7. 301転送作業
   リニューアル後にURLが変わったページがある場合、旧URLから新URLへ自動的に転送（リダイレクト）されるよう設定。検索エンジンの評価を継続させつつ、ユーザーが迷子にならないよう配慮しました。
8. ページ編集に関するマニュアル作成
   WordPressの投稿や固定ページを編集する際の操作方法、写真のアップロード時の注意点などをまとめたマニュアルを作成。クライアント様が自社スタッフで対応できるようにフォローしています。
9. WordPressのバックアップと定期チェック、アップデート作業
   基本的にはクライアント様自身で行っていただくようマニュアルをお渡ししていますが、万が一トラブルがあった場合は、1年間のサポート範囲内でフォロー・対応します。

今回のように、飲食系のホームページリニューアルでもWordPressを取り入れることで、モバイル対応の強化やSNSとのスムーズな連携、自社内での簡単な更新作業が実現しやすくなります。また、公開後の運用・サポート体制を整えておくことで、末永くサイトを活用し続けることが可能になります。

リニューアルを検討されている方にとって、上記の事例が少しでも参考になれば幸いです。ご予算や目指す運用方法によって、プランや機能は柔軟にアレンジできますので、ご興味のある方はぜひご相談いただければと思います。継続的な運用こそがホームページの力を最大限に活かす鍵ですので、「使いやすく、更新しやすいシステムづくり」や「無理なく続けられるSNS運用」を念頭において、リニューアル計画を立ててみてはいかがでしょうか。