【実例】ホームページリニューアルの進め方｜美容スクールのWordPressを作り直している記録【実例】ホームページリニューアルの進め方｜美容スクールのWordPressを作り直している記録

東京の美容スクール（まつ毛とアイビューティーの技術を教える学校）のホームページを、2026年9月末から作り直しています。もとはWordPressで作られたサイトで、ブログの記事は1,600件あまりあります。この記事はその案件の途中経過を、作業した順番どおりに書いた記録です。

依頼する側が見積もり前に確かめることはWordPressサイトのリニューアルに、作り直すかどうかの判断は古いホームページのリニューアルにまとめました。こちらは実際に手を動かしてみて何が起きたかの話です。まだ公開前なので、公開したあとの数字はこの記事に追記します。

ホームページリニューアルの進め方（この案件で踏んでいる順番）

作業の順番を先に並べておきます。

今のサイトの数字を調べるGA4と、外から見える情報だけで現状を読む。9月末。

権限を集めるWordPress・サーバー・ドメイン・計測の持ち主を探して招待してもらう。

今のサイトの中身を数える記事・固定ページ・画像・フォーム・転送の数と作りを調べる。10月中旬。

デザインを組んで、寸法を測って合わせる届いたデザインのデータを確認用のサイトに組み、数字で突き合わせる。

古いWordPressを安全にする本体とPHPを上げ、止まったフォームを直す。10月下旬。

転送と計測を引き継いで切り替える旧URLの転送表、メールの設定、計測を整えてから公開する。これから。

作り直す形は、WordPressを記事の入力画面として裏に残し、お客さんが見る画面は別の仕組みで作るヘッドレスにしました。スクールのスタッフさんは今までどおりWordPressで記事を書き、表のサイトはWordPressから記事を受け取ってページのファイルにして配ります。表のサイトはAstroで組み、配信はCloudflareです。選んだ理由はWordPressサイトのリニューアルに書いたので、ここでは省きます。

段階を分けたのには理由があります。権限がそろわないと、3つ目と5つ目には入れません。一方で、デザインを組む4つ目は権限がなくても進められます。そこで、権限を待つあいだに表のサイトを先に作り始めました。

最初の現状調査で、GA4から見つかった4つのこと

着手して最初にやったのは、GA4（Googleのアクセス解析）を読むことでした。デザインの話をする前に、今のサイトで何が起きているかを知っておきたかったからです。GA4は数字を読める権限をもらえたので、その範囲で読みました。

見つかったのは次の4つです。

1. データの保持期間が2か月のままだった
2. 6月30日から、ブックマークや直接入力に見える訪問のうちパソコンからのものに、機械（bot）の訪問が混ざっていた。その区分の38%ほど
3. 資料請求のページから完了ページまで進む率は35%のままで、変わっていなかった。減っていたのは資料請求のページに来る人の数
4. 電話の問い合わせを数える計測が、13か月で0件だった

1つ目の保持期間は初期の設定のまま気づかれにくい所です。Googleのヘルプによると、保持期間は2か月か14か月を選べて、この設定が効くのは探索とファネルのレポートだけで、標準のレポートには効きません（出典はアナリティクス ヘルプ「データの保持」）。標準の画面では1年前の数字も見えるので、困るのは細かく掘ろうとしたときです。2か月より前のデータで探索を作ると、何も出てきません。

3つ目は、問い合わせが減った理由を考えるうえで大事な数字でした。資料請求のフォームまで来た人が申し込む割合は変わっていません。フォームの作りが悪くなったわけではなく、フォームにたどり着く人が減っていたのです。直すべきはフォームより手前で、検索や広告から来る人の数と、トップページから資料請求までの道のりです。

2つ目のbotは3つ目を読むときの邪魔になります。機械の訪問がまざると訪問数がふくらみ、率が下がって見えるからです。6月30日に何が変わったのかは、先方に確認しているところです。

4つ目の電話は、計測の仕掛けはあるのに1件も数えられていない状態でした。電話のボタンが押されても記録されていないのか、本当に1件も電話がないのか、画面からは分かりません。作り直すときは、電話のボタンを押した回数を数え直す必要があります。LINEの相談のボタンも成果として数える設定になっておらず、1回押すと2回記録される作りでした。

今のサイトの中身を数えて分かったこと

