ホームページのリニューアルについて解説【進め方と注意点も】

2022 3/01

2022年3月1日

既にホームページを運営している人で「そろそろ既存のホームページをリニューアルしたい」と考えている方もいるのではないでしょうか？

日々事業を進めていく中で、競合他社の参入、Webテクノロジーやマーケティング手法の進化など、現状の環境、トレンドの時流の速さに自社のホームページが時代にそぐわないタイミングが必ず来ます。

この記事ではホームページのリニューアルを検討している方に向けて、

ホームページをリニューアルする理由
失敗しないためのリニューアルの進め方
リニューアル後にやるべきこと

これらを解説した記事になっております。

ホームページのリニューアルが必要な理由

まず始めに、ホームページのリニューアルを検討するきっかけとなる、代表的な理由をそれぞれ説明していこうと思います。

仮に現時点ではホームページのリニューアルを考えていなくても、今から挙げていく項目に1つでも当てはまるのであれば、リニューアルを検討してみても良いかもしれません。

ホームページのデザインが古い、レイアウトが悪い

ホームページだけでなく、Webサイト全般に言えることですが、デザインにもトレンドがあります。

デザインに古さを感じるのであれば、リニューアルを検討するタイミングかもしれません。

一昔前のホームページは、「画像サイズが小さい」「フォントが見ずらい（色やサイズ）」「スマホで見るとレイアウトに違和感がある」などの特徴があります。

デザインやレイアウトが古い＝訪問ユーザーがホームページを見づらく感じたり、どこをクリックすれば自分が求めている情報に辿り着けるのか迷ったりしてしまい、結果的にホームページの離脱率を高めてしまう要因になります。

ホームページの機能性が古い、もしくは不足している

機能性に関して代表的な要素で言うと、「ブラウザ対応」「デバイス対応」ではないでしょうか。

ブラウザの場合、一昔前まではIE（Internet Explorer）が主流でしたが、現在ではGoogle ChromeやSafariなどのブラウザが主流になってきています。

機能性が古いままだとこれらのブラウザでホームページを閲覧した時に、表示がおかしくなったり、レイアウトが崩れたりするケースが出てきます。

スクロールできます

Chrome	Safari	Firefox	Edge	その他
62.78%	19.3%	4.2%	4.05%	5.03%

2022年3月時点のブラウザシェア率：gs.statcounter.com

デバイスに関しては、昔はPCからの閲覧がメインで、「モバイル専用ページはこちら」といった、モバイル専用ページを別に用意する手法も昔はよく見かけました。

現在はホームページに訪問したデバイスの画面サイズを自動的に認識し、PC、モバイル、タブレットそれぞれに適した表示に自動的に切り替えてくれる、いわゆるレスポンシブデザイン対応が必須となっています。

ホームページをスマホ対応させる方法を知りたい方はホームページをスマホ対応させる方法！スマートフォン表示が必要な理由も解説の記事を参考にしてみてください。

ホームページのアクセス数、お問い合わせ件数などの数値指標の低下

自社ホームページの設定しているKPI（Key Performance Factor：重要業績評価指標）は、会社により様々だと思いますが、一般的なホームページにおいての数値指標はアクセス数、お問い合わせなどのコンバージョン（CV）数、PV数、UU数などが代表的ではないでしょうか？

数値目標も設定して、しっかり運用しているのに数値が徐々に下がっているケースの場合、ホームページのリニューアルを検討する1つのタイミングかもしれません。

先程説明したデザインの変更や、ページ内のコンテンツ整理、見直しが必要になっている場合があります。

ホームページリニューアルの進め方

ここからは実際にホームページのリニューアルを行なっていく際の、具体的な進め方について説明していきます。

リニューアルを自社で行う場合はもちろんのこと、制作会社に外注する場合でも、リニューアルの効果的な進め方を理解した上で外注を依頼すると、低コストでかつ効果的な成果を得ることができます。

ホームページリニューアルの目的と目標数値を設定

ホームページの新規立ち上げも同様ですが、リニューアルの目的が明確に設定されていないと、せっかくリニューアルしたのに思ったように成果が出なかった、といったケースに陥る可能性が高くなってしまいます。

