本文へ移動

Webサイト

このサイトのリニューアル|判断の記録

このサイトを作り直すときに比べた案と、採った理由・見送った理由をまとめた記録です(2026年10月)。ご依頼の案件でも、勧める案には理由を添えてご提案します。

記録1 作り方:既存のテーマを使うか、自作するか

課題
見た目に加えて、画面の構成や動きの実装まで、見本としてご覧いただけるサイトにしたい。
比べた案
既存の有料テーマのまま、中身を入れ替える/WordPressのテーマを自作して作り直す
採った案と理由
テーマを自作しました。画面の構成や動きも含めて、実装を見本として示すためです。作る手間と、その後の保守を自分で持つ負担は受け入れています。
見送った案と理由
既存のテーマのまま入れ替える案は、公開までの作業を最も減らせます。ただ、見本として示せるのが中身の入れ替えまでになるため、見送りました。
確認できたこと
公開前のテスト環境で、スマホ・タブレット・パソコンの画面幅を確認しました。確認した画面幅(375・390・430・768・1280px)では、横スクロールや表示崩れはなく、ブラウザのコンソールにもエラーは出ていません(2026年10月27日)。
まだ確認していないこと
公開後の保守にかかる手間。運用しながら記録します。
見直す条件
当初は、自作のテーマが公開予定に間に合わない場合、既存のテーマで先に公開する方針でした。自作のテーマで公開したため、切り替えは行っていません。

記録2 動きと表示速度:印象に残る動きと、速さ・読みやすさを両立させる

課題
ぱっと見で印象に残る動きを入れたい。ただ、そのせいで表示が遅くなったり、料金が読みにくくなったりしては意味がありません。
比べた案
控えめな動きに統一する/大きく動かすのは入口と場面の切り替えだけにし、料金やよくある質問は止めて読ませる
採った案と理由
2つ目の案を採りました。動きの実装も見本として示すためです。条件を4つ決めました。文字は演出を待たせずに出す/大きく動かすのは入口と切り替えだけ/表示速度の目標をPageSpeed Insightsのモバイル・パフォーマンススコア90以上に置く/動きを減らす設定の方には動きを止める。その分、確認する項目は増えます。
見送った案と理由
控えめな動きに統一する案は、読みやすさと実装の簡潔さで有利でした。今回は、動きの実装を見本として示すことを優先しました。
確認できたこと
動きを減らす設定にすると、背景と場面の切り替えの動きが止まることを、公開前のテスト環境で確認しました(2026年10月27日)。スマートフォンの実機でも確かめ、見つかった点を直しました。
まだ確認していないこと
表示速度(PageSpeed Insightsのモバイル・パフォーマンススコア)と、動きによる酔いやすさ。表示速度は公開後に本番のURLで計測し、酔いやすさは実機で確かめます。
見直す条件
同じ条件で再計測しても目標を下回る場合は、原因を調べます。背景の動きが影響していれば、まず線を止め、次に形を止め、それでも足りなければスマホは静止画にして軽くします。

記録3 入口の分け方:相談する目的に合わせて、入口を分ける

課題
自社サイトのご相談と、制作会社さまからの実装のご依頼では、先に知りたい情報が違います。
比べた案
制作会社さま向けに絞る/事業会社さま向けに絞り、途中に提携の案内を挟む/冒頭は両方に通る言葉にして、入口を2つ設ける
採った案と理由
入口を2つ設ける案を採りました。それぞれが必要な情報へ進めるよう、本筋は事業会社さまに通じる言葉で書き、制作会社さま向けの情報(料金・流れ・お取引先への配慮)は1か所にまとめました。その分、1ページの中に読み手の違う区画ができます。
見送った案と理由
制作会社さま向けに絞る案は、事業会社さまに伝わりにくくなります。事業会社さま向けに絞って提携の案内を挟む案は、制作会社さまが必要な情報を探しにくくなります。
確認できたこと
トップページの2つの入口から、それぞれの行き先へ進めることを確認しました。自社サイトのご相談はお問い合わせフォーム(相談の種類を選んだ状態)へ、制作会社さま向けは同じページの制作会社さま向けの区画へ進みます(公開前のテスト環境・2026年10月27日)。
まだ確認していないこと
情報の見つけやすさと、お問い合わせへの効果。
見直す条件
想定する読み手が、自分向けの入口や必要な情報を見つけられていない場合は、入口の言葉と配置を見直します。