権限が届く前でも、WordPressが外に出しているデータ（REST API）とサイトマップから、かなりのことが分かります。10月13日に、ログインなしで数えた結果です。

• 投稿（ブログの記事）約1,600件、固定ページ50件あまり、画像約4,600枚、カテゴリー約40個、タグ350個あまり
• WordPressの本体は4.7系で、2016年に出たバージョンのまま更新が止まっていた
• 記事のURLは、ほぼすべてが /数字/ の形
• 記事のうち746件の本文に、ほかのソフトから貼り付けた見た目の指定が混ざっている
• 1,231件の記事で、画像のURLが http:// で始まる古い書き方のまま

いちばん驚いたのは固定ページです。フォームの3件以外は本文が0文字でした。コースの説明も校舎の案内もテーマ（見た目を作っているファイル）の中に直接書き込まれていて、WordPressの編集画面を開いても空の画面しか出ません。

スタッフさんがコースの料金を直したくても、管理画面からはできない作りだったわけです。新しいサイトに文言を移すために、サーバーからテーマのファイルを読み、59本分の文言・料金・よくある質問を抜き出しました。

問い合わせの本線もWordPressの外にありました。資料請求と体験レッスンのフォームは、WordPressとは別にサーバーに直接置かれた古いプログラムで動いています。WordPressだけ見て棚卸しをしていたら、このフォームは見落としていたと思います。

GA4で見た使われ方は移す順番を決める材料になりました。2025年10月から13か月分を見ると、検索から入ってくる人の半分ほどが記事に着地しています。ただし記事の表示は上位の記事に偏っていて、13か月で表示が10回に満たない記事が859件ありました。校舎のページは検索に強く、地名で探す人がよく着地しています。校舎のURLは変えないと、この時点で決めています。

権限集めでは、持ち主がばらばらだった

権限は見積もりを出した3日後に、お願いしたいものを1枚のページにまとめて送りました。お願いした項目の一覧はWordPressサイトのリニューアルに載せています。

実際に集めてみると、持ち主がそろっていませんでした。

ドメインの契約先が分からないのは、珍しくありません。サイトを作った会社がドメインも代わりに取っていて、契約の情報が社内に残っていないことがあります。今回はDNS（ドメインの住所録）がサーバーの契約に付いていたので、今の設定を外から読んで24件を控え、新しい置き場所に写しておきました。ドメインの契約先が分かった時点で、住所録の切り替えだけをお願いする段取りです。

もう1つ、Cloudflareのアカウントはスクールの名義で作ってもらい、私を管理者として招待してもらいました。私の名義で作れば早いのですが、それだと契約が終わったあとに持ち主の問題が残ります。

ファイルを出し入れするための接続の情報は、最初はチャットのグループに書き込まれていました。誰でも見られる場所に残るので、アクセス情報をまとめた非公開のページへ移すよう提案しています。

デザインのデータ（.ai）をページにして、寸法を測って合わせる

デザインは、先方の担当者さんがIllustratorで作ったデータ（.ai）で届きます。10月5日に届いたデザインから組み始め、そのあと10月12日、15日、17日、11月2日と修正版が届きました。

.ai は外側がPDFになっていて、文字をアウトライン化（文字を図形に変えること）していなければ、文字の位置・大きさ・書体・色を数字で取り出せます。今回はプログラムで取り出して、それを基準にページを組みました。目で見てまねるより、数字で合わせるほうが速くて正確だからです。

組んだあとは、確認用のサイトを .ai と同じ幅で開き、文字の行ごとに位置・大きさ・字間・行の間隔を測って比べます。ずれてよい幅は次のように決めました。

外れた行には直したのか、わざと残したのか、測り違いなのかを1行ずつ書き込み、全部に理由が付くまで終わらせません。目で見比べていたころは、修正の赤字が入った所だけ直して、絵の中で変わっていた所を拾いきれていませんでした。数字で測るようにしたのはそのためです。

スマホのデザインは幅1080の画面として描かれています。そこで、デザインの1pxを画面の幅に比例させる書き方にしました。CSSでいうと calc(N * var(--sp)) のように、デザインの数字Nに「画面の幅÷1080」を掛けるだけです。こうしておくと、幅390でも375でも同じ比率で並びます。

