トップ/事例/Headless CMSサイト構築
受託開発

Strapi + Next.js Headless CMSサイト構築
Lighthouse100点・非エンジニアでも更新可能

コーポレートサイト・採用サイト・オウンドメディアをHeadless CMS(Strapi)+ Next.jsで構築。表示速度・SEO・更新性の3要素を全て高水準で実現。担当者がエンジニアに依頼せずにコンテンツを更新できる体制を整えました。

クライアント

各種企業
(コーポレート・採用・メディア)

課題

WordPressサイトの表示が遅くSEOに不利。コンテンツ更新のたびにエンジニアへ依頼が必要で運用コストが高い

サービス

受託開発
(Strapi + Next.js / WordPress)

開発成果

100

Lighthouseスコア
(Performance)

非エンジニア

でも更新可能
(直感的なCMS UI)

3

ページ表示速度改善
(旧WordPressサイト比)

課題:WordPressの速度とSEOの限界

多くの企業がWordPressでサイトを運営していますが、プラグインの多用によるページ速度の低下・Core Web Vitalsスコアの悪化・SEO評価への悪影響が課題となっていました。また、HTMLやCSS を理解していないとコンテンツ更新が難しく、更新のたびにエンジニアへの依頼が必要で運用コストが高くなっていました。

解決策:Headless CMS × SSG/ISRで速度と更新性を両立

  • StrapiをヘッドレスCMSとしてAPIサーバーに配置、コンテンツ管理はStrapiのGUI
  • Next.jsでSSG(静的サイト生成)+ ISR(増分静的再生成)を組み合わせ、表示速度とコンテンツ更新性を両立
  • Vercelへのデプロイで世界規模のCDNによる高速配信を実現
  • 画像はNext.js Image最適化 + WebP変換で軽量化
  • 構造化データ(Schema.org)・OGP・サイトマップを自動生成してSEO強化
  • 担当者向けの「更新マニュアル」を作成し、Strapi管理画面から直接更新可能に

WordPressを活用するケースも

予算・スケジュール・要件によっては、WordPressベースのフルカスタマイズ対応も行っています。ACF(Advanced Custom Fields)を活用した管理画面の使いやすさ向上、Gutenbergカスタムブロックの実装など、WordPressの枠組みの中でも高品質なサイトを提供しています。

成果・効果

Lighthouseスコアが全項目で90点以上(パフォーマンス100点)を達成し、Google検索での表示順位が改善されました。コンテンツ更新を担当者が自力で行えるようになり、月次のエンジニア依頼コストがゼロになりました。

Webサイト・メディア構築のご相談はお気軽に

表示速度・SEO・更新性、どれを優先するかもご相談ください。最適な技術選定をご提案します。