Astroでフルリニューアルした自社コーポレートサイト
プロジェクト概要
当社のコーポレートサイトは、最新のフロントエンドフレームワークである
Astro を採用して、約1か月半でフルリニューアルを行いました。
旧サイトは「何をしている会社なのか」「どこが強みなのか」が伝わりづらく、事業内容や実績が散らばっている状態でした。
そこで今回は、単なるデザイン変更ではなく、
ブランド刷新・問い合わせ導線の整理・採用情報の強化を柱に、情報設計（IA）から見直しています。
画像やアイコン、見出し構成などのビジュアル要素はすべて社内で制作。 実績アイコンについては ChatGPT を活用して色合いやトーンを統一し、それ以外の素材はすべて自前で用意することで、 当社らしい世界観を持ったサイトに仕上げました。
制作のポイント
- Astro採用による高速・軽量な構成
不要なJavaScriptを極力排除し、HTMLとCSSを中心とした構成とすることで、表示速度と安定性を重視しました。 Core Web Vitals を意識したビルドにより、従来サイトと比べて体感の読み込み速度が大きく向上しています。 - ブランド刷新と情報設計の再構築
kintoneのイメージカラーと自社のコーポレートカラー（オレンジ系）を掛け合わせたグラデーションを基調とし、 事業カテゴリ・実績・取り組み・採用情報を整理。トップページから「どんな会社で、何が得意なのか」が 一目で分かる構成にしました。 - GA4 を前提にした“育てるサイト”設計
Google Analytics 4（GA4）での計測を前提に、重要ページやCTAボタン、スクロール深度が追いやすい構造に。 公開後は実際のアクセスデータをもとに、導線の改善やコンテンツの見直しを継続しています。 - SEO / AIO（AI検索最適化）への配慮
メタタグやOGP、構造化データなどの基本的なSEO対策に加え、 見出し階層と本文の情報粒度を整理することで、検索エンジンや生成AIにとっても読み取りやすいページ構造を意識しました。 - 完全レスポンシブ対応とUX改善
PC・スマホ・タブレットそれぞれで見やすいレイアウトを設計し、 「読みやすく、迷わず、問い合わせや採用情報にたどり着ける」導線づくりを行っています。 - GitHub管理とビルド環境の整備
GitHubでコードを管理し、npm run build/npm run build:testによる本番・テスト環境を用意。 コンテンツを更新しながら、安定して改善を続けられる体制を整えました。
リニューアル後の効果
リニューアル後は、ページ構成の整理と表示速度の向上により、
ページ滞在時間が昨年より確実に増加しました。
以前は「ぱっと見ただけで閉じられてしまう」ケースも多かったのに対し、現在は 事業内容や実績、取り組みページをしっかり読んでもらえる傾向がGA4のデータから見えています。
また、kintoneユーザーを主なターゲットとして、色味や表現を意識的に寄せたことで、 「kintoneやDXに強い会社」という印象を持ってもらいやすいブランドイメージに刷新できました。 コーポレートサイト自体が、営業トークや名刺代わりの説明ツールとしても活躍しています。
こうした自社での取り組み・検証結果を、そのままお客様のホームページ制作・リニューアルにも活かすことで、 “作って終わり”ではなく、“運用しながら育てていくWebサイト”のご提案が可能になっています。
