本日は、KARMA Studio公式サイトの表示調整と、ページ表示速度の改善作業を行いました。
最近はゲーム紹介ページやトップページの導線を整えてきましたが、今回はその仕上げとして、見た目の安定化と画像読み込みの軽量化を中心に修正しています。
トップページと見出し周りを調整しました
まず、トップページや投稿ページ、紹介ページの見出し装飾を見直しました。
トップページでは、サイト全体の雰囲気に合うように、見出しのあしらいを調整しています。
一方で、投稿ページやお知らせページでは、装飾が強すぎると文字が読みづらくなるため、シンプルな下線表現に変更しました。
見た目の統一感を保ちながら、読みやすさを優先した調整です。
ゲーム紹介ページの導線も整理しました
各ゲーム紹介ページでは、ページ同士を行き来しやすいように内部リンクを追加しました。
これにより、ひとつのゲーム紹介を見たあとに、ほかのゲーム紹介ページへ移動しやすくなっています。
また、「ゲームで遊ぶ」「ゲーム一覧へ戻る」などの導線も確認し、利用者が迷わず移動できるように整理しました。
画像のWebP対応を進めました
今回の大きな改善点として、トップページで使っている主要画像をWebP形式に対応しました。
WebPは、画像の見た目を保ちながらファイルサイズを小さくしやすい形式です。
これにより、ページを開いたときの読み込み負担を減らすことができます。
対象にした主な画像は、トップのヒーロー画像、ゲームカード画像、セクション画像、バナー画像などです。
元画像は残したまま、WebP画像を追加し、対応できる画像から順番に切り替えています。
途中で表示エラーが出る場面もありましたが、バックアップから復旧し、安全な方法で再調整しました。
PageSpeedも改善しました
画像の最適化とWebP対応により、PageSpeed Insightsの結果にも改善が見られました。
特にデスクトップ表示では、大きくスコアが改善しました。
モバイル表示については、まだ改善の余地がありますが、今回の作業でサイト全体の表示負荷は軽くなっています。
今後、必要に応じてCSSやJavaScriptの整理も検討しますが、表示崩れのリスクがあるため、今回は安全な範囲で画像改善を中心に進めました。
今回の修正内容まとめ
今回行った主な作業は以下です。
- トップページ見出しの調整
- 投稿ページ・お知らせページの見出し調整
- ゲーム紹介ページの内部リンク追加
- 主要画像のWebP対応
- 画像読み込みの軽量化
- PageSpeed改善
- 表示崩れや重大エラーの復旧確認
- トップページ、ゲーム一覧、投稿ページ、紹介ページの表示確認
今後について
KARMA Studio公式サイトの大きな修正は、今回で一区切りです。
今後は、AIオーケストレーション開発やゲーム開発へ戻りながら、必要に応じてサイト側の細かな改善も続けていきます。
KARMA Studioでは、これからも遊びやすく、見やすく、気軽に楽しめるゲームサイトを目指して整えていきます。