WordPressからCloudflare Astroへ移行:安全で効率的な会社ホームページ運営の実例
会社ホームページをWordPressからCloudflare Pages + Astroに移行した方法を解説。生成AI活用やMarkdown運用、Gsapアニメーション導入など、効率的でセキュアな運営ノウハウを公開します。
会社ホームページをWordPressからCloudflare Astroに移行しました
創業当初、私たちもよくあるパターンで会社名・ドメイン・ホームページを取得しました。
テクノロジーイベントやManager向けイベントに参加する中で「会社ホームページは作らないの?」と言われ、急いでWordPressのテンプレートを利用して最初のホームページを作ったのが始まりです。
初期のWordPress運用と工夫
当時は生成AIも登場し始めた頃でした。
- デザインを生成AIに作成させる
- 適当な画像を貼って雰囲気を出す
- Gsapを用いたSVGアニメーションでアーキテクチャ図を動かす
といった工夫をし、「それっぽく」見せることを優先していました。
こうした実験は楽しかったものの、運営面では少しずつ課題が出てきました。
WordPress運営の課題
ホームページを公開している以上、Botやスパムからの攻撃は避けられません。
WordPressでは、コメント欄を非公開にしても、APIを介して投稿されるケースがあり、対応に追われることが日々のストレスになっていました。
主な課題
- Botによる自動投稿やスパムコメント
- 不要なプラグインの増加によるセキュリティリスク
- コンテンツ更新の度にバックエンド管理の手間が増加
こうした背景から、「WordPress以外の運用」を検討することになりました。
Cloudflare Pages + Astroへの移行
考えた末に選んだのがCloudflare Pages + Astroです。
選定理由
- 無料で静的サイトをホストできる
- セキュアな運用が可能(Bot対策も容易)
- Markdownでコンテンツ作成が可能
- 生成AIとの連携が容易で、ドラフトからレビューまでスムーズ
以前、実験的に触ったことがありましたが、今回の移行でCloudflareの提供するサービスの充実ぶりも再認識できました。
デザイン・構成の改善
以前のWordPressサイトは黒基調で、多機能なテンプレートを使うことで様々なことが可能でした。しかし、会社ホームページにおいて「過剰な機能は本当に必要か?」と考え、今回はシンプルな構成に刷新しました。
改善ポイント
- デザイン刷新: 黒基調 → クリーンで見やすい配色
- 不要な機能削減: 多機能テンプレートの過剰装備を排除
- アニメーションの最適化: Gsapで必要な箇所のみアニメーションを適用
- コンテンツ作成の効率化: Markdown + 生成AIでドラフト作成 → レビュー
この結果、デザインは軽快で視認性が高く、記事作成も容易になりました。
移行作業の流れ
移行作業自体は段階的に進めました。
- 既存WordPressサイトのコンテンツ整理・優先度決定
- Astroプロジェクトの作成、Cloudflare Pagesに接続
- Markdownベースでコンテンツを移行
- デザインの生成AI支援、Gsapアニメーションの組み込み
- デプロイ後の動作確認とBot対策
結果として、以前のWordPressサイトに比べ、更新・管理コストが大幅に削減されました。
今後の展望
今年はこれまでの経験を活かし、以下の取り組みを進めています。
- 複数サービスごとのLanding Page作成
- 今回のCloudflare Pages + Astro構成を活用した高速かつ安全な公開
- Markdown + 生成AIによる効率的な記事更新
すでにいくつかのサービスページは公開済みで、今後も順次拡張していく予定です。
最後に
会社ホームページは、単なる情報提供の場ではなく、技術的チャレンジや運営方針を伝える場にもなります。
今回の移行により、安全で管理しやすく、コンテンツ作成が楽しい環境を整えることができました。
今後も、この構成をベースにサービス情報や技術情報を発信していきたいと考えています。