デザインのデータには紙面に見えない指示も入っていました。画面の外に置かれたメモです。スマホの最初の画面の写真の大きさや、写真を固定したまま下の内容がかぶさってくる動きの指定は、PDFとして開いても出てこない所にしか書かれていませんでした。届いたデータは画面の外まで取り出して読むようにしています。

書体にも課題がありました。デザインで使われているヒラギノなどの書体は、Webで配信する許諾がありません。近い形の無料の書体に置き換えました。ただ、置き換えた書体の字幅で字間を決めると、デザインとずれてしまいます。11月4日からはデザインのデータに入っている書体の字幅で測り直しています。

WordPressとPHPの更新で踏んだ罠

ヘッドレスにしてもWordPressは裏で動き続けるので、古いままにはしておけません。予定より早く手を付けることになったのは、10月21日にPHP（WordPressを動かしている言語）の緊急の脆弱性が出たからです。このサイトのPHPは修正版が出ない7.4だったので、先方の了解をもらってその夜のうちにサイト全体をメンテナンスの画面に切り替えました。経緯はWordPressのPHPバージョンアップ手順に書いています。

上げるバージョンはWordPressが4.7系から7.1.3、PHPが7.4から8.3です。いきなり本番を触らず、まず手元に本番の複製を作り、そこで上げて確かめました。

複製で上げてみて見つかった罠は2つあります。

1つ目はSEO用のプラグインAIOSEOです。2.x系から5.0へ一気に上げると、旧設定を移すための控えが作られず、ページごとに書いていた検索結果のタイトル77本が空になりました。タイトルの書式も初期のもの（記事名とサイト名を並べただけ）に戻ります。画面はふつうに表示されるので、検索結果を見るまで気づきにくい壊れ方です。手元ではプラグインの移行の処理を手で呼び直して直し、本番の手順にも同じ処理を入れました。

2つ目はACFという項目を足すためのプラグインです。校舎のページはACFの繰り返し項目（同じ形の欄をいくつも並べる機能）で組まれていました。ACFを最新の6系に上げると、繰り返し項目は無料版から外れているので、校舎のページが崩れます。そこでACFだけはバージョンを上げず、PHP 8で止まる箇所だけを手で直しました。

ほかにもプラグイン20本あまりを最新版にし、更新が出ていない5本はPHP 8で止まる書き方だけを書き換えています。テーマは引用符のない文字240か所に引用符を付けました。

確かめ方は全URLを切り替え前と見比べる方法です。手元の複製で全URL（約1,800件）を開き、表示できなかったのは1件だけで、それはもとからある転送でした。保存しておいた更新前の21ページとも、本文とタイトルがほぼ一致しています。本番への入れ替えは新しいファイルを別のフォルダに置いておき、フォルダの名前を付け替えるだけで済む形にしました。戻すときも同じ手順を逆向きにすれば戻せます。

更新のあと、お問い合わせフォーム3つが送信で止まった

本番のWordPressを7.1に上げた10月23日の夕方、Contact Form 7で作られた申込系のフォーム3つが、送信ボタンを押した瞬間にエラーで止まりました。手元の複製での確認はページの表示と管理画面まででした。

原因をたどると、2つの事情が重なっていました。

1. テーマに、ページの最後で必要な部品を読み込む呼び出しが入っていなかった。そのためフォーム用のJavaScriptが読まれず、送信はページそのものに送る古い形で動いていた
2. URLを好きな形にするプラグイン（Custom Permalinks）が、ページを組み立てる処理を中で入れ子に呼んでいた。その結果、フォームの送信の処理が1回の送信で2回動き、2回目でエラーになった

直し方は小さなものです。WordPressが必ず読み込む場所（mu-plugins）に数行のファイルを置き、送信の処理が1回動いたら2回目は呼ばれないようにしました。テーマにもプラグインにも手を入れていないので、どちらを更新しても直した内容は消えません。

確かめるときは、本番のフォームに空のまま送信しました。入力が足りないという返事が返ってくれば、送信の処理は最後まで動いています。空なのでメールは誰にも届きません。本番の送信口に試しの内容を送ると、スクールの受信箱に届いてしまうので、そこは避けています。

旧URLの転送と計測の引き継ぎ（サイトリニューアルのSEO）

