300ページのサイトリニューアル実録｜保険業サイトの9ヶ月を工程順に振り返る
サイトリニューアルを検討して制作会社のサイトをいくつか見ても、載っているのは「ヒアリング→設計→デザイン→公開」といった工程の名前まで、ということが多いのではないでしょうか。その工程の中で実際に何が起きて、制作会社がどんな判断をしているのかは、発注する側からはなかなか見えません。
この記事は、ENVY DESIGNが実際に担当した保険業の企業サイトのリニューアル(約300ページ・期間約9ヶ月・2025年公開)を、工程順に振り返る実録です。うまくいった工夫だけでなく、デザイン初稿で「既視感がある」と言われたこと、チェックを重ねてもリンクの誤りが残ってしまったこと、やりたくてもできなかったことも含めて、ありのままに書いています。
リニューアルの一般的な手順を知りたい方は、先に「ホームページリニューアルの進め方」をご覧ください。本記事はその手順の「中身」が実際にどう進むのかを、1つの案件に絞って公開するものです。なお、クライアントが特定されないよう、企業名は伏せ、内容は事実の範囲で一部ぼかしています。ENVY DESIGNではこれまで保険業のサイトを複数制作しており、本記事はその中の1件です。
このページでわかること
- 約300ページのリニューアルが、9ヶ月でどう進んだか(工程順)
- アクセスデータを持っていないクライアントと、要件をどう決めたか
- 「リニューアルした感がない」と言われた初稿から、どう立て直したか
- 300ページの品質をどう担保したか(三層チェック体制)
- 実際に起きたミスと、やり残したこと
案件の前提
| 業種 | 保険業(企業名は非公開) |
|---|---|
| 種別 | コーポレートサイトのリニューアル |
| 規模 | 約300ページ |
| 期間 | 約9ヶ月(キックオフ〜公開) |
| 公開 | 2025年 |
| 定例 | 隔週(必要に応じて臨時・担当者個別の打ち合わせ) |
日常のやり取りはメールとスプレッドシートで行い、決めることが多いフェーズでは定例とは別に臨時の打ち合わせを挟みました。
きっかけは「会社目線の導線」だった
リニューアルの出発点は、デザインの古さではなく導線の問題でした。既存サイトは、会社のことを知っている社員が見ればわかる構成になっている一方、初めて訪れたユーザーには何がどこにあるのかわかりにくい状態だったのです。
特に問い合わせです。この企業の問い合わせ窓口は、大きく分けて5つほど、細かく分ければ20ほどありました。保険という商材の性質上、契約に関する相談、事故などの緊急連絡、法人としての取引相談など、用件によって受け付ける窓口が異なります。ところがユーザー側から見ると、その種別の違いがわかりにくく、「自分の用件はどこに問い合わせればいいのか」を探すこと自体が負担になっていました。
社内では当たり前になっている分類でも、初めて訪れたユーザーには伝わらないことがあります。これは保険業に限らず、事業部が多い企業や、BtoBとBtoCの両方の顧客を持つ企業のサイトで広く見られる傾向があります。
要件定義──数字がないなら、仮定から始める
要件定義でまず直面したのは、判断材料になる数字が乏しいことでした。どのページがどれだけ見られているか、どの窓口にどんな問い合わせがどれだけ来ているか。先方が持っていたのは、担当者の感覚値が中心でした。
ここで「データが揃うまで進められません」と止まる選択肢もあります。ただ、私たちはそうしませんでした。数字がないなら、仮定を立てて走り出し、走りながら検証すればよいと考えたためです。
具体的には、次の3つを要件定義の柱にしました。
- サイトマップ(全体構成)の設計
- 既存ページの棚卸し
- 対応範囲の線引き
そして、この段階で全てを確定させることは、最初から前提にしませんでした。実際、制作中に他事業部からの要望を受けて追加ページが発生しています。見積は一式で、あらかじめ多少のバッファを持たせていたため、数ページ程度の追加はその範囲で吸収できました。大規模な案件ほど、「事前に全部決める」より「決め切れない前提で余白を設計する」ほうが機能しやすいというのが、この案件を通じた実感です。
設計──窓口は統合せず、入口を作った
問い合わせ窓口がわかりにくいと聞くと、「窓口を統合して減らせばいい」と考えたくなります。しかし窓口の数は、業務体制や受付フローと結びついているため、サイト側の都合だけでは減らせないことが多いのです。この案件でも窓口の一覧ページ自体は、リニューアル前後ともページ内アンカーで一覧できる1ページのまま変えていません。
変えたのは、そのページに至るまでの入口です。
ペルソナ10人と、3部署へのアンケート
まず、契約済みか未契約か、個人か法人かといった軸を組み合わせて、10人程度のペルソナを設定しました。そのうえで、各ペルソナがどの問い合わせ窓口を使う可能性が高いかを、担当3部署にアンケートシートで回答してもらいました。
回答を依頼したのは3部署です。もちろん、統計的な傾向を把握するための調査ではありません。目的は、日々ユーザーと接している現場の肌感覚を、設計に使える形で引き出すことでした。アクセス解析のデータがない案件では、日々ユーザーと接している部署の知識は、設計の仮説を立てるための重要な一次情報になります。結果は私たちの想定と少し違う部分もありましたが、大きな意外性はなく、仮説の確認と微修正に役立ちました。
トップ構成は「1案+派生5パターン」で提案した
サイト全体の構成見直しと並んで時間を要したのが、トップページの構成です。トップは入口を網羅する要のページなので、ここの合意形成には時間をかけました。
提案の仕方は、ゼロから複数案を並べるのではなく、私たちが最適と考える1案をベースに、派生で5パターンほどを用意する形です。さらにセクション単位でも複数の見せ方を提示しました。全く方向性の違う案を横並びにすると、比較の軸が定まらず議論が発散しやすいためです。軸になる1案があり、その変化形が並んでいれば、「どこを残し、どこを変えるか」という具体的な議論になります。
先方の承認には時間がかかりましたが、これは悪いことではないと考えています。トップの構成は、その後の全ページの設計を規定します。ここで妥協して進めるより、時間をかけてでも納得のいく形で合意しておくほうが、後工程の手戻りは小さくなります。
緊急性の高いものをファーストビューへ
入口の設計方針は2つです。1つは、トップページとヘッダーで主要な入口を網羅し、ユーザーの状況別に分けること。もう1つは、緊急性の高い用件をファーストビューに置くことです。
事故の連絡のように急いでいる方が探す情報は、探させてしまった時点で、良い体験とは言えなくなってしまいます。「緊急性」と「問い合わせの多さ」の2軸で優先順位を付け、問い合わせが多い順番も先方にヒアリングして、トップの配置に反映しました。
なお、その後、実際の問い合わせ件数の傾向と突き合わせたところ、当初のペルソナごとの想定と一部乖離があることがわかり、トップページでの優先順位を途中で補正しました。ペルソナは作って終わりではなく、実態と突き合わせて直すところまでが設計だと考えています。
デザイン──「リニューアルした感がない」と言われてから
この案件でいちばん学びが多かったのは、デザインの工程です。
先方には当初から「リニューアルしたことがしっかり伝わるようにしたい」という要望がありました。私たちは導線もコンテンツ配置も旧サイトとは全く別物の設計を組んだのですが、初稿デザインを提示したところ、返ってきた反応は「なんとなく既視感がある」でした。
原因のひとつは、コーポレートカラーです。企業のカラーは変えられません。同じ色を基調にすると、構造がどれだけ変わっていても、ぱっと見の印象は旧サイトと地続きに見えてしまいます。そしてもうひとつ、この反応が重要だったのは、承認の構造です。サイトの承認は多くの場合、設計資料ではなく見た目で判断されます。導線設計の変化は、設計の過程に参加していない上長や他部署には伝わりにくいものです。見た目に「新しさ」が宿っていなければ、リニューアルの価値そのものが社内で伝わらないことがあります。
デザインだけの打ち合わせで、既視感の正体を探る
私たちは、既視感の正体を特定するための打ち合わせを設定しました。用意したのは、業種にとらわれず選んだ10サイトほどのデザイン事例です。選定基準は、信頼性・親近感・見やすさを満たしたうえで、あえて少しデザインが大げさ・派手めなものに振ること。振り幅を意図的に作り、先方の反応がどこで動くかを観察するためです。
打ち合わせでは、先方がサイトを見ながら口にする「こういうデザインいいね」「新しい」「最近っぽい」という何気ない感想が、どのサイトのどの要素で出たかを記録していきました。参考サイトのURLをもらうだけでは、その人が何を良いと感じたのかまではわかりません。部分的に気に入ったデザインを渡されても同じです。発された言葉だけでなく、そのとき見ていたデザインや反応もセットで、いわば面ではなく立体的に捉えて、「何を良いと感じたのか」を私たちなりに言語化していきました。この工程を挟んだことで、既視感の正体が見えてきました。
- コーポレートカラーの使われている面積
- 写真の見せ方
- サイト自体の横幅(コンテンツ幅が狭いと、それだけで古い印象になる)
この案件では、古さや既視感の印象は、コーポレートカラーそのものよりも、色が占める面積や写真の見せ方、コンテンツ幅に由来する部分が大きいのではないか、という仮説にたどり着きました。
色は変えずに、新しさを出す
正体がわかれば、打ち手は決まります。コーポレートカラーは維持したまま、それ以外のキーカラーを複数用意してカラフルな印象を作りました。キーカラーは飾りではなく、個人と法人、契約者と未契約者といったユーザー属性ごとの色分けに使っています。ペルソナ設計と色設計が、ここでつながりました。
あわせて、キービジュアルやセクション背景に大きな画像を使い、ブラウザの幅を広く使うレイアウトに変更しました。デザインは初稿から数えて5稿ほど重ね、細かな調整は公開直前まで続けています。
制作──300ページと、三層のチェック
設計とデザインが固まったら、300ページ分の中身です。
コンテンツは既存サイトからの移植を中心に、内容の刷新と追加を織り交ぜました。他事業部からの掲載要望も取りまとめ、散らばっていた情報を集約するハブページも新設しています。原稿は先方支給が基本ですが、書き起こしが難しいページは私たちがラフを作って渡しました。
承認を待たずに、叩き台で進める
9ヶ月・300ページの進行で意識していたのは、承認待ちの時間を止まって過ごさないことです。承認を取ってから次を作るのではなく、叩き台を先に作って進める。手戻りのリスクはありますが、大規模案件では待ち時間の累積のほうがはるかに大きなリスクになります。
これは進行テクニックというより、相手への配慮でもあります。叩き台があるほうが判断しやすい方は多いですし、ワイヤーフレームだけでは完成形を想像しづらい、という声もよく伺います。私たちはそのため、ワイヤーの段階で少しデザインを取り入れることもしています。判断しやすい形で渡すことが、結果的に承認を速くします。
人間・AI・外部業者の三層チェック
300ページ規模になると、誤字脱字やリンク切れを人力だけで潰し切るのは難しくなります。この案件では、品質チェックを三層で組みました。
- 人間複数人でのチェックを複数回
- AIによる誤字脱字チェック
- 公開前テストの外部業者への依頼
AIチェックについて補足すると、2025年公開の案件であり、当時はあくまで人間の補助という位置づけでした。それでも、長音記号「ー」の前の文字がひらがなかカタカナかの揺れのような、人間の目視では気づきにくい種類の表記揺れを拾ってくれた点は有効でした。AIに任せるのではなく、人間が構造的に見落としやすいミスの種類を担当させる、という距離感です。
さらに社内チェックとは別に、公開前テストを外部の専門業者に依頼しました。作った本人たちは、どうしても「あるはずのもの」を前提に見てしまいがちです。第三者の目を最後に通すことは、規模の大きな案件ほど効いてくると考えています。
検収と公開──ミスは出た。当日は無事故だった
外部業者のテストと修正を経て、先方の検収に入りました。検収は、各担当者が自部署のページをそれぞれ確認する分担方式です。指摘の中心はテキストの変更と一部UIの調整でしたが、正直に書くと、リンクの誤りについてご指摘いただいた箇所もありました。この経験からも、300ページ規模では「担当者が注意すればミスを防げる」という考え方では不十分だと感じています。人間のチェック、AI、第三者テスト、先方検収と確認者を重ね、どこかで見落としても次の工程で拾える体制にしておくことが重要です。
公開作業はENVY DESIGNが実施しました。リニューアルで特に注意したのは、既存の検索評価を無駄にしないことです。旧サイトのURLから新URLへ、100本を超えるリダイレクトを設定しました。URL変更を伴うサイト移行の考え方は、Google公式のドキュメントでも解説されています。
検収段階ではミスの指摘があった一方、公開当日のトラブルはありませんでした。事前のテストと検収で拾い切れていれば、公開当日は静かに終わる。それがあるべき姿だと考えています。
振り返り──やり残したこと
最後に、この案件でできなかったことも書いておきます。
1つは、公開後の効果検証です。この案件では、私たちの制作業務は公開までで一区切りとなったため、リニューアル後に問い合わせがどう変化したかまでは把握できていません。制作会社の実績紹介では成果が語られがちですが、実際には制作会社側が公開後の数字まで継続して追えていない案件もあります。
もう1つは、一般ユーザーによるユーザビリティテストです。ペルソナと部署ヒアリングで設計の確度は上げましたが、実際のユーザーに触ってもらう検証は、スケジュールと予算の制約で実施できませんでした。導線の設計を社内の視点だけで完結させないこと。それがこの案件の出発点だった以上、最後の答え合わせもユーザー自身にしてもらうのが理想だったと感じています。
この案件から私たちが持ち帰ったのは、シンプルな原則でした。導線は社内だけで決めない。数字がなければ仮定を立てて、現場に聞いて、実態と突き合わせて直していく。そして、変化は見た目に翻訳しないと伝わらない。リニューアルを検討している方にとって、工程の裏側を知る材料になれば幸いです。
よくある質問
アクセスデータがなくてもリニューアルはできますか?
できると考えています。本記事の案件でも、判断材料は担当者の感覚値が中心でした。その場合は、ペルソナ設計と現場担当者へのヒアリングやアンケートで仮説を作り、進めながら実態と突き合わせて補正する方法があります。ただし、次のリニューアルに備えて、公開後はアクセス解析を設定しておくことをおすすめします。
ページ数が多い場合、既存ページは全部作り直しますか?
全て作り直すとは限りません。本記事の案件では既存コンテンツの移植を中心に、必要な箇所の刷新と追加ページの制作を組み合わせました。全ページの書き直しは費用と期間が大きく膨らむため、棚卸しで「そのまま活かす・直す・統合する・削除する」を仕分けるのが現実的です。
問い合わせ窓口が多い場合、統合したほうがよいですか?
統合が最善とは限りません。窓口の数は社内の受付体制と結びついているため、サイト側の都合だけでは減らせないことが多いためです。本記事の案件では、窓口一覧のページは変えず、そこへ至る入口をユーザーの状況別に整理し直すことで解決を図りました。
リニューアルで検索順位が下がることはありませんか?
URLが変わるリニューアルでは、適切なリダイレクトを行わないと、旧URLから新URLへの評価やユーザーの移動を適切につなげられず、検索パフォーマンスにも悪影響が出る可能性があります。本記事の案件では100本を超える301リダイレクトを設定し、既存評価の引き継ぎに注力しました。それでも移行直後は順位が変動する場合があるため、公開後の観測も含めて設計しておくのが安全です。
公開前のテストは誰が行いますか?
制作会社によって異なります。本記事の案件では、社内での複数回チェックとAIによる誤字脱字チェックに加えて、公開前テストを外部の専門業者に依頼しました。第三者の目を通すことで、作り手が見落としやすい不具合を公開前に拾える可能性が高まります。
出典
関連記事