(注)この記事は、2025年8月2日に投稿した「2年ぶりにサイトの大規模リニューアル」の再編集記事です。（できる限り当時の情報を残す形で編集しましたが、現在とは状況が変わっていることも多々あるので、現在の状況に合わせて編集している部分もございます。ご了承ください）
はじめに
クリエイトアコードの事業サイトのVer3へのリニューアルを2025年に実施し、2025年6月に完了しました。
大規模リニューアルの解説や裏話のまとめページのようなものと化してますが、よろしければ、ご覧いただければ幸いです。
リニューアルの経緯について
今までのリニューアルでも根本的な課題である「デザインができず適した素材も見つからないこと、視覚的に情報量が多い状態からまとめるのが難しく、分かりにくくなってしまっている」の解決はお金を出してデザイナーにデザイン制作を依頼する他にないと考え、デザイン制作を行った場合はデザインに合わせて作り変える必要があることから、リニューアルの必要性を強く感じていました。
デザイン依頼費の捻出が難しいことから対処療法のようなもので2023年に自分なりのリニューアルは実施していますが、それでも根本的な課題の解決には至っておりませんでしたので、今回は、デザイン依頼費の捻出も可能であると判断したために、デザイン制作依頼を考慮して2024年から依頼先（発注先）を探すのに動いておりましたが、なかなか発注先が決まらず……。
クリエイトアコード自身がこだわりを持っていたということもありますが、クリエイトアコードが実装を担当することから、「基本的な設計はクリエイトアコード、デザインはデザイナー、実装はクリエイトアコード」の体制でできる人が見つからなかったのが、見つからなかった要因としては大きいです。
（余談ですが、ロゴについては2024年6月時点には変わっていました）
2024年11月～2024年12月頃でしょうか。チームとして一つのサイトをリニューアルするという仕事があり、そこで出会ったWebデザイナーと一緒にサイトを制作していて楽しかったのと、協力している感じが良かったと感じていたことから、2025年4月くらいに情報を整理した後、思い切って「これを見やすくまとめてほしい。必要な素材やパーツのデザインを作ってほしい」と打診したところ、自身が望んでいた提案をもらえたことから、正式に発注を決め、デザインを作ってもらうことになりました。
デザイン制作を依頼した結果について
文章量が多いのが必ずしも悪いことではなく、丁寧かつ過不足なく情報を相手に与えるためのものでもあるので、このさじ加減は本当に難しかったんじゃないかなと思っています。大変お手数をおかけいたしました……。
でも、一緒に仕事をしている分、当方の人柄などが伝わっているからでしょうか。できあがったデザインが「まさにこれ！ これ、すごく『ぼく』って感じが出ているけど、お客さまが欲していること、ぼくが伝えたいことも伝えられている！」という感じでとても良かったです！
お気に入りは、RPGゲーム風のドットっぽい感じでまとまっているデザインと、整理を示すパズルゲーム風のデザイン。
あとは、サイト内で使っているドット絵キャラクターです。
これらの見た目が、ぼくに似ていて、とても気に入っています。
（愛用のノートパソコンも黒だし、ドラクエとテトリスも好きだしね！）
それに自分でも創作活動をしているので、そのあたりが出ている感じも気に入っています。
このドット絵のキャラクター、デザイナーから情報をもらいました！
「ちもん（X：@untimon）」さん作のドット絵イラストでした。かわいいね！
https://www.ac-illust.com/main/detail.php?id=1853024
SNSやチャットツールやグループとかのアイコンにはしないけど、仕事でも使いつつプライベート利用がメインのLINEと大体顔を合わせているであろう一部のチャットツールのアイコンにしようかなと思い、変えました。
（素材の使用方法のページのところで使用して良い例に載っているところか個人利用として許されるであろう場所にしか使ってないはずです！）
本当にこのキャラ、なんかぼくに似ている気がするんだけど、かわいいなぁ。
SNSで使っているアイコンについての補足・余談
「利用ルール上、曖昧である」と感じたというのは否定しませんが、それよりも、今「夜空きり」として使っているアイコンは、長年使っているアイコンで、もう「夜空きりのSNSアイコンはこれ」って感じで定着しちゃっているだろうからブランディング的に変えたくないんですよね。新しい名刺にもアイコンを載せているくらいだし。あと、作ってもらったからと使っている創作アカウント以外では今後も人物画像は使わないつもりです。実は、創作アカウントも長年使っているアイコンも含めているので、人物アイコンじゃない創作アカウントのアイコンを入れても分かるようになっています。
OGP（アイキャッチ）画像について
ただ、ネタ切れが酷く大変だったことから、一点だけ、当方が画像を加工してでっち上げたのが、ドット絵のキャラクターが寝ている画像。
（実は、当方はデザイナーではありませんが、前職で先輩にコツを教わっていたことや「なんでもやらねばならぬ」環境に置かれていたことから、ドット絵や画像の加工技術を持っています。事業サイトの中で使用しているいくつかの画像はもらった素材の中から組み合わせて作っています）
「ゆるゆるなキャラクターでブログを投稿したい！」というときってあるんですよ……勝手に作って（改造して）ごめんなさい。
（一応、「素材を加工・編集して使うことも可能」なので、これくらいの加工なら、大丈夫なはず……！ ダメだったら、ご指摘お願いいたします）
今回、クリエイトアコードの事業サイトのデザイン制作をしてくれた人は？
今回、クリエイトアコードの事業サイトのデザイン制作をしてくれた人は、デザイナーのともかさんです。
ふんわりした雰囲気で優しいデザインも多く作られていますが、相手のことをきちんと考えたデザインを作っているデザイナーであると、ぼくは信頼しているデザイナーです。
実際に、クリエイトアコードの事業サイト、夜空きりに会った人がどう感じているのかによっては意外に思う人もいるかもしれませんが、客観的に「ぼくの良さ」を正しく伝えてくれていると考えていますので、これからも一緒にお仕事をするのが楽しみです。特に、独立以降はデザイナーと一緒に制作することはほぼなかったので、本当に有難い限りです……！
当方自身はなるべくデザインに歩み寄る方針ではいますし、どうしても難しい場合は説明・共有するなどのフォローももちろんするものの、ぼくが実装中に運用・管理・実装コストとの兼ね合いに伴う相談を何度かしても、その度に真摯に向き合っていただき、「一緒に協力して制作している」と実感できるデザイナーは今まで出会ったことがなかったので、ともかさんには本当に感謝しています。
（「運用・管理・実装コストを度外視すれば、対応できなくはない」というのは否定しませんが、お客さまと必ずしも保守管理・メンテナンス契約ができるわけではないのと、今後のブラウザやWordPressのシステム更新にも配慮して今後の運用コストをできる限り抑えたいと思うと、難しい問題です……）
よろしければ、今後ともよろしくお願いいたします。
ともかさんの事業サイトもよければ見てね！
lattedesign-creative.com
クリエイトアコードの事業サイトがVer3になり、サービス開発・運用に集中できるようになりました！
クリエイトアコードの事業サイトがVer3になったことで、今までの課題が解消され、デザイン面に悩むことが減ったため、サービス開発・運用に集中できるようになりました！
今後も良質なサービスを提供していくため、お客様のお手伝いをしていくため、無理がなく継続できる内容を…と考えております。
これからも運用しやすくWebマーケティングも考慮したホームページを目指してサポート活動に取り組んでいきますので、ホームページ・WordPressでお悩みがある方は遠慮なくご相談ください。
今後ともクリエイトアコードを何卒よろしくお願いいたします。
クリエイトアコードの事業サイト、よかったら見てみてね！
create-accord.com
おまけ（リニューアル制作の裏話）
本編よりも長いです。
【裏話1】今回のリニューアルを機に、事業サイトと事業ブログで使用するテーマを分けました。
デザインに合わせて制作するにはSWELLだとカスタマイズを沢山しなければ難しかったため、URL上、サブディレクトリに事業ブログを設置しても問題がないと判断したこともあり、今回のリニューアルを機に事業サイトと事業ブログを切り分けることにしました。それはいいんだけど、WordPressのフルサイト編集の適用に伴うWordPressの仕様の大きな変化については想定外だったこともあり、テーマを分けて運用することは想定していなかったので、SWELLの独自ブロックを有難いと思って使っていたから、固定ページだけでも引っ越しがすごく大変でした。
というより、大変だった要因は、固定ページが40ページ弱もあったのが大きいと思うんだよね。
ただ、その後、事業ブログがサブディレクトリ型だったことで「サーチコンソールとアナリティクスの状況把握が面倒」「ログインするときのパスワード保存で同一サイト扱いになるので面倒」「そもそもコンセプトが開業当時のコンセプトとズレてきて投稿頻度が落ちすぎているから見直しした方が良い」など様々な問題が浮上したので、今のSWELLの事業ブログは「事業ブログアーカイブ」という形で残すことになり、今後は「事業ブログ（はてなブログで運用しているこれ）」と「Web運営・制作時の技術メモ（Zenn）」で切り分けて運用することになりそうです。
切り離したとき、ここが大変だったよ（1）
ブログやサイトのSWELLの関連記事がエラー表示になるんだけど、記事（固定ページ）の検索じゃ分からないので、目視で探すしかないところ。URLも引っ越し時に変わっちゃったのは失敗したなぁと今でも思っているんだけど、URLでなんとか探して直してって感じで結構大変だった……。（抜けがないように何度もチェックはしているけど、もしかしたら、まだ残っているかも……。実際、たまにチェックしては見つけて直しています……。移植等が終わったら、このあたりの問題も解決すると思うけど）
切り離したとき、ここが大変だったよ（2）
SWELLのブログパーツ、超便利って思って使っていたんだけど、ブログパーツはSWELL特有のものなので、そのまま引っ越し先に流用ができなかったところが本当に大変でした。幸いにも、実装時（移植時）にもコンテンツの再見直しもしていたので、パターン（同期）登録し直すこと自体はそこまで苦じゃなかったんだけど、ブログ側にあるブログパーツの「いらないもの」が分からなくなってしまい、消すのに慎重にならざるを得なくて、それが気を遣って大変だったなぁ……。
それなりに数が多かったので、今後の運用・管理に支障が出るかもと思うと消さないという選択肢はありませんでした……。
この記事を書いているときにも少し整理したから、後々エラーが出ていたのを見つけたら直そう……。あと、まだいらないのが残っちゃっているかもだけど、それはもう消さなくても良いかなぁって思いつつ……。
【裏話2】デザインと異なるところについて
「デザインをもらう前にしっかり詰めてすり合わせるべきでは？」と言われたら、正直返す言葉はないのですが、今回の場合は、もらったデザインから大きく変えてはいなくても、実装と同時に更なるコンテンツの見直しをしていたこともあり、その部分はどうしてもデザインから変わってしまっています。また、その場では気づかなかったのは申し訳ないことをしたなと思いつつ、デザインの再現をしようにも、デフォルトや使用しているプラグインの都合でカスタマイズなしにはできない部分がありまして……。運用・管理の都合で「なるべくデフォルトの仕様に合わせる」方針で作りたかったと考えていたこともあり、なるべく雰囲気は合わせるために角丸にするなどでCSSで調整はしていても、いくつかの要素はデザイン通りにはいきませんでした。
今回は依頼者（発注者）と実装者が自分であり、必然的にディレクション判断も自分だったので、正直に言ってしまえば「自分がOKと言えばそれで良し」というところはあります。金額的にも今後も運用をしていくことを考慮していたこともあり、デザイナー監修（チェック）までは依頼していませんでしたので。
本当は、もらったデザインはとても良いものであるということの証左として、比較してもらえるようにデザインデータも見れるようにしたらいいのかもしれないけど、そこまではしません。変更点については、なるべく文章で書きます。何卒ご容赦ください。
「思ったよりも、デザインと異なるところが多いな」って言わないで……！！
変えた理由はあるとはいえ、正直、当方の力不足によるところは否定できませんので……。その点に関しては本当に忸怩たる思いです。精進します。
改めてデザインデータと見比べたら、純粋に合わせていなかった細かいところが見つかったりもしたので、適時修正しています。今後も気になったところは改善に努めていきます。そして、本当に運用をしていく過程で、色々と変えざるを得なくなったので、「定期的にサイトの見た目チェック・相談を依頼した方が良いのかしら？」とは思っています。そろそろ落ち着いたとは思うのですが、まだ完全に落ち着いたとも言えず、時期は検討中です。
デザインと実装の完全一致の難しさについて
いずれにしても、見ているデバイスにより多少の差異は生まれてしまうことと、WordPressがいくらフルサイト編集という形で柔軟に対応できるようになったとしても、デザイナーもWordPressでサイトを構築できるほどに熟知していないとピクセルパーフェクトの完全なる実現は難しく、さらに言うなら、運用・管理・実装コストも総合的に判断して取捨選択もしつつデザインも配慮して作り上げるのは至難の業だと個人的には思うのです。
正直、「ここまで対応できるなら、デザイナー一人でいいじゃん」という話になると思うのですが、考えている脳の領域が違うと思うから難しいと個人的には思っています。
だからこそ、実装時にデザイナーと実装についてすり合わせしながら実装していくのが良く、「デザイン確定＝変更しない」というフロー・前提は、今のWordPressを使用したサイト制作とは合っていないのではないかと、個人的には感じているところです。
いずれにしても、マージン・パディング・フォントサイズ等のルール設計は必要になりますので、予め「良いデザインになるように」配慮して設計されているであろう既存テーマの設定内で選べる中で近しい値・ルールで設定をする方が結果的に良くなるのではないか、と最近では考えています。
（どうしてもデザインと大きく異なるなと感じた厳しいところは、スペーサーブロック等を活用して工夫して対応するという手もありますし）
これは、人により様々な意見・見解があると思いますので、あくまで、ぼくはそう思っているという感じで捉えていただけたらありがたく存じます。
スライダーについて
今回依頼したのは「Home」と「ホームページ改善・改修サポート」のサービスページの2ページだったため、実績ページはデザイン制作の要件外となっていました。そのため、デザインはもらっていないのですが、制作実績の所はスライダーの方が良いと判断して、スライダーにしています。
実装時はプラグインで対応しているスライダーを使っていますので、もらったデザインのスライダーの通りではありません。使う場所も違うし用途も違うことからデザインと合わせる理由もないのでほぼデフォルトのまま（矢印もいらないのでパーツの色だけ変えた）です。なお、スライダーの中身は、画像＋説明文の組み合わせのリカードデザインを独自で作ってリンクを貼った方が見た目がキレイかもと思うので、そのように対応しました。（これもブロックの拡張プラグインを使って実装しています）
サイトマップについて（「メニュー」ハンバーガーメニューの廃止について）
最近のデザインでは、スマートフォンではハンバーガーメニュー、PCだと横並びのメニューですよね。
実は、個人的にはずっと納得がいっていません。いくら、「MENU」とついていて、「大体、そういうものだろう」と理解していることから操作性に問題がなかったとしても、です。どうして納得がいっていないのかについては、きちんと言語化ができているわけではないのですが、事業サイトとして見たときに必要なのは「HOME」「サービス」「事業者情報」「お問い合わせ」の4つがあり、他に見たい情報があれば、フッターまたは必要に応じて導線を考慮するという形で、必要最低限で「迷わせにくい」構造が望ましいのではないか、と考えています。サイトの種類によると思うので、ハンバーガーメニュー自体がダメというわけではないのですが、なんでもかんでもハンバーガーメニューというのは納得がいかない、ということなんだと思います。
ただ、ここで引っかかるのは、「個人事業主のサイトで、いきなり「相談したい」「問い合わせしたい」ってケースってどれくらいあるんだろう？」と。「どちらかというと、実績・事例を見たいんじゃない？」とも思うのです。ただ、実績・事例を見る前に、「まず、お前は誰だ？」と思うというか。すぐに信頼して次のアクションに進みたいケースはあまりないように感じています。すぐに相談に結びつきやすいのは、はっきりとサービス内容が分かっているものだけかなぁと。それなら、実績・事例もすぐに見えるようにして価格もある程度載せておけば、お問い合わせにつながりやすいようにも思いますが、ぼくの場合、「うさんくさい」と思われやすい仕事内容であるが故に、まず慎重かつしっかりとした検討があってから、はじめて「ご相談・お問い合わせ」につながるので、メニューの中には「ご相談・お問い合わせ」はなくても良いと感じます。むしろ、「ご相談・お問い合わせ」がすぐに見える位置にあることで警戒されるまであるとすら思うのです。
その結果、「HOME」「サービス」「事業者情報」「（その他の）メニュー」という構成になりました。「見たい情報がないなら、「メニュー」を開けば、全部のページへのリンク一覧があるので探しやすい」と思ったからです。そうすると、ハンバーガーメニューに収めずとも収まるので、メニューはPCもスマートフォンも変わらず、そのまま表示させています。
ところで、このメニュー、実態は「サイトマップ」です。
「ハンバーガーメニューを開いたときのメニューはこんな感じ」「迷いにくい」がコンセプトにした方が良いと思ったため、後に、重要なページのデザインと同じに合わせる形にして、もう少し整えました。
アイコンの設置の必要性も特に感じなかったので、テキストリンクのみというシンプルさですが、将来的に、当方の知名度が上がってきたので直接サービスページに行くこともあるなど、需要に変化が生まれたら、メニューが増えるためにハンバーガーメニューを使用することはあるかもしれません。
リンクの並び順は「欲しいと思うであろう順番」を意識して整えています。ここは何を目的に訪れているかによっては多少のズレが生じるとは思うのですが、そこまで大量にページがあるわけではないので、問題はないはず……。
今後の制作について
運用面や実装コストも踏まえて時には代案も出しつつ、デザイナーと適時すり合わせを行いながら協力して対応し、最終的にデザイナー監修（チェック）を経てディレクター判断を仰ぐというやり方で対応していきますので、今回のような変更点が多いこともなく、また、こういった裏話が表に出ることもほぼないのでは、と考えています。
デザインと異なるところ一覧
全部「個人的な都合だろ」と言われちゃうと返す言葉はないのですが、一応、【仕様の都合】【要件の都合】は致し方なかった部分であり、【実装コストの都合】【制作時間の都合】は個人的な都合による部分であると認識して明記しています。
- 全体的なマージン・パディング【仕様の都合】
設定の範囲内で対応しているので、ピクセルパーフェクトというわけではありません。テーマの仕様内で選べる中で近しい値・ルールで設定をするという形にました。どうしてもデザインと大きく異なるなと感じた厳しいところは、スペーサーブロックを活用して工夫して対応しています。
- 全体的なコンテンツの大きさ・文字サイズ【要件の都合】
大体のサイズは合わせたけど、ピクセルパーフェクトというわけではありません。対象ターゲットの年齢層を配慮した結果、デザインよりも大きめところがあると思います。今回、スマートフォンのデザインは一部の提供でしたが、それでも、スマートフォンはおそらくデザインよりもやや大きめになっているのではないか、と思っています。
- 一部のスライダー【要件の都合】
「特徴」のところは、本当はスライダーだったのですが、ここは目的・用途を考えてスライダーではない方が良いと判断してスライダーにはしていません。
- ページ内リンク【要件の都合】
実装しながらもコンテンツの見直しをした結果、少なくとも、ぼくの事業サイトの場合、ページ内リンク自体、極力使わないようにした方が良いと判断したのでなくしました。後にページ内リンクが増えたものの、デザインも流用して作成しています。
- FAQのページ内リンク【要件の都合】
「ページ内リンク」のデザインがボタンっぽくて押せるものって分かりやすく、「このまま使わないのも勿体ないなー」と感じたこともあり、「ページ内リンク」のデザイン一部を使用して作成したのですが、Q&Aブロックに置き換えたことで、結局FAQのページ内リンク自体がなくなりました。
- 利用の流れのコンテンツ【仕様の都合】【要件の都合】
本当は、横に線があったんです。デザインは2列のデザインでした。このデザイン通りに作れなくはなかったものの、文章が長かったのでスマートフォンのときに読みづらいし、スマートフォンでは1列にカスタマイズした際の横の線を消すのもカスタマイズがややこしくなるなと懸念した結果、デザイナーに相談の上、1列のデザインの方向性を提案してもらい、1列のデザインに変更しました。ただ、今回は作った後のデザインの監修はお願いしていませんでしたので、この部分はデザインにできる限り合わせて自分で独自で作ったものになります。
- フロントページ（Home・トップページ）以外のページのメインビジュアル（タイトル）部分【要件の都合】
Home以外のページのメインビジュアル（タイトル）部分が「押せる」見た目だと思ったので、RPGゲームのメッセージウィンドウ風になるように変更しました（気づいている人がどれくらいいるのかが分からないのですが、Homeのメインビジュアル、「押せる」見た目だと思ったので、実はリンクになっています）
- グローバルメニューの「資料ダウンロード」ボタンとハンバーガーメニュー【要件の都合】
実装中にもコンテンツの再見直しをしていたのですが、「クリエイトアコードの事業サイトに訪れる人は何の情報を得たいのか？」と考えたときに、「まず、真っ先に資料ダウンロードをしたいと思うか？」という問いには「まずハードルが高いことから、「No」だ」と思ったので、今回のリニューアルを機に削除しました。お問い合わせボタンがないのは元からです。資料ダウンロード同様、まずは一通り見ないと「お問い合わせする」という選択をすることはないだろうと思ったためです。ハンバーガーメニューについては、「サイトマップについて（「メニュー」ハンバーガーメニューの廃止について）」で書いていますので、ここでは記載を省略します。
- リストのアイコン【実装コストの都合】
本当はデフォルトのデザインでは再現の難しいデザインのチェックアイコンだったりしたのですが、正直、ここだけのために直す感じになってしまうことから、実装コストを検討した結果、デフォルトのチェックアイコンでもそこまで見た目に支障はないなと感じたので、デフォルトのものを使用することにしました。ちょっと目立たないと感じたので、後日、チェックアイコンの色だけ変更しています。
- 途中にあるアラート系の枠（チェックリストのようなものとか）【制作時間の都合】
言い訳のしようもないくらい、ここは完全に自分都合です。オリジナルのカスタムブロックを作ればいい（でも、ぼくはまだ作れない）し、そうじゃなくてもCSSでアイコンを後付けするとか画像にするとか、やりようは色々とあったはずなのですが、諸般の事情（6月の指定の日までにリニューアルを完了させたかった）で時間がありませんでした。実装コストを考慮したわけじゃなくて純粋にここをデザイン通りにするための時間が足りませんでした。幸いなことに、デザインは異なるものの、プラグインのアラートブロックをにしてCSSで角丸に調整したところ、色味などが思ったよりもデザインに合っていたというか違和感がなかったため、「アラートブロックを設置してCSSクラスを当てはめて文章を書くだけでいい（または、他の既存のアラートブロックをコピーアンドペーストして中身を書き換えればいい）」という簡単さを考慮して、このままプラグインのアラートブロックを正式に採用することとしました。（Homeにある現在の対応状況は、元々のデザインでは違ったのですが、実装時に元の情報量よりも大幅に減らしたので、アラートブロックに変更しています）
- Homeにあるブログ記事一覧部分【仕様の都合】【要件の都合】
今回のリニューアルで事業サイトと事業ブログは内部的には「別サイト」扱いになっていますので、プラグインを使ってRSSで記事一覧情報を取得・表示させる必要が生じました。その結果、プラグインの仕様に表示内容を合わせた結果、デザインとは異なることになってしまいました。もう少しデザインに寄せることはできなくはなかったのですが、今の方が「リンクである」ことは分かりやすいので、このままとしています。ただ、最近（2026年5月時点）、事業ブログをこのはてなブログで運用する形に変更したので、どうしようかしら……。
- Homeのメインビジュアル【仕様の都合】【要件の都合】
これは、2026年に入ってからの話になりますが、「ファーストビュー、メインビジュアルで何を伝えるのか？」と「サービス」について見直した結果、メッセージの変更と対応内容（リンク）の変更が必要になったので、ここは、納品いただいているFigmaのデータを使って変更しています。デザインの見た目仕様は極力変わらないようにしています。
- サービス説明のフォルダ【仕様の都合】【要件の都合】
サービスの見直しが度々発生しているので、その都度、納品いただいているFigmaのデータを使って変更しています。デザインの見た目仕様は極力変わらないようにしています。
【裏話3】その他の裏話
パフォーマンス調整に関して
パフォーマンスの調整はできる限りのところで終えています。
今でも、可能な限りスピードインサイト（PageSpeed Insights）「携帯電話」でもオールグリーン（欲を言うなら全部100）の状態にしたいし、コアウェブバイタルの3つ指標（LCP・FID・CLS）もその方が良いとも考えているのですが、正直、日本国外からの計測であるとされている特性を考えると、計測した結果自体が参考値であること、極論を言うと「古き良き時代のHTMLだけで作った超シンプルな画像も何も使わないサイト」に近しい感じじゃないと達成が現実的ではないのではないか、とすら、個人的には考えてしまうのです。
テーマがデフォルトの状態でほぼプラグインを入れず、画像等の読み込みにも配慮するなら不可能じゃないんだろうけど、「ターゲットに合わせたWebサイト」「見た目にも適したサイト」の両方を達成しつつ高パフォーマンスを両立させることは難しいように思えます。
高パフォーマンスの方がいいにしても、高パフォーマンスを優先して他を犠牲にすることが必ずしもターゲットユーザーのためとは限らないだろうと考えた結果、今は悪い意味での完璧主義にならないように努めています。高スコア（高パフォーマンス）を求めるのであれば、高パフォーマンスを専門に対応している専門家にご相談いただく方が良いと思います。
クリエイトアコードの独自の基準としては「スマートフォンでWi-FiをOFFにした状態で閲覧したときに体感で閲覧で極端に遅いとか表示されないとか動作がもったりと重たく感じるとか、レイアウトが崩れた状態で読み込みが終わってしまうなどの問題がないこと」を考えています。実際、Ver2までほどじゃないけど、今のサイトもそこまで重たくないはず……！
（Webサイト制作実績のクリエイトアコードの事業用サイト内「【2022年10月13日追記】Cumulative Layout Shift（CLS）について」に書いているのですが、もし、高スコアが出せるなら、メインビジュアル画像自体をなくすという愚行はしていませんよ……）
お問い合わせフォームのシステム再変更について
詳しくは、別の記事にまとめて書いています。
create-accord-blog-purpose.hatenablog.com
改修完了が遅くなった理由について
主にこれから説明する「メールフォームのシステムエラーに伴うフォロー方法の構築」が最大要因です。
別件で対応しているときにお問い合わせフォームのシステムエラー時に検知する仕組みがないので、お問い合わせフォームが使えずに数日以上経過したときの機会損失をフォローする方法は多くはない（サイト全体のシステムエラー等の検知はあるが、お問い合わせフォーム「だけ」はないか有料か設定が難しい）のではないかと気づき、お問い合わせフォームのシステムエラーの検知をどのように行うのかのフォロー方法の構築と検証を行うことになったので、それの目途がついてから切り替えを使用とした結果、1ヶ月近く経過してしまいました。
再現を取る際、手っ取り早いのは「REST API」を無効化することだったのですが、もう一つが「Nonceの有効期限切れ」なので、それを待って、うまくいかないからと直したり、運用テストを実施したり……ということをしたら、時間がかかってしまい……。
今回は、AIアシスタント（Gemini）を使って制作しています。
悪戦苦闘・試行錯誤をした甲斐があり、実用に耐えられるものができました！
これについては、別途宣伝および詳細についても記事にしようと考えています。色々まとめてはあるものの、記事を書くのに数時間は要すると思うので、いつ公開するとは言えず……。公開したら読んでもらえたら嬉しいです。（流石に1年以内には公開したいとは思っていたのですが、既に5月なので、確約が難しいですね……）
おまけ「最後に」
裏話まで読んでいただいた方へ、相変わらず長い文章で恐縮です。
それでも、読んでいただいた人、ありがとうございました！