サイトリニューアルでSEOの順位が下がる原因は、たいていURLが変わったのに転送がないことです。Googleのサイト移転のガイドでは、古いURLから新しいURLへ301か308の恒久的な転送をかけ、できるだけ長く、一般的には少なくとも1年残すこと、移転のあいだ順位が一時的に揺れることが書かれています（出典はGoogle 検索セントラル「URL の変更を伴うサイト移転」）。

今回は記事を今と同じ /数字/ のURLで出すので、記事1,600件の転送は要りません。カテゴリーの一覧も、校舎とコースのページも同じURLにします。URLを変えるのは、講師のページと、まとめたり廃止したりするページだけです。

それでも、旧URLを全部並べると扱いを決めるべきものが残りました。サイトマップ、GA4の13か月分のURL、今かかっている転送、サーバーにあるフォルダを全部合わせて、新しいサイトと突き合わせた結果です。

要判断の72件の中でいちばん大きいのは、校舎の一覧と各校舎のページでした。検索から人が着地するページとして記事に次いで大きいので、トップページへ転送するとその地名での検索の順位を失う見込みです。校舎のURLは変えないと10月13日に決めていたので、新しいサイトに受け皿のページを用意する必要があります。

もう1つ、気づきにくい所がありました。資料請求のフォームはWordPressの外でサーバーに直接置かれたプログラムで動いています。表のサイトをCloudflareに切り替えた時点で、このフォームは止まります。切り替える前に、新しいフォームを用意しておかなければいけません。WordPressの転送用のプラグインに入っている転送も、データベースの中にしかないので、書き出して転送表に足します。

計測の引き継ぎで、切り替えの前に確かめることは次の3つです。

• 資料請求の完了を、新しいフォームでもGA4の成果として数えられるか。今のフォームの完了ページは切り替えると消える
• 電話とLINEのボタンを、押した回数どおり1回ずつ数えられるか
• 広告とSNSのタグが新しいサイトにも入っているか。タグマネージャーの権限がまだないので、ここは権限が届いてからになる

メールにも注意が要ります。スクールのメールはサイトと同じサーバーの契約で動いています。住所録を切り替えるときに、メールの受け取りに使う設定を写し忘れると、スクールのアドレスにメールが届かなくなります。今の設定は控えてあり、切り替える前にもう一度突き合わせる予定です。

ホームページリニューアルの費用は、どこに時間がかかったかで見る

金額はクライアントとの約束で書きませんが、どこに時間がかかったかは書けます。ここまでの作業を振り返ると、時間がかかったのは見た目より裏側でした。

見積もりを比べるときは、右の列の項目が入っているかを見てください。入っていない見積もりは安く見えますが、公開した日にフォームが止まったり、順位が落ちたりしたときの手直しが別の請求になります。見積もりの項目の分け方はWordPressサイトのリニューアルに載せました。

公開したあとの本体の更新も費用として見ておく所です。ヘッドレスにしても裏のWordPressは残るので、本体とプラグインの更新は続きます。何をして費用が何で変わるかはWordPressの保守運用にまとめています。

公開までに残っていること

11月4日の時点で残っているのは次のとおりです。

• 裏のWordPressを別のアドレスに移す段取りと、切り替えの日を先方と決める
• 校舎と講師のデータを、WordPressから受け取るか、新しいサイト側で持つかを決める
• 記事を公開してから表のサイトに出るまでの合図（定時に作り直すか、公開ボタンに合わせるか）を決める
• 要判断の72件の行き先を決め、転送表を仕上げる
• 資料請求の新しいフォームを作り、送信と自動返信とGA4の記録まで確かめる
• ドメインの契約先を確かめ、メールの設定を写してから住所録を切り替える
• タグマネージャーとSearch Consoleの権限をもらい、公開した日にサイトマップを送る

これからリニューアルを始める方は、上の段階のうち最初の3つ（数字を調べる、権限を集める、中身を数える）だけでも先にやっておくと、見積もりも工期もぶれにくくなります。どれも権限がなくても、あるいは閲覧の権限だけで始められる作業です。

私が手伝えるのは、この記事に書いたことそのものです。今のサイトの数字と中身を調べて作り直す範囲を決めること、デザインのデータを測って合わせること、古いWordPressを壊れていないか確かめながら上げること、URLと計測を引き継いで切り替えること。公開して数字が出たら、問い合わせの率と検索から来る人の数がどう変わったかを、この記事に書き足します。