リニューアルをする際の代表的な目標としては

ホームページを使っての集客アップ
自社の採用強化
自社の業務改善、効率化

上記に当てはまらない場合は、逆にホームページのリニューアルを検討する必要はないかもしれません。

現状のホームページの課題分析

次に現在のホームページの課題を抽出します。

初めに自分でホームページを実際に使ってみる、可能であれば他人に使ってもらう、などをしてホームページの気になる点を思いつく限り挙げていくのがポイントです。

一例を挙げると

文字が小さすぎて読みにくい
→視認性向上
スマホで見るとレイアウトが不自然
→レスポンシブデザイン検討
目的のページに辿り着きにくい
→ページ構成変更
お知らせやブログの更新などがしにくい
→CMSツールの導入

なるべく閲覧ユーザーの視点で課題を抽出していくのが重要なので、なるべく普段事業に関わっていない、社外の人間にホームページを使ってもらうのがおすすめです。

次に現状のホームページの数値指標をチェックします。

アクセス解析ツールを使って、アクセス数やページビュー数などの各数値指標をチェックして記録しておきましょう。

リニューアル後の具体的な成果指標を確認する際に非常に有効です。

もし、アクセス解析ツールを導入していない場合は、今からでも導入しておくことをおすすめします。

代表的なアクセス解析ツールはGoogleから無料で提供されているGoogle Analyticsになります。

未導入の方はこれを機会に是非導入してみてください。

同業、競合他社のホームページを分析

自社ホームページの課題をある程度抽出し終えたら、同じ業界、または競合他社のホームページをいくつかピックアップして分析しましょう。

この時に、自社のホームページに不足している要素だけでなく、自社にしかない強みを逆に見つけることもできると思います。

他社のホームページを探す時は、キーワード検索で上位表示されているサイトや、業界ごとのホームページデザインなどが検索できる、Webデザインギャラリーサイトを活用すると良いでしょう。

筆者がよく使用しているギャラリーサイトを載せておくので、よかったら参考にしてみてください。

筆者がよく使うWebデザインギャラリー集

・81-web.com
・I/O 3000
・ズロック
・イケサイ
・GOOD WEB DESIGN
・URAGAWA
・DesignBase

ページ構成、ワイヤーフレーム、デザイン案、コンテンツ設計

ここからは制作段階に入る前の事前準備の作業になります。

ページ構成

まずはページ構成を決めるのに必要な、サイトマップを作成しましょう。

サイトマップを作るには専用のツールなどは特に必要なく、エクセルやスプレッドシートで作成が可能です。

下記にサイトマップの一例を載せておくので、よければ参考にしてください。

サイトマップの例

ワイヤーフレーム

ページ構成が決まったら、サイトマップを軸にワイヤーフレームを作成しましょう。

ワイヤーフレームは、ページごとの構成やレイアウトを細かく整理したものになります。

言葉で説明するのは難しいので、分かりやすいワイヤーフレームの一例を載せておきますので、確認してみてください。

例はAdobeのXDというツールを使用して作成されたものですが、ワイヤーフレームもサイトマップ同様、エクセルやスプレッドシートで作成可能です。

出典：Wires-jpより

デザイン案

デザインを選定する上で、大きく分けて2種類の方法があります。

ワイヤーフレームをもとにデザインカンプを作成
参考サイトをいくつかピックアップし、それらのデザインを軸にコーディング作業に進む

上記2つの方法があります。

デザインカンプは、完成後のホームページのデザインが忠実に再現されたものになります。

デザインカンプの作成は、AdobeのXDやPhotoshopなどの専門的なツールを使用して作成するのが大半で、最低限のツール使用方法やデザインに関する知見がないと、少し難易度が高い作業になります。

2.の方法を選択する場合は、デザインの再現スキルがなくても参考サイトを見ながらのコーディングになるので、比較的工数を削減できる手法になります。

これらは社内にデザイナーがいない場合は、外注業者にお願いするケースが多いです。

コンテンツ設計

ワイヤーフレームとデザイン案を軸に、それぞれどんな文章や写真を載せるのかを準備していきます。

文章の内容や載せる写真によって、閲覧ユーザーに与える印象が大きく変わるので、ここは時間を掛けて考えていくのが良いでしょう。

特に文章を書くのが苦手な方は、制作会社やライターさんなどにお願いするのも1つの手段になります。

既存ホームページの文章を使い回す際も、ユーザー視点で見直す箇所はないか？わかりにくい表現はないか？などをチェックしてから載せると良いでしょう。

コーディングと開発

ここでは実際のコーディングと開発を行うステップになります。

社内にコーダーやエンジニアがいない場合は、外注を依頼する形になります。

自社制作、外注問わず、作業者から確認依頼やフィードバックが求められた場合は早めに対応してあげましょう。

ここのやり取りがスムーズに行われていないと、作業の進捗に大幅な遅れが生じてしまいます。

ホームページリニューアル時のよくある失敗と注意点

この項では、ホームページリニューアル時のよくある失敗と注意するポイントをそれぞれ解説していきます。

ホームページリニューアルの目的が不明確

筆者も数多くのリニューアル案件に携わってきましたが、よくあるケースがこれになります。

リニューアル前に目的をしっかりヒアリング、抽出しておくのは重要ポイントです。

目的が不明確なままリニューアル作業をしてしまうと、思ったように成果が出ず、費用や時間などを無駄にしてしまうことになります。

既存アクセス消失のリスク

リニューアル後にドメインやページURLを変更すると、既存のユーザーやメイン流入元からのアクセス数が減少してしまうリスクがあります。

ドメインとページURLの変更をせず、そのまま運用する場合は問題ありません。

どうしてもこれらの変更が必要な場合は、旧ドメインやページURLに対して、301リダイレクトの設定をする必要が出てきます。

特にコンテンツSEOなどで作成した記事それぞれに対して301リダイレクトを掛けるとなると、膨大な時間と費用が掛かります。

制作会社に依頼した場合、○記事数までは無償でリダイレクト設定しますと謳っている会社もあるので、依頼する場合は確認するようにしておきましょう。

適切な制作会社を選定していない

これはリニューアル作業を外部業者に依頼する場合の注意点です。

例えば、ホームページをリニューアルして集客効率を上げたいのに、デザインが得意な制作会社に外注を依頼してしまうと、期待した効果が得られません。

先程説明した、リニューアル目的の明確化にも重なります。

自社で制作する場合も、社内のプロジェクトマネージャーやディレクターなどに、リニューアルの目的をしっかり伝えておくのは大切です。

当サイトの別の記事で、「ホームページ制作に関するやってはいけないこと」をまとめた記事があるので、よかったら参考にしてみてください。

ホームページリニューアル後にやるべきこと

リニューアルが終了し、ホームページを公開して終わりではありません。

最後に、ホームページをリニューアルした後にやるべきことを説明していきます。

各メディアでホームページがリニューアルしたことを告知

プレスリリースでの告知
所有しているSNSアカウントでの告知
ホームページ内でのお知らせ

上記3つが代表的な告知手法になると思います。

リニューアル後の各数値指標をモニタリング

アクセス解析ツールを用いて、リニューアル後のホームページ運用が上手くいっているか、アクセス数やお問い合わせ件数などの各数値指標をモニタリングしましょう。

思った以上の成果が出ていないページやコンテンツに関しては、内容や配置順序などを変更してみたり、2種類のパターンを用意してA/Bテストを行なってみるのもおすすめです。

リニューアル公開後も安心せず、検証と改善を繰り返し行なっていきましょう。

ホームページのリニューアルについて解説まとめ

ホームページをリニューアルする理由、失敗しないための進め方、リニューアル後にやるべきことを解説してきました。

色々解説してきた中で、やはり最も大事なのは目的の明確化と既存ホームページの課題抽出のフェーズだと思います。

ここが明確でなかったり、抽出不足の場合、せっかくリニューアルしたのに成果が･･･といった事態を招いてしまいます。

制作会社に外注するのを検討している場合でも、事業に関して自分ごとのように考えてくれる業者さんを選定することがポイントになります。

制作会社に依頼するのを検討している方は【これで安心】ホームページ制作を依頼する前にチェックするポイント！の記事を参考にしてみてください。